Added boardRendered counter to track when board DOM is rebuilt: - Increments after each renderBoard() call - useCursorRender depends on boardRendered - Forces cursor re-application after board rebuilds DOM Flow: 1. Game starts 2. renderBoard() rebuilds DOM 3. boardRendered increments 4. useCursorRender triggers 5. Cursor class applied to (0,0) This ensures cursor is visible immediately when pressing Space.
61 lines
1.7 KiB
TypeScript
61 lines
1.7 KiB
TypeScript
import { useState, useEffect } from 'react';
|
|
import type { GameManager, GameOptions } from './types';
|
|
import { useBoard } from './useBoard/useBoard';
|
|
import { useGameStatus } from './useGameStatus';
|
|
import { useCursor } from './useCursor';
|
|
import { useCursorRender } from './useCursor/useCursorRender';
|
|
|
|
export function useGame(options: GameOptions = {}, platformHook?: unknown): GameManager {
|
|
const { difficulty = 'easy' } = options;
|
|
const board = useBoard();
|
|
const { containerRef, renderBoard, generateBoard } = board;
|
|
|
|
const gameStatusManager = useGameStatus();
|
|
const { gameStatus } = gameStatusManager;
|
|
|
|
const [keyLog, setKeyLog] = useState<{ key: string; timestamp: number }[]>([]);
|
|
const [boardRendered, setBoardRendered] = useState(0);
|
|
|
|
const cursor = useCursor(gameStatusManager);
|
|
const cursorPosition = cursor.position();
|
|
|
|
useCursorRender(containerRef, cursorPosition, gameStatus, boardRendered);
|
|
|
|
useEffect(() => {
|
|
renderBoard();
|
|
setBoardRendered(prev => prev + 1);
|
|
}, []);
|
|
|
|
useEffect(() => {
|
|
if (gameStatus === 'started') {
|
|
generateBoard(difficulty);
|
|
renderBoard();
|
|
setBoardRendered(prev => prev + 1);
|
|
} else if (gameStatus === 'waiting') {
|
|
renderBoard();
|
|
setBoardRendered(prev => prev + 1);
|
|
}
|
|
}, [gameStatus, difficulty]);
|
|
|
|
const gameManager: GameManager = {
|
|
containerRef,
|
|
renderBoard,
|
|
...gameStatusManager,
|
|
cursor,
|
|
scoreManager: {
|
|
timeValue: 0,
|
|
keystrokes: 0,
|
|
finalScore: null,
|
|
},
|
|
keyLog,
|
|
clearKeyLog: () => setKeyLog([]),
|
|
getKeyLog: () => [...keyLog],
|
|
};
|
|
|
|
if (typeof platformHook === 'function') {
|
|
platformHook(gameManager);
|
|
}
|
|
|
|
return gameManager;
|
|
}
|