diff --git a/example/src/useKeyBindings.ts b/example/src/useKeyBindings.ts index 4e66c5b..2c5076c 100755 --- a/example/src/useKeyBindings.ts +++ b/example/src/useKeyBindings.ts @@ -2,7 +2,7 @@ import { useEffect } from "react"; import type { UseGameType } from "@vimazing/vim-snake"; export const useKeyBindings = (gameManager: UseGameType) => { - const { gameStatus, startGame, stopGame, clearLog, resetCount } = gameManager; + const { gameStatus, startGame, stopGame, clearLog, resetCount, togglePause } = gameManager; useEffect(() => { const handler = (ev: KeyboardEvent) => { @@ -22,6 +22,12 @@ export const useKeyBindings = (gameManager: UseGameType) => { } } + console.log('ev.key', ev.key) + + if (ev.key === 'p' || ev.key === 'P') { + togglePause(); + } + // quit if (ev.key === "q" || ev.key === "Q") { if (gameStatus === "started") { diff --git a/src/useGame/useGame.ts b/src/useGame/useGame.ts index 87611b2..424fdf6 100755 --- a/src/useGame/useGame.ts +++ b/src/useGame/useGame.ts @@ -16,7 +16,7 @@ export function useGame(cols: number, rows: number, platformHook?: unknown) { const foodManager = useFood(cols, rows, rendererManager); const gameManager = useGameStatus(rendererManager, snakeManager, foodManager); - const { gameStatus, startGame, stopGame, score, level } = gameManager; + const { gameStatus, startGame, stopGame, togglePause, score, level } = gameManager; useEffect(() => { renderBoard(cols, rows); @@ -36,6 +36,7 @@ export function useGame(cols: number, rows: number, platformHook?: unknown) { gameStatus, startGame, stopGame, + togglePause, score, level, ...snakeManager, diff --git a/src/useGame/useGameStatus.ts b/src/useGame/useGameStatus.ts index b8cd784..4e954d8 100755 --- a/src/useGame/useGameStatus.ts +++ b/src/useGame/useGameStatus.ts @@ -18,6 +18,7 @@ export function useGameStatus( const [gameStatus, setGameStatus] = useState("waiting"); const [score, setScore] = useState(0); const [level, setLevel] = useState(1); + const [paused, setPaused] = useState(false); const levelRef = useRef(1); const foodsEatenRef = useRef(0); const gameLoopRef = useRef(null); @@ -60,7 +61,7 @@ export function useGameStatus( console.log("useGameStatus effect - gameStatus:", gameStatus); if (gameStatus === "started") { console.log("Starting game loop"); - + if (paused) return; let shouldGrow = false; lastUpdateRef.current = performance.now(); @@ -141,7 +142,7 @@ export function useGameStatus( } }; } - }, [gameStatus]); + }, [gameStatus, paused]); useEffect(() => { if (gameStatus === "game-over") { @@ -157,6 +158,8 @@ export function useGameStatus( setGameStatus, startGame, stopGame, + paused, + togglePause: () => setPaused(curr => !curr), score, level, };