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

fix animations with stroke issues

Browse Source
This commit is contained in:
ntr 2019-11-09 13:32:25 +11:00
parent b268c2997e
commit 0d727813d5
4 changed files with 31 additions and 32 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
client/animations.test.js
View File

@ -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');

48
client/src/animations.socket.jsx
View File

@ -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

1
client/src/components/anims/chaos.jsx
View File

@ -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)'}
/>
);

3
client/src/components/anims/slay.jsx
View File

@ -20,6 +20,7 @@ function projectile(x, y, radius, colour) {
<circle
cx={x}
cy={y}
stroke="none"
r={radius}
fill={colour}
/>
@ -28,7 +29,7 @@ function projectile(x, y, radius, colour) {
function sword(colour) {
return (
<polygon points='150,150 100,75, 150,300, 200,75' fill={colour} id="sword" filter="url(#slayFilter)"></polygon>
<polygon points='150,150 100,75, 150,300, 200,75' stroke="none" fill={colour} id="sword" filter="url(#slayFilter)"></polygon>
);
}