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

parry fixes and curse change

Browse Source
This commit is contained in:
ntr 2019-07-02 22:26:02 +10:00
parent 8dd3a923ec
commit 6070df8bd0
3 changed files with 21 additions and 28 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
client/src/components/anims/curse.jsx
View File

@ -17,7 +17,7 @@ class Curse extends Component {
return (
<svg
id='curse'
class="skill-animation blue"
class="skill-animation"
version="1.1"
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 198 200">
@ -30,10 +30,16 @@ class Curse extends Component {
</feMerge>
</filter>
</defs>
<g filter="url(#curseFilter)">
<ellipse cx="100" cy="100" rx="30" ry="30"/>
<ellipse cx="100" cy="100" rx="60" ry="60"/>
<ellipse cx="100" cy="100" rx="90" ry="90"/>
<g filter="url(#curseFilter)" class="blue" >
<circle cx="100" cy="100" r="30" />
<circle cx="100" cy="100" r="60" />
<circle cx="100" cy="100" r="90" />
</g>
<g class="white" style={{ strokeWidth: '2px' }}>
<circle cx="100" cy="100" r="30" />
<circle cx="100" cy="100" r="60" />
<circle cx="100" cy="100" r="90" />
</g>
</svg>
);
@ -50,13 +56,10 @@ class Curse extends Component {
}));
this.animations.push(anime({
targets: ['#curse'],
scale: [0.5, 1],
stroke: [COLOURS.WHITE, COLOURS.BLUE],
strokeWidth: [8, 0],
filter: [`drop-shadow(0 0 5px ${COLOURS.WHITE}`, `drop-shadow(0 0 5px ${COLOURS.BLUE}`],
easing: 'easeOutSine',
delay: TIMES.TARGET_DELAY_MS,
targets: ['#curse circle'],
r: 0,
easing: 'easeInSine',
delay: TIMES.TARGET_DURATION_MS * 0.4,
duration: TIMES.TARGET_DURATION_MS,
}));
}

10
client/src/components/anims/heal.jsx
View File

@ -58,16 +58,6 @@ class Heal extends Component {
easing: 'easeInOutSine',
}));
// this.animations.push(anime({
// targets: '.skill-anim',
// translateY: 0,
// translateX: 0,
// loop: false,
// delay: TIMES.TARGET_DELAY_MS,
// duration: (duration * 1 / 2),
// easing: 'easeInQuad',
// }));
this.animations.push(anime({
targets: ['#heal circle'],
cx: 150,

12
client/src/components/anims/parry.jsx
View File

@ -43,8 +43,8 @@ class Parry extends Component {
this.animations.push(anime({
targets: ['#parry'],
opacity: [
{ value: 1, delay: TIMES.TARGET_FADE_IN_DELAY, duration: TIMES.TARGET_FADE_IN_DURATION },
{ value: 0, delay: TIMES.TARGET_FADE_OUT_DELAY, duration: TIMES.FADE_OUT_DURATION },
{ value: 1, delay: TIMES.TARGET_DELAY_MS, duration: TIMES.TARGET_DURATION_MS * 0.2 },
{ value: 0, delay: TIMES.TARGET_DURATION_MS * 0.6, duration: TIMES.TARGET_DURATION_MS * 0.2 },
],
easing: 'easeInOutSine',
}));
@ -52,20 +52,20 @@ class Parry extends Component {
this.animations.push(anime({
targets: ['#parry'],
rotateX: 180,
delay: TIMES.TARGET_FADE_IN_DELAY * 3,
delay: TIMES.TARGET_DELAY_MS * 2,
duration: TIMES.TARGET_DURATION_MS / 2,
easing: 'easeOutSine',
}));
this.animations.push(anime({
targets: ['#parryFilter feTurbulence', ' #parryFilter feDisplacementMap'],
targets: ['#parryFilter feTurbulence', '#parryFilter feDisplacementMap'],
baseFrequency: 2,
scale: 10,
numOctaves: 5,
easing: 'easeOutSine',
delay: TIMES.TARGET_FADE_IN_DELAY,
duration: TIMES.RESOLUTION_TOTAL_MS,
delay: TIMES.TARGET_DELAY_MS,
duration: TIMES.TARGET_DURATION_MS,
}));
}