convert timings
This commit is contained in:
@@ -35,8 +35,8 @@ class Amplify extends Component {
|
||||
this.animations.push(anime({
|
||||
targets: ['#amplify'],
|
||||
opacity: [
|
||||
{ value: 1, delay: TIMES.TARGET_DELAY_MS, duration: TIMES.TARGET_DELAY_MS },
|
||||
{ value: 0, delay: TIMES.TARGET_DURATION_MS, duration: TIMES.FADE_DURATION_MS },
|
||||
{ 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 },
|
||||
],
|
||||
easing: 'easeInOutSine',
|
||||
}));
|
||||
@@ -48,7 +48,7 @@ class Amplify extends Component {
|
||||
easing: 'easeInOutSine',
|
||||
|
||||
duration: TIMES.TARGET_DURATION_MS,
|
||||
delay: TIMES.TARGET_DELAY_MS,
|
||||
delay: TIMES.TARGET_FADE_IN_DELAY,
|
||||
}));
|
||||
|
||||
this.animations.push(anime({
|
||||
@@ -58,7 +58,7 @@ class Amplify extends Component {
|
||||
easing: 'easeInOutExpo',
|
||||
|
||||
duration: TIMES.TARGET_DURATION_MS,
|
||||
delay: TIMES.TARGET_DELAY_MS,
|
||||
delay: TIMES.TARGET_FADE_IN_DELAY,
|
||||
}));
|
||||
}
|
||||
|
||||
|
||||
@@ -11,7 +11,7 @@ function banish(id) {
|
||||
fill: '#fff',
|
||||
|
||||
easing: 'easeOutElastic',
|
||||
delay: TIMES.TARGET_DELAY_MS,
|
||||
delay: TIMES.TARGET_FADE_IN_DELAY,
|
||||
duration: TIMES.TARGET_DURATION_MS,
|
||||
});
|
||||
}
|
||||
|
||||
@@ -39,9 +39,9 @@ class Bash extends Component {
|
||||
this.animations.push(anime({
|
||||
targets: ['#bash'],
|
||||
opacity: [
|
||||
{ value: 1, delay: TIMES.TARGET_DELAY_MS, duration: TIMES.TARGET_DELAY_MS },
|
||||
{ value: 1, delay: TIMES.TARGET_FADE_IN_DELAY, duration: TIMES.TARGET_FADE_IN_DURATION },
|
||||
// this is badly behaved, nfi why
|
||||
{ value: 0, delay: TIMES.FADE_DELAY_MS / 2, duration: TIMES.FADE_DURATION_MS },
|
||||
{ value: 0, delay: TIMES.FADE_DELAY_MS / 2, duration: TIMES.FADE_OUT_DURATION },
|
||||
],
|
||||
easing: 'easeInOutSine',
|
||||
}));
|
||||
@@ -50,7 +50,7 @@ class Bash extends Component {
|
||||
targets: ['#bash'],
|
||||
scale: {
|
||||
value: 1,
|
||||
delay: TIMES.TARGET_DELAY_MS,
|
||||
delay: TIMES.TARGET_FADE_IN_DELAY,
|
||||
duration: TIMES.TARGET_DURATION_MS * 0.2,
|
||||
easing: 'easeInExpo',
|
||||
},
|
||||
@@ -67,7 +67,7 @@ class Bash extends Component {
|
||||
{ translateX: 0, translateY: 2 },
|
||||
],
|
||||
|
||||
delay: TIMES.TARGET_DELAY_MS + TIMES.TARGET_DURATION_MS * 0.1,
|
||||
delay: TIMES.TARGET_FADE_IN_DELAY + TIMES.TARGET_DURATION_MS * 0.1,
|
||||
duration: TIMES.TARGET_DURATION_MS * 0.2,
|
||||
easing: 'easeOutSine',
|
||||
}));
|
||||
@@ -79,7 +79,7 @@ class Bash extends Component {
|
||||
numOctaves: 5,
|
||||
easing: 'easeOutSine',
|
||||
|
||||
delay: TIMES.TARGET_DELAY_MS,
|
||||
delay: TIMES.TARGET_FADE_IN_DELAY,
|
||||
duration: TIMES.RESOLUTION_TOTAL_MS,
|
||||
}));
|
||||
}
|
||||
|
||||
@@ -36,8 +36,8 @@ class Block extends Component {
|
||||
this.animations.push(anime({
|
||||
targets: ['#block'],
|
||||
opacity: [
|
||||
{ value: 1, delay: TIMES.TARGET_DELAY_MS, duration: TIMES.TARGET_DELAY_MS },
|
||||
{ value: 0, delay: TIMES.TARGET_DURATION_MS, duration: TIMES.FADE_DURATION_MS },
|
||||
{ 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 },
|
||||
],
|
||||
easing: 'easeInOutSine',
|
||||
}));
|
||||
|
||||
@@ -31,8 +31,8 @@ class Buff extends Component {
|
||||
this.animations.push(anime({
|
||||
targets: ['#buff'],
|
||||
opacity: [
|
||||
{ value: 1, delay: TIMES.TARGET_DELAY_MS, duration: TIMES.TARGET_DELAY_MS },
|
||||
{ value: 0, delay: TIMES.TARGET_DURATION_MS, duration: TIMES.FADE_DURATION_MS },
|
||||
{ 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 },
|
||||
],
|
||||
easing: 'easeInOutSine',
|
||||
}));
|
||||
@@ -42,7 +42,7 @@ class Buff extends Component {
|
||||
points: '0,190 100,10 190,190',
|
||||
|
||||
easing: 'easeOutExpo',
|
||||
delay: TIMES.TARGET_DELAY_MS,
|
||||
delay: TIMES.TARGET_FADE_IN_DELAY,
|
||||
duration: TIMES.TARGET_DURATION_MS,
|
||||
}));
|
||||
|
||||
@@ -51,7 +51,7 @@ class Buff extends Component {
|
||||
points: '40,170 100,50 160,170',
|
||||
|
||||
easing: 'easeOutExpo',
|
||||
delay: TIMES.TARGET_DELAY_MS,
|
||||
delay: TIMES.TARGET_FADE_IN_DELAY,
|
||||
duration: TIMES.TARGET_DURATION_MS,
|
||||
}));
|
||||
|
||||
@@ -60,7 +60,7 @@ class Buff extends Component {
|
||||
points: '70,150 100,90 130,150',
|
||||
|
||||
easing: 'easeOutExpo',
|
||||
delay: TIMES.TARGET_DELAY_MS,
|
||||
delay: TIMES.TARGET_FADE_IN_DELAY,
|
||||
duration: TIMES.TARGET_DURATION_MS,
|
||||
}));
|
||||
}
|
||||
|
||||
@@ -43,8 +43,8 @@ class Curse extends Component {
|
||||
this.animations.push(anime({
|
||||
targets: ['#curse'],
|
||||
opacity: [
|
||||
{ value: 1, delay: TIMES.TARGET_DELAY_MS, duration: TIMES.TARGET_DELAY_MS },
|
||||
{ value: 0, delay: TIMES.TARGET_DURATION_MS, duration: TIMES.FADE_DURATION_MS },
|
||||
{ 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 },
|
||||
],
|
||||
easing: 'easeInOutSine',
|
||||
}));
|
||||
@@ -56,7 +56,7 @@ class Curse extends Component {
|
||||
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,
|
||||
delay: TIMES.TARGET_FADE_IN_DELAY,
|
||||
duration: TIMES.TARGET_DURATION_MS,
|
||||
}));
|
||||
}
|
||||
|
||||
@@ -32,8 +32,8 @@ class Debuff extends Component {
|
||||
this.animations.push(anime({
|
||||
targets: ['#debuff'],
|
||||
opacity: [
|
||||
{ value: 1, delay: TIMES.TARGET_DELAY_MS, duration: TIMES.TARGET_DELAY_MS },
|
||||
{ value: 0, delay: TIMES.TARGET_DURATION_MS, duration: TIMES.FADE_DURATION_MS },
|
||||
{ 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 },
|
||||
],
|
||||
easing: 'easeInOutSine',
|
||||
}));
|
||||
@@ -42,24 +42,24 @@ class Debuff extends Component {
|
||||
targets: ['#debuff .debuff-one'],
|
||||
points: '0,190 100,10 190,190',
|
||||
easing: 'easeOutExpo',
|
||||
delay: TIMES.TARGET_DELAY_MS,
|
||||
duration: TIMES.TARGET_DURATION_MS,
|
||||
delay: TIMES.TARGET_MAIN_DELAY,
|
||||
duration: TIMES.TARGET_MAIN_DURATION,
|
||||
}));
|
||||
|
||||
this.animations.push(anime({
|
||||
targets: ['#debuff .debuff-two'],
|
||||
points: '40,170 100,50 160,170',
|
||||
easing: 'easeOutExpo',
|
||||
delay: TIMES.TARGET_DELAY_MS,
|
||||
duration: TIMES.TARGET_DURATION_MS,
|
||||
delay: TIMES.TARGET_MAIN_DELAY,
|
||||
duration: TIMES.TARGET_MAIN_DURATION,
|
||||
}));
|
||||
|
||||
this.animations.push(anime({
|
||||
targets: ['#debuff .debuff-three'],
|
||||
points: '70,150 100,90 130,150',
|
||||
easing: 'easeOutExpo',
|
||||
delay: TIMES.TARGET_DELAY_MS,
|
||||
duration: TIMES.TARGET_DURATION_MS,
|
||||
delay: TIMES.TARGET_MAIN_DELAY,
|
||||
duration: TIMES.TARGET_MAIN_DURATION,
|
||||
}));
|
||||
}
|
||||
|
||||
|
||||
@@ -42,8 +42,8 @@ class Decay extends Component {
|
||||
this.animations.push(anime({
|
||||
targets: ['#decay'],
|
||||
opacity: [
|
||||
{ value: 1, delay: TIMES.TARGET_DELAY_MS, duration: TIMES.TARGET_DELAY_MS },
|
||||
{ value: 0, delay: TIMES.TARGET_DURATION_MS - TIMES.FADE_DURATION_MS, duration: TIMES.FADE_DURATION_MS },
|
||||
{ value: 1, delay: TIMES.TARGET_FADE_IN_DELAY, duration: TIMES.TARGET_FADE_IN_DURATION },
|
||||
{ value: 0, delay: TIMES.TARGET_FADE_OUT_DELAY - TIMES.FADE_DURATION_MS, duration: TIMES.FADE_OUT_DURATION },
|
||||
],
|
||||
easing: 'easeInOutSine',
|
||||
}));
|
||||
@@ -57,7 +57,7 @@ class Decay extends Component {
|
||||
transform: () => `rotate(${anime.random(-15, 15)})`,
|
||||
filter: [`drop-shadow(0 0 5px ${COLOURS.WHITE}`, `drop-shadow(0 0 5px ${COLOURS.BLUE}`],
|
||||
easing: 'easeOutSine',
|
||||
delay: TIMES.TARGET_DELAY_MS,
|
||||
delay: TIMES.TARGET_FADE_IN_DELAY,
|
||||
duration: TIMES.TARGET_DURATION_MS,
|
||||
}));
|
||||
}
|
||||
|
||||
@@ -43,8 +43,8 @@ class Haste extends Component {
|
||||
this.animations.push(anime({
|
||||
targets: ['#haste'],
|
||||
opacity: [
|
||||
{ value: 1, delay: TIMES.TARGET_DELAY_MS, duration: TIMES.TARGET_DELAY_MS },
|
||||
{ value: 0, delay: TIMES.TARGET_DURATION_MS, duration: TIMES.FADE_DURATION_MS },
|
||||
{ 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 },
|
||||
],
|
||||
easing: 'easeInOutSine',
|
||||
}));
|
||||
@@ -53,7 +53,7 @@ class Haste extends Component {
|
||||
targets: ['#haste g'],
|
||||
stroke: [COLOURS.GREEN, COLOURS.RED],
|
||||
easing: 'easeInOutSine',
|
||||
delay: TIMES.TARGET_DELAY_MS,
|
||||
delay: TIMES.TARGET_FADE_IN_DELAY,
|
||||
duration: TIMES.TARGET_DURATION_MS,
|
||||
}));
|
||||
|
||||
@@ -64,7 +64,7 @@ class Haste extends Component {
|
||||
numOctaves: 5,
|
||||
easing: 'easeInOutSine',
|
||||
|
||||
delay: TIMES.TARGET_DELAY_MS,
|
||||
delay: TIMES.TARGET_FADE_IN_DELAY,
|
||||
duration: TIMES.RESOLUTION_TOTAL_MS,
|
||||
}));
|
||||
}
|
||||
|
||||
@@ -48,8 +48,8 @@ class Hex extends Component {
|
||||
this.animations.push(anime({
|
||||
targets: ['#hex'],
|
||||
opacity: [
|
||||
{ value: 1, delay: TIMES.TARGET_DELAY_MS, duration: TIMES.TARGET_DELAY_MS },
|
||||
{ value: 0, delay: TIMES.TARGET_DURATION_MS, duration: TIMES.FADE_DURATION_MS },
|
||||
{ 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 },
|
||||
],
|
||||
easing: 'easeInOutSine',
|
||||
}));
|
||||
@@ -59,8 +59,8 @@ class Hex extends Component {
|
||||
points: '64 124.94732621931382 8.574 96.00354944613788 8.62269130211947 32.03166105954991 64 4 119.37730869788052 32.03166105954991 119.426 96.00354944613788',
|
||||
easing: 'easeOutExpo',
|
||||
|
||||
delay: TIMES.TARGET_DELAY_MS,
|
||||
duration: TIMES.TARGET_DURATION_MS,
|
||||
delay: TIMES.TARGET_MAIN_DELAY,
|
||||
duration: TIMES.TARGET_MAIN_DURATION,
|
||||
}));
|
||||
|
||||
this.animations.push(anime({
|
||||
@@ -69,8 +69,8 @@ class Hex extends Component {
|
||||
easing: 'easeInOutSine',
|
||||
direction: 'alternate',
|
||||
|
||||
delay: TIMES.TARGET_DELAY_MS,
|
||||
duration: TIMES.TARGET_DURATION_MS,
|
||||
delay: TIMES.TARGET_MAIN_DELAY,
|
||||
duration: TIMES.TARGET_MAIN_DURATION,
|
||||
}));
|
||||
}
|
||||
|
||||
|
||||
@@ -11,7 +11,7 @@ function invert(id) {
|
||||
easing: 'easeInOutElastic',
|
||||
|
||||
direction: 'alternate',
|
||||
delay: TIMES.TARGET_DELAY_MS,
|
||||
delay: TIMES.TARGET_FADE_IN_DELAY,
|
||||
duration: TIMES.TARGET_DURATION_MS,
|
||||
});
|
||||
}
|
||||
|
||||
@@ -43,8 +43,8 @@ class Block extends Component {
|
||||
this.animations.push(anime({
|
||||
targets: ['#block'],
|
||||
opacity: [
|
||||
{ value: 1, delay: TIMES.TARGET_DELAY_MS, duration: TIMES.TARGET_DELAY_MS },
|
||||
{ value: 0, delay: TIMES.TARGET_DURATION_MS, duration: TIMES.FADE_DURATION_MS },
|
||||
{ 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 },
|
||||
],
|
||||
easing: 'easeInOutSine',
|
||||
}));
|
||||
@@ -55,7 +55,7 @@ class Block extends Component {
|
||||
scale: 1,
|
||||
easing: 'easeOutSine',
|
||||
|
||||
delay: TIMES.TARGET_DELAY_MS,
|
||||
delay: TIMES.TARGET_FADE_IN_DELAY,
|
||||
duration: TIMES.TARGET_DURATION_MS,
|
||||
}));
|
||||
}
|
||||
|
||||
@@ -46,8 +46,8 @@ class Stun extends Component {
|
||||
this.animations.push(anime({
|
||||
targets: ['#stun'],
|
||||
opacity: [
|
||||
{ value: 1, delay: TIMES.TARGET_DELAY_MS, duration: TIMES.TARGET_DELAY_MS },
|
||||
{ value: 0, delay: TIMES.TARGET_DURATION_MS, duration: TIMES.FADE_DURATION_MS },
|
||||
{ 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 },
|
||||
],
|
||||
easing: 'easeInOutSine',
|
||||
}));
|
||||
@@ -59,7 +59,7 @@ class Stun extends Component {
|
||||
loop: true,
|
||||
|
||||
duration: TIMES.RESOLUTION_TOTAL_MS,
|
||||
delay: TIMES.TARGET_DELAY_MS,
|
||||
delay: TIMES.TARGET_FADE_IN_DELAY,
|
||||
}));
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user