From ab7de7d77d775621f38435cb4bfc6db6596e2c3b Mon Sep 17 00:00:00 2001 From: Mashy Date: Mon, 26 Nov 2018 18:13:38 +1000 Subject: [PATCH] Added keybinds --- client/src/events.js | 8 ++++ client/src/scenes/combat.cryps.js | 62 ++++++++++++++++-------------- client/src/scenes/combat.js | 23 ++++++++++- client/src/scenes/combat.render.js | 0 client/src/scenes/constants.js | 0 5 files changed, 64 insertions(+), 29 deletions(-) mode change 100755 => 100644 client/src/scenes/combat.cryps.js mode change 100755 => 100644 client/src/scenes/combat.js mode change 100755 => 100644 client/src/scenes/combat.render.js mode change 100755 => 100644 client/src/scenes/constants.js diff --git a/client/src/events.js b/client/src/events.js index b796eea6..85ce2e0e 100644 --- a/client/src/events.js +++ b/client/src/events.js @@ -28,6 +28,14 @@ function registerEvents(registry, events) { registry.set('gameList', gameList); } + events.on('SET_ACTIVE_SKILL', function skillActive(skill) { + const activeSkill = registry.get('activeSkill'); + if (activeSkill) { + activeSkill.clearTint(); + } skill.setTint(0x00ff00); + return setActiveSkill(skill); + }); + events.on('CRYP_ACTIVE', function crypActiveCb(cryp) { const cryps = registry.get('cryps'); diff --git a/client/src/scenes/combat.cryps.js b/client/src/scenes/combat.cryps.js old mode 100755 new mode 100644 index 07fe3ef5..19291c91 --- a/client/src/scenes/combat.cryps.js +++ b/client/src/scenes/combat.cryps.js @@ -37,16 +37,21 @@ const skillTextPosition = (crypIter, skillIter) => { return [skillTextX, skillTextY]; }; +const crypPosition = (team, iter) => { + const { CRYP_MARGIN, TEAM_MARGIN, Y_PADDING } = calcMargin(); + const crypAvatarX = COMBAT.width() / 8 + TEAM_MARGIN * team; + const crypAvatarY = Y_PADDING * 1.25 + CRYP_MARGIN * iter; + return { crypAvatarX, crypAvatarY }; +}; class CrypImage extends Phaser.GameObjects.Image { - constructor(scene, j, team, avatar, cryp, healthbar) { + constructor(scene, team, iter, skills, avatar, cryp, healthbar) { // Avatar will be a property of cryp - const { - CRYP_MARGIN, TEAM_MARGIN, X_PADDING, Y_PADDING, - } = calcMargin(); - super(scene, COMBAT.width() / 8 + TEAM_MARGIN * team, Y_PADDING * 1.25 + CRYP_MARGIN * j, avatar); + const { crypAvatarX, crypAvatarY } = crypPosition(team, iter); + super(scene, crypAvatarX, crypAvatarY, avatar); this.scene = scene; this.cryp = cryp; + this.skills = skills; this.healthbar = healthbar; } @@ -61,28 +66,21 @@ class CrypImage extends Phaser.GameObjects.Image { } else if (game.phase === 'Target') { ws.sendGameTarget(game.id, this.cryp.id, activeSkill.skill.id); } - } else { - activeSkill.clearTint(); - this.scene.registry.set('activeSkill', null); } + activeSkill.clearTint(); + this.scene.registry.set('activeSkill', null); + this.scene.registry.set('activeCryp', null); } } } class CrypSkill extends Phaser.GameObjects.Text { constructor(scene, x, y, team, skill, cryp) { - console.log(skill, cryp); // Avatar will be a property of cryp super(scene, x, y, skill.skill, TEXT.NORMAL); this.cryp = cryp; this.skill = skill; this.setInteractive(); - const activeSkill = scene.registry.get('activeSkill'); - if (activeSkill) { - if (activeSkill.skill === skill && activeSkill.cryp.id === cryp.id) { - this.setTint(COLOURS.BLUE); - } - } } clickHandler() { @@ -135,7 +133,7 @@ class HealthBar extends Phaser.GameObjects.Graphics { } } -function renderCryp(scene, group, cryp, game, team, iter) { +function renderCryp(scene, group, cryp, skills, game, team, iter) { // Add Image Avatar Class const avatar = team ? 'magmar' : 'alk'; // Add cryp hp @@ -144,7 +142,7 @@ function renderCryp(scene, group, cryp, game, team, iter) { const crypHpText = scene.add.text(healthTextX, healthTextY, `${cryp.hp.base.toString()} / ${cryp.stamina.base.toString()} HP`, TEXT.NORMAL); const healthBar = scene.add.existing(new HealthBar(scene, cryp, team, iter, crypHpText)); // Add cryp name - const crypSpawn = scene.add.existing(new CrypImage(scene, iter, team, avatar, cryp, healthBar)) + const crypSpawn = scene.add.existing(new CrypImage(scene, team, iter, skills, avatar, cryp, healthBar)) .setScale(0.5) .setInteractive(); group.addMultiple([crypHpText, healthBar, crypSpawn, crypName]); @@ -153,42 +151,50 @@ function renderCryp(scene, group, cryp, game, team, iter) { function renderSkills(scene, group, cryp, account, game, team, iter) { const nameTextPosition = skillTextPosition(iter, 0); + const skillList = []; + if (scene.registry.get('resolve')) return true; if (game.phase === 'Skill' && cryp.account === account.id) { if (cryp.hp.base === 0) return true; const crypName = scene.add.text(nameTextPosition[0], nameTextPosition[1], cryp.name, TEXT.HEADER); - group.add(crypName); crypName.text = cryp.name; cryp.skills.forEach((skill, i) => { const skillText = skillTextPosition(iter, i + 2); - group.add(scene.add.existing(new CrypSkill(scene, skillText[0], skillText[1], team, skill, cryp))); + const skillObj = new CrypSkill(scene, skillText[0], skillText[1], team, skill, cryp); + scene.add.existing(skillObj); + skillList.push(skillObj); + group.addMultiple([crypName, skillObj]); }); } else if (game.phase === 'Target' && cryp.account !== account.id) { const blockSkill = game.stack.find(skill => skill.source_cryp_id === cryp.id); // cryp not casting this turn if (!blockSkill) return false; const crypName = scene.add.text(nameTextPosition[0], nameTextPosition[1], cryp.name, TEXT.HEADER); - group.add(crypName); const skillText = skillTextPosition(iter, 2); - group.add(scene.add.existing(new CrypSkill(scene, skillText[0], skillText[1], team, blockSkill, cryp))); + const skillObj = new CrypSkill(scene, skillText[0], skillText[1], team, blockSkill, cryp); + scene.add.existing(skillObj); + skillList.push(skillObj); + group.addMultiple([crypName, skillObj]); } - return true; + return skillList; } - class DrawCrypTeams extends Phaser.GameObjects.Group { constructor(scene, game) { super(scene); - let allyCount = 0; - let enemyCount = 0; + this.scene = scene; + this.keyboard = scene.input.keyboard; + let allyCount = 0; let enemyCount = 0; const account = scene.registry.get('account'); scene.cryps.forEach((cryp) => { const team = cryp.account === account.id ? 0 : 1; const iter = cryp.account === account.id ? allyCount : enemyCount; - renderCryp(scene, this, cryp, game, team, iter); - renderSkills(scene, this, cryp, account, game, team, iter); + const skillsObj = renderSkills(scene, this, cryp, account, game, team, iter); + const crypObj = renderCryp(scene, this, cryp, skillsObj, game, team, iter); allyCount = cryp.account === account.id ? allyCount += 1 : enemyCount += 1; + const addKeys = (game.phase === 'Skill' && !team) || (game.phase === 'Target' && team); + if (addKeys) scene.crypKeyHandler(crypObj, iter); }); } } -module.exports = { CrypImage, CrypSkill, DrawCrypTeams, renderCryp}; +module.exports = { CrypImage, CrypSkill, DrawCrypTeams, renderCryp }; diff --git a/client/src/scenes/combat.js b/client/src/scenes/combat.js old mode 100755 new mode 100644 index fd624e99..c04f59c5 --- a/client/src/scenes/combat.js +++ b/client/src/scenes/combat.js @@ -5,6 +5,9 @@ const { POSITIONS: { COMBAT }, TEXT } = require('./constants'); const { DrawCrypTeams, CrypImage, CrypSkill } = require('./combat.cryps'); const combatRender = require('./combat.render'); const CombatSkills = require('./combat.skills'); +const CRYP_KEY_MAP = ['keydown_ONE', 'keydown_TWO', 'keydown_THREE']; + const SKILL_KEY_MAP = ['keydown_Q', 'keydown_W', 'keydown_E', 'keydown_R']; + class Combat extends Phaser.Scene { constructor() { @@ -74,7 +77,6 @@ class Combat extends Phaser.Scene { } this.cryps = []; game.teams.forEach(t => t.cryps.forEach(cryp => this.cryps.push(cryp))); - console.log(this.cryps); // If not animating render static skill / block phase if (this.crypTeamRender) { this.crypTeamRender.destroy(true); @@ -90,6 +92,25 @@ class Combat extends Phaser.Scene { this.log.setText(Array.from(game.log).slice(0, this.logIter).reverse()); return this.resolvedIter === game.resolved.length; } + + crypKeyHandler(cryp, iter) { + if (CRYP_KEY_MAP[iter]) { + this.input.keyboard.removeListener(CRYP_KEY_MAP[iter]); + if (cryp.skills.length > 0) { // check there are cryp skills + this.input.keyboard.on(CRYP_KEY_MAP[iter], () => { + this.registry.set('activeCryp', cryp); + console.log(cryp.cryp.name); + SKILL_KEY_MAP.forEach(k => this.input.keyboard.removeListener(k)); + cryp.skills.forEach((skill, i) => { + this.input.keyboard.on(SKILL_KEY_MAP[i], () => { + this.game.events.emit('SET_ACTIVE_SKILL', skill); + skill.setActive(); + }, this); + }); + }, this); + } + } + } } module.exports = Combat; diff --git a/client/src/scenes/combat.render.js b/client/src/scenes/combat.render.js old mode 100755 new mode 100644 diff --git a/client/src/scenes/constants.js b/client/src/scenes/constants.js old mode 100755 new mode 100644