From 8f62c6c2b53fc18cd2605bbd67884917d74c3aab Mon Sep 17 00:00:00 2001 From: Andre Padez Date: Sun, 19 Oct 2025 01:14:59 +0100 Subject: [PATCH] working on unified API and major refactoring --- example/src/App.tsx | 9 ++- example/src/GameOverlay.tsx | 111 ------------------------------ example/src/MobileGameOverlay.tsx | 99 -------------------------- example/tsconfig.json | 5 -- 4 files changed, 4 insertions(+), 220 deletions(-) delete mode 100644 example/src/GameOverlay.tsx delete mode 100644 example/src/MobileGameOverlay.tsx diff --git a/example/src/App.tsx b/example/src/App.tsx index 01945f0..8f861af 100644 --- a/example/src/App.tsx +++ b/example/src/App.tsx @@ -1,8 +1,8 @@ -import { useGame } from "@vimazing/vim-maze"; +import { useGame } from "../../src/useGame"; import { useKeyBindings } from "./useKeyBindings"; import { useMounted } from "./useMounted"; import { useIsMobile } from "./useIsMobile"; -import { GameOverlay } from "./GameOverlay"; +import '../../src/game.css'; function App() { const isMobile = useIsMobile(); @@ -10,13 +10,12 @@ function App() { const cols = isMobile ? 12 : 32; const rows = isMobile ? 8 : 24; - const gameManager = useGame(cols, rows, useKeyBindings); - const { containerRef, gameStatus, scoreManager } = gameManager; + const gameManager = useGame({ cols, rows }, useKeyBindings); + const { containerRef, gameStatus } = gameManager; return (
- {mounted && }
); }; diff --git a/example/src/GameOverlay.tsx b/example/src/GameOverlay.tsx deleted file mode 100644 index d9d8c59..0000000 --- a/example/src/GameOverlay.tsx +++ /dev/null @@ -1,111 +0,0 @@ -import type { GameStatus } from "@vimazing/vim-maze"; -import type { UseScoreType } from "@vimazing/vim-maze"; -import { useIsMobile } from "./useIsMobile"; -import { MobileGameOverlay } from "./MobileGameOverlay"; - -type GameOverlayProps = { - gameStatus: GameStatus; - scoreManager: UseScoreType; -}; - -export const GameOverlay = ({ gameStatus, scoreManager }: GameOverlayProps) => { - const isMobile = useIsMobile(); - if (isMobile) return - - // 🧠 Only show overlay when the game has ended - if (['started', 'hasKey'].includes(gameStatus)) return null; - // console.log('gameStatus:', gameStatus) - - return ( - - {gameStatus === "waiting" && } - {gameStatus === "game-over" && } - {gameStatus === "game-won" && } - - ); -}; - -export const GameWaitingContent = () => { - return ( -
-
-

Press i to play...

-

h,j,k,l to move around

-

try other vim motions
you're familiar with

-

- $,^,0,G,gg only valid if
- the edges are reachable -

-
-
- ); -}; - -export const GameWonContent = ({ scoreManager }: { scoreManager: UseScoreType }) => { - const finalScore = scoreManager.finalScore ?? 0; - - return ( -
-

Congratulations!

-

Final Score:

-

{finalScore.toLocaleString()}

-

- min - ( - 100000 - , ( - optimalTime - / - actualTime - ) * - 100000 - ) -

-

Press i to play again

-
- ); -}; - -export const GameOverContent = () => { - return ( -
-

Game Over

-

Press i to play again

-
- ); -}; - -export const GameOverlayContainer = ({ - children, -}: { - children: React.ReactNode; -}) => { - return ( -
- {children} -
- ); -}; - - - diff --git a/example/src/MobileGameOverlay.tsx b/example/src/MobileGameOverlay.tsx deleted file mode 100644 index f804e3f..0000000 --- a/example/src/MobileGameOverlay.tsx +++ /dev/null @@ -1,99 +0,0 @@ -import type { GameStatus } from "@vimazing/vim-maze"; -import type { UseScoreType } from "@vimazing/vim-maze"; - -type MobileGameOverlayProps = { - gameStatus: GameStatus; - scoreManager: UseScoreType; -}; - -export const MobileGameOverlay = ({ gameStatus, scoreManager }: MobileGameOverlayProps) => { - // 🧠 Only show overlay when the game has ended - if (['started', 'hasKey'].includes(gameStatus)) return null; - // console.log('gameStatus:', gameStatus) - - return ( - - {gameStatus === "waiting" && } - {gameStatus === "game-over" && } - {gameStatus === "game-won" && } - - ); -}; - -export const GameWaitingContent = () => { - return ( -
-
-

Press here to play

-

all the vim motions
available on desktop

-
-
- ); -}; - -export const GameWonContent = ({ scoreManager }: { scoreManager: UseScoreType }) => { - const finalScore = scoreManager.finalScore ?? 0; - - return ( -
-

Congratulations!

-

Final Score:

-

{finalScore.toLocaleString()}

-

- min - ( - 100000 - , ( - optimalTime - / - actualTime - ) * - 100000 - ) -

-

Press to play again

-
- ); -}; - -export const GameOverContent = () => { - return ( -
- Game Over -
- ); -}; - -export const GameOverlayContainer = ({ - children, -}: { - children: React.ReactNode; -}) => { - return ( -
- {children} -
- ); -}; - - diff --git a/example/tsconfig.json b/example/tsconfig.json index 8538eed..463ed52 100644 --- a/example/tsconfig.json +++ b/example/tsconfig.json @@ -1,6 +1,5 @@ { "compilerOptions": { - /* === Environment === */ "target": "ESNext", "lib": ["ESNext", "DOM"], "jsx": "react-jsx", @@ -8,14 +7,12 @@ "moduleResolution": "Bundler", "resolveJsonModule": true, - /* === Bundler / Vite === */ "noEmit": true, "allowJs": true, "skipLibCheck": true, "isolatedModules": true, "types": ["vite/client"], - /* === Code Style & Safety === */ "strict": true, "noFallthroughCasesInSwitch": true, "noUncheckedIndexedAccess": true, @@ -23,12 +20,10 @@ "noUnusedLocals": false, "noUnusedParameters": false, - /* === Module Behavior === */ "allowImportingTsExtensions": false, "esModuleInterop": true, "forceConsistentCasingInFileNames": true, - /* === Path aliases (optional) === */ "baseUrl": ".", "paths": { "@vimazing/vim-maze": ["../dist/index.d.ts"],