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

client/src/scenes/combat.cryps.js

@@ -2,20 +2,10 @@ const Phaser = require('phaser');
 
 const { TEXT } = require('./constants');
 
-const ROW_HEIGHT = 200;
-const ROW_WIDTH = 400;
-const ROW_FILL = 0x888888;
-
-const TOP_MARGIN = 50;
-const ROW_MARGIN = 50;
 const TEXT_MARGIN = 24;
-
 const CRYP_MARGIN = 250;
 const TEAM_MARGIN = 450;
 
-const xPos = i => 0;
-const yPos = i => (i * ROW_HEIGHT + ROW_MARGIN) + TOP_MARGIN;
-
 class CrypAvatar extends Phaser.GameObjects.Image {
     constructor(scene, j, team, cryp, avatar) {
         // Avatar will be a property of cryp
@@ -35,16 +25,16 @@ class CrypSkill extends Phaser.GameObjects.Text {
     }
 }
 
-class DrawCrypTeam extends Phaser.GameObjects.Group {
+class DrawCrypTeams extends Phaser.GameObjects.Group {
-    constructor(scene, team, cryps, x, y) {
+    constructor(scene, game) {
         super(scene);
         // this.id = cryp.id;
         this.scene = scene;
         this.ws = scene.registry.get('ws');
+        let team = 0;
         // Cryp Avatar
-        const avatar = team ? 'magmar' : 'alk';
-
         const renderCryp = (cryp, j) => {
+            const avatar = team ? 'magmar' : 'alk';
             this.add(scene.add.existing(new CrypAvatar(scene, j, team, cryp, avatar)));
             // Cryp HP and Name
             const crypHp = `${cryp.hp.base.toString()} / ${cryp.stamina.base.toString()} HP`;
@@ -56,8 +46,11 @@ class DrawCrypTeam extends Phaser.GameObjects.Group {
             };
             cryp.skills.forEach(knownSkill);
         };
-        cryps.forEach(renderCryp);
+        const account = scene.registry.get('account');
+        game.teams.find(t => t.id === account.id).cryps.forEach(renderCryp);
+        team = 1;
+        game.teams.filter(t => t.id !== account.id)[0].cryps.forEach(renderCryp);
     }
 }
 
-module.exports = { DrawCrypTeam, CrypAvatar, CrypSkill };
+module.exports = { DrawCrypTeams, CrypAvatar, CrypSkill };

client/src/scenes/combat.js

@@ -2,7 +2,7 @@ const Phaser = require('phaser');
 const fs = require('fs');
 
 const { POSITIONS, TEXT } = require('./constants');
-const { DrawCrypTeam, CrypAvatar, CrypSkill } = require('./combat.cryps');
+const { DrawCrypTeams, CrypAvatar, CrypSkill } = require('./combat.cryps');
 
 class Combat extends Phaser.Scene {
     constructor(props) {
@@ -13,7 +13,6 @@ class Combat extends Phaser.Scene {
         /* Static Images */
         this.textures.addBase64('alk', `data:image/png;base64,${new Buffer.from(fs.readFileSync('./assets/alakazam-f.png')).toString('base64')}`);
         this.textures.addBase64('magmar', `data:image/png;base64,${new Buffer.from(fs.readFileSync('./assets/magmar.png')).toString('base64')}`);
-
         this.load.image('sky', 'http://labs.phaser.io/assets/skies/nebula.jpg');
         this.load.image('proj', 'http://labs.phaser.io/assets/sprites/bullet.png');
         this.load.image('blue', 'http://labs.phaser.io/assets/particles/blue.png');
@@ -21,8 +20,6 @@ class Combat extends Phaser.Scene {
         this.load.image('red', 'http://labs.phaser.io/assets/particles/red.png');
         this.load.image('white', 'http://labs.phaser.io/assets/particles/white.png');
         this.load.image('yellow', 'http://labs.phaser.io/assets/particles/yellow.png');
-
-
         /* Spritesheets */
         this.load.spritesheet({
             key: 'explosion',
@@ -32,14 +29,10 @@ class Combat extends Phaser.Scene {
     }
 
     create() {
-        this.cursors = this.input.keyboard.createCursorKeys();
-        this.combat = false;
         this.registry.events.on('changedata', this.updateData, this);
-
         this.input.keyboard.on('keydown_S', () => {
             this.scene.switch('CrypList'); // Switch back to cryp list
         }, 0, this);
-
         this.input.on('pointerup', (pointer, gameObjects) => {
             if (gameObjects[0] instanceof CrypAvatar) {
                 console.log(gameObjects[0].cryp.id);
@@ -58,25 +51,20 @@ class Combat extends Phaser.Scene {
     }
 
     updateData(parent, key, data) {
-        if (key === 'game' && data !== this.gameData) {
+        if (key === 'game') {
-            const account = this.registry.get('account');
+            this.renderCryps(data);
-            const playerOneCryp = data.teams.find(t => t.id === account.id).cryps;
-            const playerTwoCryp = data.teams.filter(t => t.id !== account.id)[0].cryps;
-
-            if (this.CrypSkillsOne && this.CrypSkillsTwo) {
-                this.CrypSkillsOne.destroy(true);
-            }
-            if (this.CrypSkillsTwo) {
-                this.CrypSkillsTwo.destroy(true);
-            }
-            this.CrypSkillsOne = new DrawCrypTeam(this, 0, playerOneCryp);
-            this.CrypSkillsTwo = new DrawCrypTeam(this, 1, playerTwoCryp);
-
             this.renderCombat(data);
         }
         return true;
     }
 
+    renderCryps(game) {
+        if (this.crypTeamRender) {
+            this.crypTeamRender.destroy(true);
+        }
+        this.crypTeamRender = new DrawCrypTeams(this, game);
+    }
+
     renderCombat(game) {
         if (!game) return false;
         // shallow copy because reverse mutates