ntr/mnml
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

redraw games and join new ones

Browse Source
This commit is contained in:
ntr 2018-11-28 22:18:44 +11:00
parent 342394ddfa
commit 6f44ada3d9
3 changed files with 39 additions and 36 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
client/src/scenes/combat.cryps.js
View File

@ -165,29 +165,23 @@ function renderSkills(scene, group, cryp, game, iter) {
return skillList;
}
class DrawCrypTeams extends Phaser.GameObjects.Group {
constructor(scene, game) {
class CombatCryps extends Phaser.GameObjects.Group {
constructor(scene) {
super(scene);
this.scene = scene;
this.updateCryps(game, true);
}
updateCryps(game, createCryps) {
update(game) {
// Setting gamePhase will stop redraw unless phase changes again
this.scene.registry.set('gamePhase', game.phase);
// Destroy skills currently shown as the game state has changed
this.removeSkills();
const account = this.scene.registry.get('account');
const allyTeam = game.teams.find(t => t.id === account.id);
// in future there will be more than one
const [enemyTeam] = game.teams.filter(t => t.id !== account.id);
const renderTeam = (cryp, iter, team) => {
const crypObj = createCryps
? renderCryp(this.scene, this, cryp, game, team, iter)
: this.children.entries
.filter(obj => obj instanceof CrypImage)
.find(c => c.cryp.id === cryp.id);
const crypObj = renderCryp(this.scene, this, cryp, game, team, iter);
// Update to health bars wont be needed when dmg taken is done properly
crypObj.healthbar.hp = cryp.hp.base;
crypObj.healthbar.drawHealthBar();
@ -198,10 +192,6 @@ class DrawCrypTeams extends Phaser.GameObjects.Group {
allyTeam.cryps.forEach((cryp, i) => renderTeam(cryp, i, 0));
enemyTeam.cryps.forEach((cryp, i) => renderTeam(cryp, i, 1));
}
removeSkills() {
this.children.entries.filter(obj => obj instanceof CrypSkill).forEach(obj => obj.destroy());
}
}
module.exports = { CrypImage, CrypSkill, DrawCrypTeams, renderCryp };
module.exports = CombatCryps;

53
client/src/scenes/combat.js
View File

@ -1,8 +1,9 @@
const Phaser = require('phaser');
const fs = require('fs');
const { throttle } = require('lodash');
const { POSITIONS: { COMBAT }, TEXT } = require('./constants');
const { DrawCrypTeams, CrypImage, CrypSkill } = require('./combat.cryps');
const CombatCryps = require('./combat.cryps');
const renderResolutions = require('./combat.render.resolutions');
const CRYP_KEY_MAP = ['keydown_ONE', 'keydown_TWO', 'keydown_THREE'];
@ -29,31 +30,46 @@ class Combat extends Phaser.Scene {
this.registry.events.on('changedata', this.updateData, this);
this.input.keyboard.on('keydown_S', () => {
this.scene.switch('CrypList'); // Switch back to cryp list
this.registry.set('game', null);
}, 0, this);
this.input.on('pointerup', (pointer, obj) => {
if (obj[0] instanceof CrypImage || obj[0] instanceof CrypSkill) {
obj[0].clickHandler();
} else if (this.registry.get('activeSkill')) {
this.registry.get('activeSkill').clearTint();
this.registry.set('activeSkill', null);
}
});
// this.input.on('pointerup', (pointer, obj) => {
// if (obj[0] instanceof CrypImage || obj[0] instanceof CrypSkill) {
// obj[0].clickHandler();
// } else if (this.registry.get('activeSkill')) {
// this.registry.get('activeSkill').clearTint();
// this.registry.set('activeSkill', null);
// }
// });
this.combatCryps = new CombatCryps(this);
this.renderedResolves = 0;
this.registry.set('gameAnimating', false);
this.account = this.registry.get('account');
this.log = this.add.text(COMBAT.LOG.x(), COMBAT.LOG.y(), '', TEXT.NORMAL);
this.log.setWordWrapWidth(COMBAT.LOG.width());
this.fetchGame = throttle(() => {
const game = this.registry.get('game');
if (game) {
const ws = this.registry.get('ws');
return ws.sendGameState(game.id);
}
return false;
}, 1000);
return true;
}
update() {
this.fetchGame();
return true;
}
updateData(parent, key, data) {
if (key === 'game') {
if (!data) return false;
if (!this.registry.get('gamePhase')) { // Game hasn't started yet
this.crypTeamRender = new DrawCrypTeams(this, data);
}
this.redrawGame(data);
}
return true;
@ -61,22 +77,21 @@ class Combat extends Phaser.Scene {
redrawGame(game) {
// Only redraw if the game is animating or the phase has changed
const updatedNeeded = !this.registry.get('gameAnimating') && !(this.registry.get('gamePhase') === game.phase);
const updatedNeeded = !this.registry.get('gameAnimating');
if (!updatedNeeded) return false;
// do we need to render resolution animations?
if (game.resolved.length !== this.renderedResolves) {
// Turn skills off...in future we might get it to show something else instead
this.crypTeamRender.removeSkills();
this.combatCryps.removeSkills();
const newResolutions = game.resolved.slice(this.renderedResolves);
renderResolutions(this, game, this.crypTeamRender, newResolutions);
renderResolutions(this, game, this.combatCryps, newResolutions);
this.renderedResolves = game.resolved.length;
return true;
}
// If not animating resolutions render static skill / block phase
// Update relevant parts of the game state without redrawing it all
this.crypTeamRender.updateCryps(game, false);
this.combatCryps.clear(true, true);
this.combatCryps.update(game);
// update log
// shallow copy because reverse mutates

2
client/src/socket.js
View File

@ -74,8 +74,6 @@ function createSocket(events) {
function gameState(response) {
const [structName, game] = response;
clearInterval(gameStateTimeout);
gameStateTimeout = setTimeout(() => sendGameState(game.id), 1000);
events.setGame(game);
}