47 lines
1.1 KiB
TypeScript
Executable File
47 lines
1.1 KiB
TypeScript
Executable File
import { useRef } from "react";
|
|
|
|
export type BoardData = {
|
|
cols: number;
|
|
rows: number;
|
|
};
|
|
|
|
export function useRenderer() {
|
|
const containerRef = useRef<HTMLDivElement | null>(null);
|
|
|
|
const renderBoard = (cols: number, rows: number) => {
|
|
const container = containerRef.current;
|
|
if (!container) return;
|
|
|
|
container.innerHTML = "";
|
|
|
|
const board = document.createElement("div");
|
|
board.id = "snake-board";
|
|
board.className = "snake-board";
|
|
|
|
for (let r = 0; r < rows; r++) {
|
|
const rowDiv = document.createElement("div");
|
|
rowDiv.className = "snake-row";
|
|
rowDiv.setAttribute("data-r", String(r));
|
|
|
|
for (let c = 0; c < cols; c++) {
|
|
const cellDiv = document.createElement("div");
|
|
cellDiv.className = "snake-cell";
|
|
cellDiv.setAttribute("data-r", String(r));
|
|
cellDiv.setAttribute("data-c", String(c));
|
|
rowDiv.appendChild(cellDiv);
|
|
}
|
|
|
|
board.appendChild(rowDiv);
|
|
}
|
|
|
|
container.appendChild(board);
|
|
};
|
|
|
|
return {
|
|
containerRef,
|
|
renderBoard,
|
|
};
|
|
}
|
|
|
|
export type UseRendererType = ReturnType<typeof useRenderer>;
|