Formatting and cleanup
This commit is contained in:
@@ -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);
|
||||
|
||||
Reference in New Issue
Block a user