remove getText anim.utils fn, add ko event as test

client/src/animations.utils.jsx

@@ -71,87 +71,6 @@ function getFocusTargets(resolution) {
     return [resolution.target];
 }
 
-function getText(resolution) {
-    const nullText = { text: null, constructId: null, life: null };
-    const [type, event] = resolution.variant;
-    function generatePostSkill() {
-        if (type === 'Ko') {
-            return { text: 'KO!', css: 'ko-transition' };
-        }
-
-        if (type === 'Disable') {
-            const { disable } = event;
-            return { text: `${disable}`, css: '' };
-        }
-
-        if (type === 'Immunity') {
-            return { text: 'IMMUNE', css: '' };
-        }
-
-        if (type === 'Damage') {
-            const { mitigation, colour } = event;
-            let { amount } = event;
-            let css = '';
-            if (colour === 'Green') {
-                css = 'green';
-                amount *= -1;
-            }
-            if (colour === 'Red') css = 'red';
-            if (colour === 'Blue') css = 'blue';
-
-            const mitigationText = mitigation
-                ? `(${mitigation})`
-                : '';
-            return { text: `${amount} ${mitigationText}`, css };
-        }
-
-        if (type === 'Healing') {
-            const { amount, overhealing } = event;
-            return { text: `${amount} (${overhealing} OH)`, css: 'green' };
-        }
-
-        if (type === 'Inversion') {
-            return { text: 'INVERT', css: '' };
-        }
-
-        if (type === 'Reflection') {
-            return { text: 'REFLECT', css: '' };
-        }
-
-        if (type === 'Effect') {
-            const { effect, duration, construct_effects: effects } = event;
-            return { text: `+ ${effect} ${duration}T`, css: '', effects };
-        }
-
-        if (type === 'Recharge') {
-            const { red, blue } = event;
-            if (red > 0 && blue > 0) return { text: `+${red}R +${blue}B`, css: 'rb' };
-            if (red > 0) return { text: `+${red}R`, css: 'red' };
-            if (blue > 0) return { text: `+${blue}B`, css: 'blue' };
-            return nullText;
-        }
-
-        if (type === 'Removal') {
-            const { effect, construct_effects: effects } = event;
-            if (!effect) {
-                return { text: 'Effect Removal', css: '', effects };
-            }
-            return { text: `-${effect}`, css: '', effects };
-        }
-        return false;
-    }
-
-    const { green, red, blue } = event.display;
-    const { text, css, effects } = generatePostSkill();
-    return {
-        css,
-        text,
-        effects,
-        life: { green, red, blue },
-        constructId: event.display.id,
-    };
-}
-
 function isCbAnim(skill) {
     return ['Attack', 'Blast', 'Siphon', 'SiphonTick', 'Strike', 'Chaos', 'Slay', 'Heal',
         'Buff', 'Amplify', 'Haste', 'Triage', 'TriageTick', 'Link', 'Hybrid', 'Intercept',
@@ -164,6 +83,5 @@ function isCbAnim(skill) {
 module.exports = {
     getFocusTargets,
     getObjects,
-    getText,
     isCbAnim,
 };

client/src/components/game.construct.anim.text.jsx

@@ -17,7 +17,7 @@ class AnimText extends preact.Component {
 
     componentDidUpdate(prevProps) {
         const { animText, construct } = this.props;
-        if (animText && animText !== prevProps.animText && animText.constructId === construct.id) {
+        if (animText && animText !== prevProps.animText && animText.target === construct.id) {
             anime({
                 targets: '.combat-text',
                 top: '40%',
@@ -29,7 +29,7 @@ class AnimText extends preact.Component {
 
     render() {
         const { construct, animText, animSkill, itemInfo } = this.props;
-        if (animText && animText.constructId === construct.id) {
+        if (animText && animText.target === construct.id) {
             const itemSourceDescription = () => {
                 const itemSource = itemInfo.combos.filter(c => c.item === removeTier(animSkill));
                 const itemSourceInfo = itemSource.length
@@ -39,30 +39,52 @@ class AnimText extends preact.Component {
                 return reactStringReplace(itemSourceInfo, itemRegEx, match => shapes[match]());
             };
 
-            const animationTextHtml = () => {
+            const generateAnimText = () => {
-                // monkaW hack to make red / blue recharge work nicely
+                const [type, event] = animText.variant;
-                if (animText.css === 'rb') {
+                if (type === 'Ko') return <h1><span>KO!</span></h1>;
-                    const text = animText.text.split(' ');
+                if (type === 'Disable') {
-                    return (
+                    const { disable } = event;
-                        <h1>
+                    return <h1><span>{disable}</span></h1>;
-                            <span class="red">{text[0]}</span>&nbsp;
-                            <span class="blue">{text[1]}</span>
-                        </h1>
-                    );
                 }
-                return (
+                if (type === 'Immunity') return <h1><span>IMMUNE</span></h1>;
-                    <h1 class={animText.css}>
+                if (type === 'Damage') {
-                        <span>{animText.text}</span>
+                    const { mitigation, colour } = event;
-                    </h1>
+                    let { amount } = event;
-                );
+                    amount *= -1;
+                    const mitigationText = mitigation ? `(${mitigation})` : '';
+                    return <h1><span class={colour.toLowerCase()}>{amount} {mitigationText} </span></h1>;
+                }
+                if (type === 'Healing') {
+                    const { amount, overhealing } = event;
+                    return <h1><span>{amount} ({overhealing}OH)</span></h1>;
+                }
+                if (type === 'Inversion') return <h1><span>INVERT</span></h1>;
+                if (type === 'Reflection') return <h1><span>REFLECT</span></h1>;
+                if (type === 'Effect') {
+                    const { effect, duration } = event;
+                    return <h1><span>+{effect} {duration}T</span></h1>;
+                }
+                if (type === 'Recharge') {
+                    const { red, blue } = event;
+                    if (red > 0 && blue > 0) {
+                        return <h1><span class="red">`+{red}R</span><span class="blue">+{blue}B</span></h1>;
+                    }
+                    if (red > 0) return <h1><span class="red">`+{red}R</span></h1>;
+                    if (blue > 0) return <h1><span class="blue">`+{blue}R</span></h1>;
+                }
+                if (type === 'Removal') {
+                    const { effect } = event;
+                    if (!effect) return <h1><span>Effect Removal</span></h1>;
+                    return <h1><span>{effect}</span></h1>;
+                }
+                return false;
             };
 
-
             return (
                 <div class="combat-text">
                     <h2><span>{animSkill}</span></h2>
                     <span>{itemSourceDescription()}</span>
-                    {animationTextHtml()}
+                    {generateAnimText()}
                 </div>
             );
         }

client/src/components/game.construct.effect.box.jsx

@@ -22,7 +22,10 @@ const addState = connect(
 class GameConstructEffects extends preact.Component {
     shouldComponentUpdate(newProps) {
         if (newProps.animText !== this.props.animText) {
-            if (newProps.animText && newProps.animText.constructId === this.props.construct.id) return true;
+            if (newProps.animText && newProps.animText.constructId === this.props.construct.id) {
+                const [type] = newProps.animText.variant;
+                if (type === 'Effect' || type === 'Removal') return true;
+            }
         }
         if (newProps.construct !== this.props.construct) return true;
         return false;
@@ -54,9 +57,8 @@ class GameConstructEffects extends preact.Component {
                 </div>);
         }
 
-        const effects = animText && animText.constructId === construct.id && animText.effects
+        const effects = animText ? animText.variant[1].display.effects : construct.effects;
-            ? animText.effects
+
-            : construct.effects;
         const renderEffects = effects.length
             ? effects.map(c =>
                 <div key={c.effect}>

client/src/components/game.construct.life.jsx

@@ -8,7 +8,10 @@ const addState = connect(({ animText }) => ({ animText }));
 class GameConstructLife extends preact.Component {
     shouldComponentUpdate(newProps) {
         if (newProps.animText !== this.props.animText) {
-            if (newProps.animText && newProps.animText.constructId === this.props.construct.id) return true;
+            if (newProps.animText && newProps.animText.target === this.props.construct.id) {
+                const [type] = newProps.animText.variant;
+                if (type === 'Damage' || type === 'Healing' || type === 'Recharge') return true;
+            }
         }
         if (newProps.construct !== this.props.construct) return true;
         return false;
@@ -16,12 +19,7 @@ class GameConstructLife extends preact.Component {
 
     render() {
         const { construct, animText } = this.props;
-        // this will be cleaner in new update
+        const lifeBars = (redLife, greenLife, blueLife) => {
-        const updateLife = animText && animText.constructId === construct.id;
-        const redLife = updateLife ? animText.life.red : construct.red_life.value;
-        const greenLife = updateLife ? animText.life.green : construct.green_life.value;
-        const blueLife = updateLife ? animText.life.blue : construct.blue_life.value;
-
             return (
                 <div class="stats">
                     <div>
@@ -38,6 +36,14 @@ class GameConstructLife extends preact.Component {
                     </div>
                 </div>
             );
+        };
+
+        if (animText) {
+            const { red, blue, green } = animText.variant[1].display;
+            return lifeBars(red, green, blue);
+        }
+
+        return lifeBars(construct.red_life.value, construct.green_life.value, construct.blue_life.value);
     }
 }
 

client/src/events.jsx

@@ -109,8 +109,7 @@ function registerEvents(store) {
                         }, timeout);
                     }
 
-                    const text = animations.getText(r);
+                    store.dispatch(actions.setAnimText(r));
-                    store.dispatch(actions.setAnimText(text));
                     return setTimeout(cb, timeout);
                 }, err => {
                     if (err) return console.error(err);

core/src/construct.rs

@@ -717,6 +717,9 @@ impl Construct {
                     },
                     self.id
                 ));
+                if self.is_ko() {
+                    events.push(Event::new(EventVariant::Ko {}, self.id));
+                }
             },
             true => {
                 // events.push(Event::new(EventVariant::Inversion { skill }));