feat: handle input

packages/sample-game/src/scenes/GameScene.ts

@@ -3,6 +3,7 @@ import type {TicTacToeState, TicTacToePart} from '@/game/tic-tac-toe';
 import {ReadonlySignal} from "@preact/signals";
 import {GameHostScene} from "@/scenes/GameHostScene";
 import {spawnEffect, Spawner} from "@/utils/spawner";
+import {commands} from "@/game/tic-tac-toe";
 
 const CELL_SIZE = 120;
 const BOARD_OFFSET = { x: 100, y: 100 };
@@ -47,7 +48,25 @@ export class GameScene extends GameHostScene<TicTacToeState> {
   }
 
   private setupInput(): void {
-    // todo
+    for (let row = 0; row < BOARD_SIZE; row++) {
+      for (let col = 0; col < BOARD_SIZE; col++) {
+        const x = BOARD_OFFSET.x + col * CELL_SIZE + CELL_SIZE / 2;
+        const y = BOARD_OFFSET.y + row * CELL_SIZE + CELL_SIZE / 2;
+
+        const zone = this.add.zone(x, y, CELL_SIZE, CELL_SIZE).setInteractive();
+
+        zone.on('pointerdown', () => {
+          if (this.state.winner) return;
+          if (this.isCellOccupied(row, col)) return;
+
+          const cmd = commands.play(this.state.currentPlayer, row, col);
+          const error = this.gameHost.onInput(cmd);
+          if (error) {
+            console.warn('Invalid move:', error);
+          }
+        });
+      }
+    }
   }
 
   private drawGrid(): void {
@@ -148,14 +167,14 @@ class TicTacToePartSpawner implements Spawner<TicTacToePart, Phaser.GameObjects.
     return part.id;
   }
   onUpdate(part: TicTacToePart, obj: Phaser.GameObjects.Text): void {
-    const [xIndex, yIndex] = part.position;
+    const [yIndex, xIndex] = part.position;
     const x = xIndex * CELL_SIZE + BOARD_OFFSET.x;
     const y = yIndex * CELL_SIZE + BOARD_OFFSET.y;
-    obj.x = x;
-    obj.y = y;
+    obj.x = x + CELL_SIZE / 2;
+    obj.y = y + CELL_SIZE / 2;
   }
   onSpawn(part: TicTacToePart) {
-    const [xIndex, yIndex] = part.position;
+    const [yIndex, xIndex] = part.position;
     const x = xIndex * CELL_SIZE + BOARD_OFFSET.x;
     const y = yIndex * CELL_SIZE + BOARD_OFFSET.y;
     const text = this.scene.add.text(x + CELL_SIZE / 2, y + CELL_SIZE / 2, part.player, {

packages/sample-game/src/ui/App.tsx

@@ -7,8 +7,10 @@ import {PhaserGame, PhaserScene} from "@/ui/PhaserGame";
 export default function App<T extends Record<string, unknown>>(props: { gameModule: GameModule<T>, gameScene: {new(): Phaser.Scene} }) {
     
     const gameHost = useComputed(() => {
+        const gameHost = createGameHost(props.gameModule);
+        gameHost.setup('setup');
         return {
-            gameHost: createGameHost(props.gameModule, 'setup')
+            gameHost
         }
     });