refactor of cryp render
This commit is contained in:
parent
dee1721380
commit
0ca5ba170e
@ -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 {
|
||||
constructor(scene, team, cryps, x, y) {
|
||||
class DrawCrypTeams extends Phaser.GameObjects.Group {
|
||||
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 };
|
||||
|
||||
@ -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) {
|
||||
const account = this.registry.get('account');
|
||||
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);
|
||||
|
||||
if (key === 'game') {
|
||||
this.renderCryps(data);
|
||||
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;
|
||||
console.log('combat render');
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user