ntr/mnml
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

messing with anims full Pepega

Browse Source
This commit is contained in:
Mashy
2019-06-14 00:10:51 +10:00
parent 23083dc0f5
commit b0faf0c33b
5 changed files with 37 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files
client/src/components/anims/attack.jsx
+14 -14
View File
@@ -10,22 +10,24 @@ class Attack extends Component {
constructor(props) {
super();
this.props = props;
this.graphic = (
<g>
<polygon class='blue' points={'0,0 100,50 300,400'}/>
<polygon class='blue' points={'40,170 100,50 160,170'}/>
<polygon class='blue' points={'70,150 100,50 130,150'}/>
</g>
);
}
render() {
return (
<svg
id={this.props.id}
class={`attack-anim skill-animation ${this.props.stage}`}
class={`attack-anim-${this.props.id}`}
version="1.1"
id="Layer_1"
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 300 300">
<g>
<polygon class='blue' points={'0,190 100,50 190,190'}/>
<polygon class='blue' points={'40,170 100,50 160,170'}/>
<polygon class='blue' points={'70,150 100,50 130,150'}/>
</g>
viewBox="0 0 300 400">
${this.graphic}
</svg>
);
}
@@ -35,22 +37,20 @@ class Attack extends Component {
if ((!this.props.team && this.props.stage === 'START_SKILL')
|| (this.props.team && this.props.stage === 'END_SKILL')) {
anime.set('.attack-anim', {
translateY: -250,
rotateX: 180,
rotateX: 0,
});
value = '+=250px';
value = '+=250px',
}
if ((!this.props.team && this.props.stage === 'END_SKILL')
|| (this.props.team && this.props.stage === 'START_SKILL')) {
anime.set('.attack-anim', {
translateY: 0,
rotateX: 0,
});
value = '-=250px';
value = '-=250px',
}
anime({
targets: ['.attack-anim'],
targets: [`.attack-anim-${this.props.id} polygon`],
translateY: {
value,
duration,