Formatting and cleanup

This commit is contained in:
2026-04-04 14:33:07 -04:00
parent f17e5061cd
commit 070337577c
20 changed files with 237 additions and 421 deletions

View File

@@ -17,10 +17,6 @@ import { useWebSocket } from "../hooks/useWebSocket";
import TokenDialog from "./TokenDialog";
import "./Grid.css";
// ---------------------------------------------------------------------------
// Constants
// ---------------------------------------------------------------------------
const DEFAULT_ZOOM = 40;
const MIN_ZOOM = 8;
const MAX_ZOOM = 160;
@@ -36,10 +32,6 @@ const MAX_FLOOD_CELLS = 2500;
/** World units per second for WASD keyboard panning. */
const WASD_PAN_SPEED = 12;
// ---------------------------------------------------------------------------
// Types
// ---------------------------------------------------------------------------
interface Camera {
offsetX: number;
offsetY: number;
@@ -58,10 +50,6 @@ export interface GridHandle {
sendColorUpdate: (colors: string[]) => void;
}
// ---------------------------------------------------------------------------
// Pure helpers
// ---------------------------------------------------------------------------
function cellKey(x: number, y: number): string {
return `${x},${y}`;
}
@@ -265,10 +253,6 @@ function clampCameraToContent(
}
}
// ---------------------------------------------------------------------------
// Grid component
// ---------------------------------------------------------------------------
const Grid = forwardRef<GridHandle, Props>(function Grid(
{ mapId, tool, paintColor, tokenColor, onColorsLoaded },
ref,
@@ -316,18 +300,12 @@ const Grid = forwardRef<GridHandle, Props>(function Grid(
null,
);
// -------------------------------------------------------------------------
// Imperative handle — lets App.tsx trigger a color WS update
// -------------------------------------------------------------------------
useImperativeHandle(ref, () => ({
sendColorUpdate(colors: string[]) {
sendRef.current({ type: "update_colors", colors });
},
}));
// -------------------------------------------------------------------------
// Resize canvas to fill container
// -------------------------------------------------------------------------
useEffect(() => {
const container = containerRef.current;
const canvas = canvasRef.current;
@@ -345,9 +323,6 @@ const Grid = forwardRef<GridHandle, Props>(function Grid(
return () => observer.disconnect();
}, [redraw]);
// -------------------------------------------------------------------------
// WebSocket
// -------------------------------------------------------------------------
// Keep a stable ref to the callback so handleMessage doesn't re-create
const onColorsLoadedRef = useRef(onColorsLoaded);
useEffect(() => {
@@ -437,9 +412,6 @@ const Grid = forwardRef<GridHandle, Props>(function Grid(
sendRef.current = send;
}, [send]);
// -------------------------------------------------------------------------
// Canvas draw
// -------------------------------------------------------------------------
useEffect(() => {
const canvas = canvasRef.current;
if (!canvas) return;
@@ -518,9 +490,6 @@ const Grid = forwardRef<GridHandle, Props>(function Grid(
}
}, [tick]);
// -------------------------------------------------------------------------
// Camera helpers
// -------------------------------------------------------------------------
function applyClampAndRedraw() {
const canvas = canvasRef.current;
if (canvas) {
@@ -546,9 +515,6 @@ const Grid = forwardRef<GridHandle, Props>(function Grid(
applyClampAndRedraw();
}
// -------------------------------------------------------------------------
// Wheel → zoom
// -------------------------------------------------------------------------
useEffect(() => {
const canvas = canvasRef.current;
if (!canvas) return;
@@ -564,9 +530,6 @@ const Grid = forwardRef<GridHandle, Props>(function Grid(
return () => canvas.removeEventListener("wheel", onWheel);
}, []); // eslint-disable-line react-hooks/exhaustive-deps
// -------------------------------------------------------------------------
// WASD panning — requestAnimationFrame loop
// -------------------------------------------------------------------------
useEffect(() => {
function rafTick(timestamp: number) {
const keys = keysHeld.current;
@@ -640,9 +603,6 @@ const Grid = forwardRef<GridHandle, Props>(function Grid(
};
}, []); // eslint-disable-line react-hooks/exhaustive-deps
// -------------------------------------------------------------------------
// Mouse helpers
// -------------------------------------------------------------------------
function getCanvasPoint(e: React.MouseEvent) {
const rect = canvasRef.current!.getBoundingClientRect();
return { x: e.clientX - rect.left, y: e.clientY - rect.top };
@@ -655,9 +615,6 @@ const Grid = forwardRef<GridHandle, Props>(function Grid(
return null;
}
// -------------------------------------------------------------------------
// Mouse handlers
// -------------------------------------------------------------------------
function handleMouseDown(e: React.MouseEvent) {
e.preventDefault();
const { x: mx, y: my } = getCanvasPoint(e);