diff --git a/example/src/usePlatformHook/usePlatformHook.ts b/example/src/usePlatformHook/usePlatformHook.ts index a278cd3..c50240d 100644 --- a/example/src/usePlatformHook/usePlatformHook.ts +++ b/example/src/usePlatformHook/usePlatformHook.ts @@ -29,13 +29,6 @@ export const usePlatformHook = (gameManager: GameManager) => { gameManager.quitGame(); return; } - - // handle letter and punctuation typing during game - if (gameManager.gameStatus === "started") { - if (ev.key.length === 1 && /[a-zA-Z0-9.,!?;:'"()\-/& ]/.test(ev.key)) { - gameManager.handleTypedLetter(ev.key); - } - } }; window.addEventListener("keydown", handler); diff --git a/src/useGame/useGame.ts b/src/useGame/useGame.ts index 92d0be4..707ce94 100755 --- a/src/useGame/useGame.ts +++ b/src/useGame/useGame.ts @@ -79,12 +79,26 @@ export function useGame( gameStatusManager.setGameLoopCallback(handleGameLoopTick); }, []); - // Initial render on mount - useEffect(() => { - renderBoardWrapped(); - }, []); + // Initial render on mount + useEffect(() => { + renderBoardWrapped(); + }, []); - const scoreManager = useScore(gameStatusManager); + // Handle character input for typing + useEffect(() => { + const handleCharacterInput = (ev: KeyboardEvent) => { + if (gameStatusManager.gameStatus === "started") { + if (ev.key.length === 1 && /[a-zA-Z0-9.,!?;:'"()\-/& ]/.test(ev.key)) { + gameStatusManager.handleTypedLetter(ev.key); + } + } + }; + + window.addEventListener("keydown", handleCharacterInput); + return () => window.removeEventListener("keydown", handleCharacterInput); + }, [gameStatusManager.gameStatus]); + + const scoreManager = useScore(gameStatusManager); const gameManager: GameManager = { containerRef: boardManager.containerRef,