before Unified API

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") {

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,

src/useGame/useGameStatus.ts

@@ -18,6 +18,7 @@ export function useGameStatus(
   const [gameStatus, setGameStatus] = useState<GameStatus>("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<number | null>(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,
   };