added heal, refactor cryp dmg during combat

client/src/components/game.component.jsx

@@ -3,7 +3,7 @@ const range = require('lodash/range');
 
 const molecule = require('./molecule');
 
-const { STATS, eventClasses, eventLife, getCombatText } = require('../utils');
+const { STATS, eventClasses, getCombatText } = require('../utils');
 
 const GameCryp = require('./game.cryp');
 const SkillBtn = require('./skill.btn');
@@ -108,9 +108,8 @@ function GamePanel(props) {
     }
 
     function OpponentCryp(cryp, i) {
-        const classes = eventClasses(resolution, cryp);
-        eventLife(resolution, cryp);
         const ko = cryp.green_life.value === 0 ? 'ko' : '';
+        const classes = eventClasses(resolution, cryp);
 
         const stats = [STATS.greenLife, STATS.redLife, STATS.blueLife].map((s, j) => (
             <figure key={j} alt={s.stat}>

client/src/components/game.cryp.jsx

@@ -4,7 +4,7 @@ const range = require('lodash/range');
 
 const molecule = require('./molecule');
 const actions = require('../actions');
-const { STATS, eventClasses, eventLife, getCombatText } = require('../utils');
+const { STATS, eventClasses, getCombatText } = require('../utils');
 
 const SkillBtn = require('./skill.btn');
 
@@ -58,10 +58,8 @@ function GameCryp(props) {
         selectSkillTarget,
     } = props;
 
-
-    const classes = eventClasses(resolution, cryp);
-    eventLife(resolution, cryp);
     const ko = cryp.green_life.value === 0 ? 'ko' : '';
+    const classes = eventClasses(resolution, cryp);
 
     const skills = range(0, 3)
         .map(i => <SkillBtn key={i} cryp={cryp} i={i} />);

client/src/utils.jsx

@@ -134,15 +134,31 @@ function eventClasses(resolution, cryp) {
         // Highlight the flow of damage from source -> target
         if (source && startSkill) return 'active-skill';
         if (target && endSkill) return 'active-skill';
-        if (colour === 'RedDamage' && target && postSkill) return 'red-damage';
+
-        if (colour === 'BlueDamage' && target && postSkill) return 'blue-damage';
+        // Deal damage to cryp and return effect
-        if (colour === 'GreenDamage' && target && postSkill) return 'green-damage';
+        if (target && postSkill) {
+            cryp.green_life.value -= amount;
+            if (colour === 'RedDamage') {
+                cryp.red_life.value -= mitigation;
+                return 'red-damage';
+            }
+            if (colour === 'BlueDamage') {
+                cryp.blue_life.value -= mitigation;
+                return 'blue-damage';
+            }
+            if (colour === 'GreenDamage') return 'green-damage';
+        }
+
     }
 
     if (type === 'Healing') {
         const { skill, amount, overhealing } = event;
         if (source && startSkill) return 'active-skill';
         if (target && endSkill) return 'active-skill';
+        if (target && postSkill) {
+            cryp.green_life.value += amount;
+            return 'green-damage';
+        }
     }
 
     if (type === 'Inversion') {
@@ -174,35 +190,6 @@ function eventClasses(resolution, cryp) {
     return '';
 }
 
-function eventLife(resolution, cryp) {
-    if (!resolution) return false;
-    if (!(resolution.stage === 'POST_SKILL' && cryp.id === resolution.target.id)) return false;
-
-    const [type, event] = resolution.event;
-
-    if (type === 'Damage') {
-        const { amount, mitigation, colour } = event;
-
-        const greenDamage = amount <= cryp.green_life.value
-            ? amount
-            : cryp.green_life.value;
-        cryp.green_life.value -= greenDamage;
-
-        const getMitigationLife = () => {
-            if (colour === 'RedDamage') return 'red_life';
-            if (colour === 'BlueDamage') return 'blue_life';
-            return false;
-        };
-        const mitiLife = getMitigationLife();
-        const mitigationDmg = mitigation <= cryp[mitiLife].value
-            ? mitigation
-            : cryp[mitiLife].value;
-        cryp[mitiLife].value -= mitigationDmg;
-    }
-    return true;
-}
-
-
 function getCombatSequence(event) {
     if (!event) return false;
     // Skip combat animations depending on event type, expandable in future
@@ -259,7 +246,7 @@ function getCombatText(cryp, resolution) {
         const { skill, amount, overhealing } = event;
         if (startSkill && source) return `${skill}`;
         if (endSkill && target) return `${skill}`;
-        if (postSkill && target) return `${amount} (${overhealing}OH)`;
+        if (postSkill && target) return `${amount} (${overhealing} OH)`;
     }
 
     if (type === 'Inversion') {
@@ -298,7 +285,6 @@ module.exports = {
     genAvatar,
     requestAvatar,
     eventClasses,
-    eventLife,
     getCombatSequence,
     getCombatText,
     NULL_UUID,