Merge branch 'master' of ssh://cryps.gg:40022/~/cryps

client/cryps.css

@@ -634,6 +634,11 @@ table td svg {
     height: 100%;
 }
 
+.cryp-box .effects {
+    height: 100%;
+    font-size: 1.5em;
+}
+
 .cryp-skill-btn {
     flex: 1 1 100%;
     font-size: 16pt;
@@ -708,14 +713,8 @@ table td svg {
     padding: 0;
 }
 
-.team-opponent .cryp-box-top {
+.team-opponent .cryp-box .img {
-    flex-flow: column;
+    order: 5;
-    justify-content: center;
-    align-items: stretch;
-}
-
-.team-opponent .cryp-box-top figure {
-    flex: 1;
 }
 
 /*.logs {

client/package.json

@@ -12,6 +12,8 @@
   "author": "",
   "license": "UNLICENSED",
   "dependencies": {
+    "anime": "^0.1.2",
+    "animejs": "^3.0.1",
     "async": "^2.6.2",
     "borc": "^2.0.3",
     "bulma-toast": "^1.2.0",

client/src/components/game.component.jsx

@@ -153,11 +153,18 @@ function GamePanel(props) {
                 className={`cryp-box ${ko} ${classes}`}
                 style={ activeSkill ? { cursor: 'pointer' } : {}}
                 onClick={() => selectSkillTarget(cryp.id)} >
-                <figure className="img">
+                <div className="cryp-box-top">
-                    {crypAvatar(cryp.name)}
+                    <figure
-                    {combatTextEl}
+                        className="img"
-                    <div>{cryp.name}</div>
+                        onClick={() => selectSkillTarget(cryp.id)} >
-                </figure>
+                        {crypAvatar(cryp.name)}
+                        {combatTextEl}
+                        <div>{cryp.name}</div>
+                    </figure>
+                    <div className="effects">
+                        {cryp.effects.map(c => <span key={c.effect}>{c.effect} - {c.duration}T</span>)}
+                    </div>
+                </div>
                 <div className="stats">
                     {stats}
                 </div>

client/src/events.jsx

@@ -1,5 +1,7 @@
 const toast = require('izitoast');
 const eachSeries = require('async/eachSeries');
+const anime = require('animejs').default;
+const range = require('lodash/range');
 
 const actions = require('./actions');
 const { TIMES } = require('./constants');
@@ -9,12 +11,31 @@ function registerEvents(store) {
 
     // timeout handlers
     store.subscribe(() => {
-        const { game, instance, ws} = store.getState();
+        const { game, instance, cryps, ws} = store.getState();
 
         if (!game) ws.clearGameStateTimeout();
         if (!instance) ws.clearInstanceStateTimeout();
     });
 
+
+    // cryp animations
+    function crypAnimations() {
+        const cryps = document.querySelectorAll('img');
+        if (!cryps.length) return window.requestAnimationFrame(crypAnimations);
+        return anime({
+            targets: 'img',
+            translateX: () => anime.random(-20, 20),
+            translateY: () => anime.random(-20, 20),
+            rotate: () => anime.random(-90, 90),
+            duration: () => anime.random(5000, 6000),
+            direction: 'alternate',
+            easing: 'linear',
+            loop: true,
+        });
+    }
+    setInterval(crypAnimations, 5000);
+    crypAnimations();
+
     function setCryps(cryps) {
         console.log('EVENT ->', 'cryps', cryps);
     }

server/src/skill.rs

@@ -75,7 +75,7 @@ pub fn resolve(skill: Skill, source: &mut Cryp, target: &mut Cryp, mut resolutio
         Skill::Strike => strike(source, target, resolutions, Skill::Strike),
         Skill::StrikeII => strike(source, target, resolutions, Skill::StrikeII),
         Skill::StrikeIII => strike(source, target, resolutions, Skill::StrikeIII),
-        
+
         Skill::Stun => stun(source, target, resolutions, Skill::Stun),
         Skill::Taunt => taunt(source, target, resolutions, Skill::Taunt),
         Skill::Throw => throw(source, target, resolutions, Skill::Throw), // no damage stun, adds vulnerable
@@ -969,10 +969,10 @@ fn slay(source: &mut Cryp, target: &mut Cryp, mut results: Resolutions, skill: S
     for e in slay_events {
         match e {
             Event::Damage { amount, mitigation: _, colour: _, skill: _ } => {
-                let heal = source.deal_green_damage(skill, amount);
                 results.push(Resolution::new(source, target).event(e));
-                for e in heal {
+                let heal = source.deal_green_damage(skill, amount);
-                    results.push(Resolution::new(source, source).event(e));
+                for h in heal {
+                    results.push(Resolution::new(source, source).event(h));
                 };
             },
             _ => results.push(Resolution::new(source, target).event(e)),
@@ -1154,10 +1154,10 @@ fn siphon_tick(source: &mut Cryp, target: &mut Cryp, mut results: Resolutions, s
     for e in siphon_events {
         match e {
             Event::Damage { amount, mitigation: _, colour: _, skill: _ } => {
-                let heal = source.deal_green_damage(Skill::Siphon, amount);
                 results.push(Resolution::new(source, target).event(e));
-                for e in heal {
+                let heal = source.deal_green_damage(Skill::Siphon, amount);
-                    results.push(Resolution::new(source, source).event(e));
+                for h in heal {
+                    results.push(Resolution::new(source, source).event(h));
                 };
             },
             _ => results.push(Resolution::new(source, target).event(e)),
@@ -1407,8 +1407,6 @@ mod tests {
             },
             _ => panic!("not healing"),
         };
-
-
     }