From bd3555e175042722b649e709c6951b876ba75704 Mon Sep 17 00:00:00 2001
From: Andre Padez <andre.padez@gmail.com>
Date: Tue, 4 Nov 2025 21:22:53 +0000
Subject: [PATCH] Reorganize example: move key bindings to usePlatformHook
 module

---
 example/src/App.tsx                           |  4 +-
 example/src/usePlatformHook/index.ts          |  1 +
 .../src/usePlatformHook/usePlatformHook.ts    | 44 +++++++++++++++++++
 3 files changed, 47 insertions(+), 2 deletions(-)
 create mode 100644 example/src/usePlatformHook/index.ts
 create mode 100644 example/src/usePlatformHook/usePlatformHook.ts

diff --git a/example/src/App.tsx b/example/src/App.tsx
index f540bdf..cb2bf82 100755
--- a/example/src/App.tsx
+++ b/example/src/App.tsx
@@ -1,14 +1,14 @@
 import { useState, useEffect, useRef } from "react";
 import { useGame, type GameMode } from "@vimazing/typing-chud";
 import "@vimazing/typing-chud/game.css";
-import { useKeyBindings } from "./useKeyBindings";
+import { usePlatformHook } from "./usePlatformHook";
 import { testScenarios, getScenario, getScenarioNames, type TestScenario } from "./testStateMachines";
 
 function App() {
    const [scenarioId, setScenarioId] = useState<string>("progressive");
    const scenario = getScenario(scenarioId);
    const [gameMode, setGameMode] = useState<GameMode>(scenario.initialMode);
-   const gameManager = useGame({ gameMode }, useKeyBindings);
+   const gameManager = useGame({ gameMode }, usePlatformHook);
    const { containerRef, gameStatus, scoreManager } = gameManager;
    const lastTransitionIndexRef = useRef<number>(-1);
    const triggeredScoreTransitionsRef = useRef<Set<number>>(new Set());
diff --git a/example/src/usePlatformHook/index.ts b/example/src/usePlatformHook/index.ts
new file mode 100644
index 0000000..8a0689f
--- /dev/null
+++ b/example/src/usePlatformHook/index.ts
@@ -0,0 +1 @@
+export * from './usePlatformHook';
diff --git a/example/src/usePlatformHook/usePlatformHook.ts b/example/src/usePlatformHook/usePlatformHook.ts
new file mode 100644
index 0000000..b324303
--- /dev/null
+++ b/example/src/usePlatformHook/usePlatformHook.ts
@@ -0,0 +1,44 @@
+import { useEffect } from "react";
+import type { GameManager } from "../../../src";
+
+export const usePlatformHook = (gameManager: GameManager) => {
+  useEffect(() => {
+    const handler = (ev: KeyboardEvent) => {
+      // start game
+      if (ev.code === "Space") {
+        ev.preventDefault(); // Prevent button activation
+        if (["waiting", "game-over", "game-won"].includes(gameManager.gameStatus)) {
+          gameManager.clearKeyLog();
+          gameManager.renderBoard();
+          if (gameManager.gameStatus === "game-over" || gameManager.gameStatus === "game-won") {
+            gameManager.quitGame();
+            setTimeout(() => gameManager.startGame(), 0);
+          } else {
+            gameManager.startGame();
+          }
+          return;
+        }
+      }
+
+      // ignore other keys while waiting
+      if (gameManager.gameStatus === "waiting") return;
+
+      // quit
+      if (ev.key === "Escape") {
+        ev.preventDefault();
+        gameManager.quitGame();
+        return;
+      }
+
+      // handle letter and punctuation typing during game
+      if (gameManager.gameStatus === "started") {
+        if (ev.key.length === 1 && /[a-zA-Z.,!? ]/.test(ev.key)) {
+          gameManager.handleTypedLetter(ev.key);
+        }
+      }
+    };
+
+    window.addEventListener("keydown", handler);
+    return () => window.removeEventListener("keydown", handler);
+  }, [gameManager.gameStatus]);
+};