diff --git a/frontend/src/js/fight_scene.ts b/frontend/src/js/fight_scene.ts index a95bffd816c80471ce1862bfc40d499d3dd731b6..f7220b50c9e85204c2eae6138d3b5416d7ae5c9d 100644 --- a/frontend/src/js/fight_scene.ts +++ b/frontend/src/js/fight_scene.ts @@ -241,28 +241,6 @@ export default class FightScene extends Phaser.Scene { this.scene.start("game_over"); } - showSubmitFeedback(color: string, input: string) { - const text = this.add.text( - this.cameras.main.width / 2, - this.cameras.main.height / 2, - input, - { - font: "bold 64px Courier", - color: color, - }, - ); - text.setOrigin(0.5, 0.5); - this.tweens.add({ - targets: text, - scaleX: 5, - scaleY: 5, - alpha: 0, - ease: "Power2", - duration: 500, - onComplete: (_tween, [target]) => target.destroy(), - }); - } - initCluesGroup() { const bounds = new Phaser.Geom.Rectangle( 4, @@ -312,12 +290,12 @@ export default class FightScene extends Phaser.Scene { }); if (match === null) { // NOOP - this.showSubmitFeedback("#FFFFFF", inputStatus.final); + this.hud.showSubmitFeedback("#FFFFFF", inputStatus.final); } else if (score < 0.9) { // TODO: visual near misses based on score this.updateScore(-1); match.handleFailure(); - this.showSubmitFeedback("#FF0000", inputStatus.final); + this.hud.showSubmitFeedback("#FF0000", inputStatus.final); new Spear(this, this.player, undefined); } else { backend.updateClue(match.beClue.id, { @@ -327,7 +305,7 @@ export default class FightScene extends Phaser.Scene { this.updateScore(+10); this.popFoe(match); match.handleSuccess(); - this.showSubmitFeedback("#00FF00", inputStatus.final); + this.hud.showSubmitFeedback("#00FF00", inputStatus.final); new Spear(this, this.player, match.critter); // TODO: increase score } diff --git a/frontend/src/js/hud.ts b/frontend/src/js/hud.ts index eb2f8919f5cd27c62aa0cc8e2cd57886a3eb0c11..e665c2aa8d71a93575203a6d394ecafd15f305cf 100644 --- a/frontend/src/js/hud.ts +++ b/frontend/src/js/hud.ts @@ -80,4 +80,27 @@ export default class HUD { const formatted = `${minutes}:${seconds}.${hundredths}`; this.clock.text = `${formatted} ${ICONS.CLOCK}`; } + + showSubmitFeedback(color: string, input: string) { + const text = this.scene.add + .text( + this.scene.cameras.main.width / 2, + this.scene.cameras.main.height / 2, + input, + { + font: "bold 64px Courier", + color: color, + }, + ) + .setOrigin(0.5, 0.5); + this.scene.tweens.add({ + targets: text, + scaleX: 5, + scaleY: 5, + alpha: 0, + ease: "Power2", + duration: 500, + onComplete: (_tween, [target]) => target.destroy(), + }); + } }