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

put animation skill into state

Browse Source
This commit is contained in:
Mashy 2019-10-05 13:14:44 +10:00
parent c8dddcc094
commit 5fb7f157b4
7 changed files with 18 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
client/animations.test.js
View File

@ -9,6 +9,6 @@ require('./assets/styles/vbox.less');
require('./assets/styles/game.less');
require('./assets/styles/player.less');
require('./assets/styles/styles.mobile.css');
require('./assets/styles/instance.mobile.css');
require('./assets/styles/instance.mobile.less');
require('./src/animations.test.jsx');

2
client/package.json
View File

@ -41,7 +41,7 @@
"babel-plugin-module-resolver": "^3.2.0",
"babel-preset-es2015": "^6.24.1",
"babel-preset-react": "^6.24.1",
"eslint": "^5.6.0",
"eslint": "^5.16.0",
"eslint-config-airbnb-base": "^13.1.0",
"eslint-plugin-import": "^2.14.0",
"eslint-plugin-react": "^7.11.1",

1
client/src/actions.jsx
View File

@ -4,6 +4,7 @@ export const setActiveConstruct = value => ({ type: 'SET_ACTIVE_CONSTRUCT', valu
export const setAnimating = value => ({ type: 'SET_ANIMATING', value });
export const setAnimCb = value => ({ type: 'SET_ANIM_CB', value });
export const setAnimFocus = value => ({ type: 'SET_ANIM_FOCUS', value });
export const setAnimSkill = value => ({ type: 'SET_ANIM_SKILL', value });
export const setAnimSource = value => ({ type: 'SET_ANIM_SOURCE', value });
export const setAnimTarget = value => ({ type: 'SET_ANIM_TARGET', value });
export const setAnimText = value => ({ type: 'SET_ANIM_TEXT', value });

1
client/src/animations.utils.jsx
View File

@ -68,6 +68,7 @@ function getObjects(resolution, stages, game, account) {
return {
animSource,
animTarget,
animSkill: event.skill,
};
}

12
client/src/components/targeting.arrows.jsx
View File

@ -9,8 +9,8 @@ const shapes = require('./shapes');
const { removeTier } = require('../utils');
const addState = connect(
({ game, account, animTarget, animating, itemInfo }) =>
({ game, account, animTarget, animating, itemInfo })
({ game, account, animSkill, animating, itemInfo }) =>
({ game, account, animSkill, animating, itemInfo })
);
class TargetSvg extends Component {
@ -28,15 +28,15 @@ class TargetSvg extends Component {
}
render(props, state) {
const { game, account, animating, animTarget, itemInfo } = props;
const { game, account, animating, animSkill, itemInfo } = props;
const { width, height } = state;
if (!game) return false; // game will be null when battle ends
// resolutions happening
// just put skill name up
if (animating) {
if (!animTarget) return false;
const itemSource = itemInfo.combos.filter(c => c.item === removeTier(animTarget.skill));
if (!animSkill) return false;
const itemSource = itemInfo.combos.filter(c => c.item === removeTier(animSkill));
const itemSourceInfo = itemSource.length
? `${itemSource[0].components[0]} ${itemSource[0].components[1]} ${itemSource[0].components[2]}`
: false;
@ -44,7 +44,7 @@ class TargetSvg extends Component {
const itemSourceDescription = reactStringReplace(itemSourceInfo, itemRegEx, match => shapes[match]());
return (
<div class="resolving-skill">
<h1>{animTarget.skill}</h1>
<h1>{animSkill}</h1>
<div> {itemSourceDescription} </div>
</div>
);

6
client/src/events.jsx
View File

@ -73,6 +73,7 @@ function registerEvents(store) {
const anims = animations.getObjects(r, sequence, game, account);
const text = animations.getText(r, sequence);
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) {
@ -87,17 +88,18 @@ function registerEvents(store) {
);
}
return setTimeout(() => {
const animSkill = anims.animTarget ? removeTier(anims.animTarget.skill) : false;
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') || (animSkill && ['Banish', 'Invert'].includes(animSkill))) return cb();
if (!sequence.includes('END_SKILL') || (anims.animSkill && ['Banish', 'Invert'].includes(anims.animSkill))) return cb();
return true;
}, 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));

7
client/src/reducers.jsx
View File

@ -1,10 +1,8 @@
function createReducer(defaultState, actionType) {
return function reducer(state = defaultState, action) {
switch (action.type) {
case actionType:
return action.value;
default:
return state;
case actionType: return action.value;
default: return state;
}
};
}
@ -18,6 +16,7 @@ module.exports = {
animating: createReducer(false, 'SET_ANIMATING'),
animCb: createReducer(null, 'SET_ANIM_CB'),
animSkill: createReducer(null, 'SET_ANIM_SKILL'),
animSource: createReducer(null, 'SET_ANIM_SOURCE'),
animFocus: createReducer(null, 'SET_ANIM_FOCUS'),
animTarget: createReducer(null, 'SET_ANIM_TARGET'),