From 0d727813d5464a3d2b6da4b6c6002256ffa4eaae Mon Sep 17 00:00:00 2001 From: ntr Date: Sat, 9 Nov 2019 13:32:25 +1100 Subject: [PATCH] fix animations with stroke issues --- client/animations.test.js | 11 ------ client/src/animations.socket.jsx | 48 ++++++++++++++++----------- client/src/components/anims/chaos.jsx | 1 + client/src/components/anims/slay.jsx | 3 +- 4 files changed, 31 insertions(+), 32 deletions(-) diff --git a/client/animations.test.js b/client/animations.test.js index b6cbc772..ece98666 100644 --- a/client/animations.test.js +++ b/client/animations.test.js @@ -1,14 +1,3 @@ require('./assets/styles/styles.less'); -require('./assets/styles/menu.less'); -require('./assets/styles/nav.less'); -require('./assets/styles/footer.less'); -require('./assets/styles/account.less'); -require('./assets/styles/controls.less'); -require('./assets/styles/instance.less'); -require('./assets/styles/vbox.less'); -require('./assets/styles/game.less'); -require('./assets/styles/player.less'); -require('./assets/styles/styles.mobile.less'); -require('./assets/styles/instance.mobile.less'); require('./src/animations.test.jsx'); diff --git a/client/src/animations.socket.jsx b/client/src/animations.socket.jsx index edd822c6..ae99e1cc 100644 --- a/client/src/animations.socket.jsx +++ b/client/src/animations.socket.jsx @@ -30,46 +30,54 @@ function createSocket(store) { if (animating) return false; store.dispatch(actions.setAnimating(true)); // stop fetching the game state til animations are done + return eachSeries(newRes, (r, cb) => { - if (['Disable', 'TargetKo'].includes(r.event[0])) return cb(); - - // convert server enum into anims keywords - // todo make serersideonly - const sequence = animations.getSequence(r); - const timeout = animations.getTime(sequence); - const anims = animations.getObjects(r, sequence, game, account); - const text = animations.getText(r, sequence); + if (!r.event) return cb(); + const timeout = animations.getTime(r.stages); + const anims = animations.getObjects(r, game, account); + const text = animations.getText(r); store.dispatch(actions.setAnimFocus(animations.getFocusTargets(r, game))); + if (anims.animSkill) store.dispatch(actions.setAnimSkill(anims.animSkill)); - if (sequence.includes('START_SKILL') && anims.animSource) store.dispatch(actions.setAnimSource(anims.animSource)); - if (sequence.includes('END_SKILL') && anims.animTarget) { + if (r.stages.includes('START_SKILL') && anims.animSource) { + store.dispatch(actions.setAnimSource(anims.animSource)); + } + + if (r.stages.includes('END_SKILL') && anims.animTarget) { store.dispatch(actions.setAnimTarget(anims.animTarget)); - if (!['Banish', 'Invert'].includes(removeTier(anims.animTarget.skill))) store.dispatch(actions.setAnimCb(cb)); + if (animations.isCbAnim(anims.animSkill)) store.dispatch(actions.setAnimCb(cb)); } - if (sequence.includes('POST_SKILL' && text)) { + + if (r.stages.includes('POST_SKILL') && text) { // timeout to prevent text classes from being added too soon - setTimeout( - () => store.dispatch(actions.setAnimText(text)), - timeout - TIMES.POST_SKILL_DURATION_MS - ); + if (timeout === TIMES.POST_SKILL_DURATION_MS) { + store.dispatch(actions.setAnimText(text)); + } else { + setTimeout( + () => store.dispatch(actions.setAnimText(text)), + timeout - TIMES.POST_SKILL_DURATION_MS + ); + } } + return setTimeout(() => { + store.dispatch(actions.setAnimSkill(null)); store.dispatch(actions.setAnimSource(null)); store.dispatch(actions.setAnimTarget(null)); store.dispatch(actions.setAnimText(null)); store.dispatch(actions.setAnimFocus([])); - if (!sequence.includes('END_SKILL') - || ['Banish', 'Invert'].includes(removeTier(anims.animTarget.skill))) return cb(); - return true; + if (r.stages.includes('END_SKILL') && animations.isCbAnim(anims.animSkill)) return true; + return cb(); }, timeout); }, err => { if (err) return console.error(err); // clear animation state + store.dispatch(actions.setAnimSkill(null)); store.dispatch(actions.setAnimSource(null)); store.dispatch(actions.setAnimTarget(null)); store.dispatch(actions.setAnimText(null)); store.dispatch(actions.setAnimating(false)); - + store.dispatch(actions.setGameEffectInfo(null)); store.dispatch(actions.setSkip(false)); // set the game state so resolutions don't fire twice diff --git a/client/src/components/anims/chaos.jsx b/client/src/components/anims/chaos.jsx index d009c116..94bd40b4 100644 --- a/client/src/components/anims/chaos.jsx +++ b/client/src/components/anims/chaos.jsx @@ -20,6 +20,7 @@ function projectile(x, y, radius, colour) { cy={y} r={radius} fill={colour} + stroke="none" filter={colour === '#a52a2a' ? 'url(#chaosRedFilter)' : 'url(#chaosBlueFilter)'} /> ); diff --git a/client/src/components/anims/slay.jsx b/client/src/components/anims/slay.jsx index 68654ea8..31bc57d2 100644 --- a/client/src/components/anims/slay.jsx +++ b/client/src/components/anims/slay.jsx @@ -20,6 +20,7 @@ function projectile(x, y, radius, colour) { @@ -28,7 +29,7 @@ function projectile(x, y, radius, colour) { function sword(colour) { return ( - + ); }