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

Merge branch 'anims-fixed' into anims-change

Browse Source
This commit is contained in:
ntr
2019-07-02 00:00:32 +10:00
parent c548d466e2 3e8634e6c7
commit 9bcfd6de15
15 changed files with 82 additions and 142 deletions
Download Patch File Download Diff File Expand all files Collapse all files
client/src/components/animations.jsx
+19 -23
View File
@@ -25,7 +25,7 @@ const SiphonTick = require('./anims/siphon.tick');
// const Test = require('./anims/test');
const { removeTier } = require('../utils');
const { removeTier, getCombatText } = require('../utils');
const colours = {
red: '#a52a2a',
@@ -37,23 +37,18 @@ const colours = {
white: '#FFFFFF',
};
const SOURCE_ANIM_MS = 1000;
const TARGET_ANIM_DELAY_MS = 500;
const TARGET_ANIM_MS = 1000;
const SOURCE_ANIM_MS = 850;
function animations(props) {
const { resolution, stage, player, construct, game, account } = props;
const { game, account, resolution, player, construct } = props;
if (!resolution) return false;
const [type, event] = resolution.event;
const [, event] = resolution.event;
if (!event.skill) return false;
if (!resolution.target) return false;
console.log(resolution);
const { stages } = resolution;
// source animation
if (resolution.source.id === construct.id) {
if (resolution.source.id === construct.id && stages.includes('START_SKILL')) {
const playerTeam = game.players.find(t => t.id === account.id);
const playerTeamIds = playerTeam.constructs.map(c => c.id);
const otherTeam = game.players.find(t => t.id !== account.id);
@@ -95,30 +90,30 @@ function animations(props) {
// target animation
const anim = text => {
console.log(text);
if (!text) return false;
if (!text || !stages.includes('END_SKILL')) return false;
const skill = removeTier(text);
if (skill === 'Bash' && type === 'Damage') return false;
// if (skill === 'Bash' && type === 'Damage') return false;
switch (skill) {
case 'Attack': return <Strike id={construct.id} stage={stage} team={player} colour={colours.white}/>;
case 'Attack': return <Strike id={construct.id} team={player} colour={colours.white}/>;
case 'Amplify': return <Amplify/>;
case 'Banish': return banish(construct.id);
case 'Bash': return <Bash />;
case 'Block': return <Block />;
case 'Buff': return <Buff />;
case 'Curse': return <Curse />;
case 'Blast': return <Blast id={construct.id} stage={stage} team={player}/>;
case 'Blast': return <Blast id={construct.id} team={player}/>;
case 'Debuff': return <Debuff />;
case 'Decay': return <Decay />;
case 'Strike': return <Strike id={construct.id} stage={stage} team={player} colour={colours.red}/>;
case 'Chaos': return <Chaos id={construct.id} team={player} colour={colours.purple}/>;
case 'Slay': return <Slay id={construct.id} team={player} colour={colours.yellow}/>;
case 'Heal': return <Heal id={construct.id} stage={stage} team={player} colour={colours.red}/>;
case 'Strike': return <Strike id={construct.id} team={player} colour={colours.red}/>;
case 'Chaos': return <Chaos id={construct.id} team={player}/>;
case 'Slay': return <Slay id={construct.id} team={player} />;
case 'Heal': return <Heal id={construct.id} team={player} />;
case 'Hex': return <Hex />;
case 'Haste': return <Haste />;
case 'Invert': return invert(construct.id);
case 'Siphon': return <Siphon id={construct.id} stage={stage} team={player} colour={colours.red}/>;
case 'SiphonTick': return <SiphonTick id={construct.id} stage={stage} team={player} colour={colours.red}/>;
case 'Siphon': return <Siphon id={construct.id} team={player} />;
case 'SiphonTick': return <SiphonTick id={construct.id} team={player} />;
case 'Stun': return <Stun />;
default: return false;
}
@@ -127,13 +122,14 @@ function animations(props) {
const combatAnim = anim(event.skill);
if (combatAnim) {
return (
<div class={`combat-anim`}>
<div class={'combat-anim'}>
{combatAnim}
</div>
);
}
return (<div></div>);
return (
<div></div>);
}
module.exports = animations;
client/src/components/anims/attack.jsx
+1 -1
View File
@@ -5,7 +5,7 @@ const anime = require('animejs').default;
const dagger = require('../svgs/dagger');
const { TIMES } = require('../../constants');
const duration = TIMES.START_SKILL;
const duration = TIMES.TARGET_DURATION_MS;
class Attack extends Component {
constructor(props) {
client/src/components/anims/blast.jsx
+1 -1
View File
@@ -5,7 +5,7 @@ const anime = require('animejs').default;
const { TIMES } = require('../../constants');
const { randomPoints } = require('../../utils');
const duration = TIMES.START_SKILL;
const duration = TIMES.TARGET_DURATION_MS;
function projectile(x, y, radius, colour) {
client/src/components/anims/chaos.jsx
+1 -1
View File
@@ -5,7 +5,7 @@ const anime = require('animejs').default;
const { TIMES } = require('../../constants');
const { randomPoints } = require('../../utils');
const duration = TIMES.START_SKILL;
const duration = TIMES.TARGET_DURATION_MS;
function projectile(x, y, radius, colour) {
return (
client/src/components/anims/heal.jsx
+1 -1
View File
@@ -5,7 +5,7 @@ const anime = require('animejs').default;
const { TIMES } = require('../../constants');
const { randomPoints } = require('../../utils');
const duration = TIMES.START_SKILL;
const duration = TIMES.TARGET_DURATION_MS;
function projectile(x, y, radius, colour) {
client/src/components/anims/siphon.jsx
+1 -1
View File
@@ -4,7 +4,7 @@ const anime = require('animejs').default;
const { TIMES } = require('../../constants');
const duration = TIMES.START_SKILL;
const duration = TIMES.TARGET_DURATION_MS;
class AttackCharge extends Component {
render() {
client/src/components/anims/siphon.tick.jsx
+1 -1
View File
@@ -4,7 +4,7 @@ const anime = require('animejs').default;
const { TIMES } = require('../../constants');
const duration = TIMES.START_SKILL;
const duration = TIMES.TARGET_DURATION_MS;
function projectile(x, y, radius, colour) {
client/src/components/anims/slay.jsx
+1 -1
View File
@@ -5,7 +5,7 @@ const anime = require('animejs').default;
const { TIMES } = require('../../constants');
const { randomPoints } = require('../../utils');
const duration = TIMES.START_SKILL;
const duration = TIMES.TARGET_DURATION_MS;
function projectile(x, y, radius, colour) {
client/src/components/anims/strike.jsx
+1 -1
View File
@@ -4,7 +4,7 @@ const anime = require('animejs').default;
const { TIMES } = require('../../constants');
const duration = TIMES.START_SKILL;
const duration = TIMES.TARGET_DURATION_MS;
function laser(dimensions, colour) {
client/src/components/game.construct.jsx
+5 -13
View File
@@ -2,7 +2,6 @@ const { connect } = require('preact-redux');
const preact = require('preact');
const range = require('lodash/range');
const actions = require('../actions');
const { STATS, eventClasses, getCombatText } = require('../utils');
const { ConstructAvatar } = require('./construct');
const animations = require('./animations');
@@ -75,20 +74,12 @@ function GameConstruct(props) {
let crypSkills = <div> &nbsp; </div>;
if (player) crypSkills = (<div class="skills"> {skills} </div>);
const [combatText, combatClass] = getCombatText(construct, resolution);
const combatTextClass = `combat-text ${combatClass}`;
const playerTeam = game.players.find(t => t.id === account.id);
const playerTeamIds = playerTeam.constructs.map(c => c.id);
const stage = resolution ? resolution.stage : false;
const combatInfo = animations({ game, account, resolution, stage, player, construct });
const effects = construct.effects.length
? construct.effects.map(c => <div key={c.effect}>{c.effect} - {c.duration}T</div>)
: <div>&nbsp;</div>;
const combatAnim = animations({ game, account, resolution, player, construct });
const combatText = getCombatText(resolution, construct);
return (
<div
onClick={() => selectSkillTarget(construct.id)}
@@ -98,10 +89,11 @@ function GameConstruct(props) {
{crypSkills}
<div class="stats"> {stats} </div>
<ConstructAvatar name={construct.name} id={construct.id} />
{combatInfo}
{combatAnim}
<div class={'combat-text'}> {combatText} </div>
<div class="effects"> {effects} </div>
</div>
);
}
module.exports = addState(GameConstruct);
module.exports = addState(GameConstruct);