From 18ac22000678f7e73b8d8bac62b71bbe1f2d7ab8 Mon Sep 17 00:00:00 2001
From: ntr <ntr@smokestack.io>
Date: Fri, 19 Jul 2019 16:19:44 +1000
Subject: [PATCH] nearly there

---
 client/src/components/construct.jsx | 61 +++++++++++++++++------------
 1 file changed, 36 insertions(+), 25 deletions(-)

diff --git a/client/src/components/construct.jsx b/client/src/components/construct.jsx
index f8ec172b..378e735d 100644
--- a/client/src/components/construct.jsx
+++ b/client/src/components/construct.jsx
@@ -23,6 +23,7 @@ class ConstructAvatar extends Component {
         // When a new construct animation is communicated with state it will have a corresponding Id
         // which is a count of how many resoluttions have passed
         this.animations = [];
+        this.resetAnimations = this.resetAnimations.bind(this);
     }
 
     render() {
@@ -36,52 +37,62 @@ class ConstructAvatar extends Component {
     }
 
     componentDidMount() {
-        const { animSource, animTarget, construct } = this.props;
+        console.log(this.props.construct.name, 'mounted');
+        this.idle = idleAnimation(this.props.construct.id);
+        this.animations.push(this.idle);
+    }
 
-        const isSource = animSource && animSource.constructId === construct.id;
-        const isTarget = animTarget && animTarget.constructId === construct.id;
+    componentDidUpdate(newProps) {
+        const { animSource, animTarget, construct } = newProps;
 
-        console.log(isSource, isTarget);
-
-        if (!isSource || !isTarget) {
-            return this.animations.push(idleAnimation(construct.id));
+        // back to idle
+        if (!animTarget || !animSource) {
+            return this.idle.play();
         }
 
-        const avatarAnim = () => {
-            console.log(isSource);
+        const isSource = animSource && animSource.constructId === construct.id;
+
+        const selectAnim = () => {
             if (isSource) {
+                console.log(construct.name, 'source anim');
                 return sourceCast(animSource.constructId, animSource.direction);
             }
 
-            // if (!animTarget) return false;
-            // match(animTarget.skill, [
-            //     ['banish', () => banish(construct.id)],
-            //     ['invert', () => invert(this.props.construct.id)],
-            // ]);
+            switch (animTarget.skill) {
+            case 'banish': return banish(construct.id);
+            case 'invert': return invert(construct.id);
+            default: return null;
+            }
         };
 
-        const anim = avatarAnim();
+        const anim = selectAnim();
         if (anim) {
-            console.log(anim);
+            this.idle.pause();
             this.animations.push(anim);
-            anim.finished.then(() => {
-                console.log('anim finished');
-                return this.animations.push(idleAnimation(construct.id));
-            });
+            return true;
         }
 
-        return true;
+        return false;
     }
 
-    componentWillUnmount() {
+    resetAnimations() {
         for (let i = this.animations.length - 1; i >= 0; i--) {
             this.animations[i].reset();
         }
     }
 
-    // never update, wait til it gets nuked by parent
-    shouldComponentUpdate({ animTarget, sourceTarget }) {
-        return (animTarget === this.props.animTarget) && (sourceTarget === this.props.sourceTarget);
+    componentWillUnmount() {
+        this.resetAnimations();
+    }
+
+    shouldComponentUpdate({ animTarget, animSource, construct }) {
+        const updated = (animTarget !== this.props.animTarget) || (animSource !== this.props.animSource);
+        if (!updated) return false;
+
+        const isSource = animSource && animSource.constructId === construct.id;
+        const isTarget = animTarget && animTarget.constructId === construct.id;
+
+        return isSource || isTarget;
     }
 }