diff --git a/packages/sample-game/src/scenes/GameScene.ts b/packages/sample-game/src/scenes/GameScene.ts index fbdd5da..b981a06 100644 --- a/packages/sample-game/src/scenes/GameScene.ts +++ b/packages/sample-game/src/scenes/GameScene.ts @@ -32,6 +32,9 @@ export class GameScene extends GameHostScene { const winner = this.state.winner; if (winner) { this.showWinner(winner); + } else if (this.winnerOverlay) { + this.winnerOverlay.destroy(); + this.winnerOverlay = undefined; } }); @@ -121,16 +124,20 @@ export class GameScene extends GameHostScene { const text = winner === 'draw' ? "It's a draw!" : `${winner} wins!`; - this.winnerOverlay.add( - this.add.rectangle( - BOARD_OFFSET.x + (BOARD_SIZE * CELL_SIZE) / 2, - BOARD_OFFSET.y + (BOARD_SIZE * CELL_SIZE) / 2, - BOARD_SIZE * CELL_SIZE, - BOARD_SIZE * CELL_SIZE, - 0x000000, - 0.6, - ), - ); + const bg = this.add.rectangle( + BOARD_OFFSET.x + (BOARD_SIZE * CELL_SIZE) / 2, + BOARD_OFFSET.y + (BOARD_SIZE * CELL_SIZE) / 2, + BOARD_SIZE * CELL_SIZE, + BOARD_SIZE * CELL_SIZE, + 0x000000, + 0.6, + ).setInteractive({ useHandCursor: true }); + + bg.on('pointerdown', () => { + this.gameHost.setup('setup'); + }); + + this.winnerOverlay.add(bg); const winText = this.add.text( BOARD_OFFSET.x + (BOARD_SIZE * CELL_SIZE) / 2, @@ -196,6 +203,12 @@ class TicTacToePartSpawner implements Spawner obj.destroy(), + }); } } \ No newline at end of file diff --git a/packages/sample-game/src/ui/App.tsx b/packages/sample-game/src/ui/App.tsx index 5730c1b..2dc04e0 100644 --- a/packages/sample-game/src/ui/App.tsx +++ b/packages/sample-game/src/ui/App.tsx @@ -1,4 +1,4 @@ -import { useComputed } from '@preact/signals'; +import {useComputed} from '@preact/signals'; import { createGameHost, type GameModule } from 'boardgame-core'; import Phaser from 'phaser'; import { h } from 'preact'; @@ -8,12 +8,16 @@ export default function App>(props: { gam const gameHost = useComputed(() => { const gameHost = createGameHost(props.gameModule); - gameHost.setup('setup'); return { gameHost }; }); const scene = useComputed(() => new props.gameScene()); + const handleReset = async () => { + gameHost.value.gameHost.setup('setup'); + }; + const label = useComputed(() => gameHost.value.gameHost.status.value === 'running' ? 'Restart' : 'Start'); + return (
@@ -21,6 +25,14 @@ export default function App>(props: { gam
+
+ +
); }