Create clean src/ structure with minimal viable implementation:
Core Files:
- src/types.ts: Basic type definitions (Difficulty, GameStatus, GameManager)
- src/index.ts: Main package exports
- src/game.css: Copied from src_old for styling
- src/useGame.ts: Orchestrator with mocked GameManager API
- src/useBoard/useBoard.ts: Renders empty 9x9 sudoku grid
Implementation Details:
- useBoard renders 81 cells with sudoku-grid/sudoku-cell classes
- Each cell has data-r and data-c attributes for identification
- useGame provides full GameManager interface to satisfy example app
- Real implementations: gameStatus, keyLog tracking, game controls
- Mocked implementations: cursor ({}), scoreManager (zeros/null)
- Supports optional platformHook parameter
Build Status:
- TypeScript compiles cleanly with no errors
- Example app builds successfully
- Ready for browser testing with empty grid display
Phase 10 complete. Next: Phase 20 (full useBoard with puzzle generation).
51 lines
1.3 KiB
TypeScript
51 lines
1.3 KiB
TypeScript
import { useState, useEffect } from 'react';
|
|
import type { GameManager, GameOptions, GameStatus } from './types';
|
|
import { useBoard } from './useBoard/useBoard';
|
|
|
|
export function useGame(_options: GameOptions = {}, platformHook?: unknown): GameManager {
|
|
const board = useBoard();
|
|
const { containerRef, renderBoard } = board;
|
|
|
|
const [gameStatus, setGameStatus] = useState<GameStatus>('waiting');
|
|
const [keyLog, setKeyLog] = useState<{ key: string; timestamp: number }[]>([]);
|
|
|
|
useEffect(() => {
|
|
renderBoard();
|
|
}, []);
|
|
|
|
const gameManager: GameManager = {
|
|
containerRef,
|
|
renderBoard,
|
|
gameStatus,
|
|
setGameStatus,
|
|
startGame: () => {
|
|
setGameStatus('started');
|
|
},
|
|
togglePause: (pause?: boolean) => {
|
|
if (typeof pause === 'boolean') {
|
|
setGameStatus(pause ? 'paused' : 'started');
|
|
} else {
|
|
setGameStatus(prev => prev === 'paused' ? 'started' : 'paused');
|
|
}
|
|
},
|
|
quitGame: () => {
|
|
setGameStatus('waiting');
|
|
},
|
|
cursor: {},
|
|
scoreManager: {
|
|
timeValue: 0,
|
|
keystrokes: 0,
|
|
finalScore: null,
|
|
},
|
|
keyLog,
|
|
clearKeyLog: () => setKeyLog([]),
|
|
getKeyLog: () => [...keyLog],
|
|
};
|
|
|
|
if (typeof platformHook === 'function') {
|
|
platformHook(gameManager);
|
|
}
|
|
|
|
return gameManager;
|
|
}
|