map/app.js

import { generateMapAsync } from "./mapGenerator.js";
import { drawMap } from "./renderer.js";
import { landuseLabel } from "./landuseCodes.js";
import { CELL_SIZE, MAP_H, MAP_W } from "./mapUtils.js";
import { clampCameraToWorld, createInitialCamera, createWorldMap } from "./worldMap.js";
import { getViewportMap } from "./worldViewport.js";
import { PATCH_MIN_AREA, PATCH_MIN_HEIGHT, PATCH_MIN_WIDTH, buildPatchRects, generatePatch, validatePatchRect } from "./mapPatch.js";

const modes = [
  ["all", "All"],
  ["terrain", "Terrain"],
  ["history", "Premodern"],
  ["modern", "Modern"],
  ["development", "Development"],
  ["landuse", "Land Use"],
  ["admin", "Municipal Borders"],
  ["borders-debug", "Borders Debug"],
  ["transport-debug", "Transport Debug"],
];

const state = {
  seedText: "114514",
  generationType: "auto",
  mode: "all",
  showFeatures: true,
  showLabels: true,
  map: null,
  world: null,
  camera: { x: 0, y: 0 },
  viewportMap: null,
  hoverEntities: [],
  selectionRect: null,
  lastPatchResult: null,
};

const canvas = document.getElementById("mapCanvas");
const canvasShell = document.querySelector(".canvas-shell");
const seedInput = document.getElementById("seed");
const generationTypeInput = document.getElementById("generationType");
const patchTerrainTypeInput = document.getElementById("patchTerrainType");
const generatePatchButton = document.getElementById("generatePatch");
const patchStatusEl = document.getElementById("patchStatus");
const randomSeedButton = document.getElementById("randomSeed");
const showFeaturesInput = document.getElementById("showFeatures");
const showLabelsInput = document.getElementById("showLabels");
const modeGrid = document.getElementById("modeGrid");
const statsEl = document.getElementById("stats");
const tooltipEl = document.getElementById("mapTooltip");
const selectionEl = document.getElementById("mapSelection");
const progressEl = document.getElementById("generationProgress");
const progressStageEl = document.getElementById("generationProgressStage");
const progressTimingsEl = document.getElementById("generationProgressTimings");
let generationStartedAt = 0;
let generationCurrentStage = "";
let generationTimer = null;

const dragState = {
  mode: null,
  pointerId: null,
  startClientX: 0,
  startClientY: 0,
  startCameraX: 0,
  startCameraY: 0,
  selectStart: null,
  selectEnd: null,
  pendingCamera: null,
  panRaf: null,
};

function activeMap() {
  return state.viewportMap || state.map;
}

function mapClientToCell(event) {
  const map = activeMap();
  if (!map) return null;
  const rect = canvas.getBoundingClientRect();
  if (!rect.width || !rect.height) return null;
  const relX = (event.clientX - rect.left) / rect.width;
  const relY = (event.clientY - rect.top) / rect.height;
  return {
    x: Math.floor(relX * map.width),
    y: Math.floor(relY * map.height),
  };
}

function viewportCellToWorldCell(cell) {
  if (!cell || !state.camera) return null;
  return {
    x: Math.round(state.camera.x || 0) + cell.x,
    y: Math.round(state.camera.y || 0) + cell.y,
  };
}

function clampCanvasPoint(event) {
  const rect = canvas.getBoundingClientRect();
  return {
    x: Math.min(Math.max(event.clientX - rect.left, 0), rect.width),
    y: Math.min(Math.max(event.clientY - rect.top, 0), rect.height),
  };
}

function updateSelectionOverlay() {
  if (!selectionEl || !dragState.selectStart || !dragState.selectEnd) return;
  const x0 = Math.min(dragState.selectStart.x, dragState.selectEnd.x);
  const y0 = Math.min(dragState.selectStart.y, dragState.selectEnd.y);
  const x1 = Math.max(dragState.selectStart.x, dragState.selectEnd.x);
  const y1 = Math.max(dragState.selectStart.y, dragState.selectEnd.y);
  selectionEl.style.display = "block";
  selectionEl.style.left = `${canvas.offsetLeft + x0}px`;
  selectionEl.style.top = `${canvas.offsetTop + y0}px`;
  selectionEl.style.width = `${Math.max(1, x1 - x0)}px`;
  selectionEl.style.height = `${Math.max(1, y1 - y0)}px`;
  const liveRect = selectionPixelsToCells(dragState.selectStart, dragState.selectEnd);
  const validation = validatePatchRect(liveRect, state.world);
  selectionEl.classList.toggle("invalid", !validation.ok);
  if (generatePatchButton) generatePatchButton.disabled = true;
  if (patchStatusEl) {
    const current = validation.rect || liveRect;
    patchStatusEl.textContent = validation.ok
      ? `Selected: ${formatRectSize(validation.rect)}. Release to confirm patch selection.`
      : `${validation.reason} Current: ${formatRectSize(current)}.`;
    patchStatusEl.classList.toggle("invalid", !validation.ok);
  }
}

function updateSelectionOverlayFromWorldRect() {
  if (!selectionEl || !state.selectionRect || !state.camera || !activeMap()) return;
  const rect = canvas.getBoundingClientRect();
  if (!rect.width || !rect.height) return;
  const map = activeMap();
  const cameraX = Math.round(state.camera.x || 0);
  const cameraY = Math.round(state.camera.y || 0);
  const vx0 = (state.selectionRect.x0 - cameraX) / map.width * rect.width;
  const vy0 = (state.selectionRect.y0 - cameraY) / map.height * rect.height;
  const vx1 = (state.selectionRect.x1 - cameraX) / map.width * rect.width;
  const vy1 = (state.selectionRect.y1 - cameraY) / map.height * rect.height;
  const x0 = Math.min(Math.max(Math.min(vx0, vx1), 0), rect.width);
  const y0 = Math.min(Math.max(Math.min(vy0, vy1), 0), rect.height);
  const x1 = Math.min(Math.max(Math.max(vx0, vx1), 0), rect.width);
  const y1 = Math.min(Math.max(Math.max(vy0, vy1), 0), rect.height);
  if (x1 - x0 < 1 || y1 - y0 < 1) {
    selectionEl.style.display = "none";
    return;
  }
  selectionEl.style.display = "block";
  selectionEl.style.left = `${canvas.offsetLeft + x0}px`;
  selectionEl.style.top = `${canvas.offsetTop + y0}px`;
  selectionEl.style.width = `${Math.max(1, x1 - x0)}px`;
  selectionEl.style.height = `${Math.max(1, y1 - y0)}px`;
  const validation = validatePatchRect(state.selectionRect, state.world);
  selectionEl.classList.toggle("invalid", !validation.ok);
}

function formatRectSize(rect) {
  if (!rect) return "-";
  const w = Math.max(0, rect.x1 - rect.x0);
  const h = Math.max(0, rect.y1 - rect.y0);
  return `${w} x ${h} cells / ${(w * h).toLocaleString()} cells`;
}

function updatePatchControls() {
  if (!patchStatusEl && !generatePatchButton) return;
  const validation = validatePatchRect(state.selectionRect, state.world);
  if (generatePatchButton) generatePatchButton.disabled = !validation.ok;
  if (!patchStatusEl) return;
  if (!state.selectionRect) {
    patchStatusEl.textContent = `Right-drag an area. Minimum: ${PATCH_MIN_WIDTH} x ${PATCH_MIN_HEIGHT} cells and ${PATCH_MIN_AREA.toLocaleString()} cells.`;
    patchStatusEl.classList.toggle("invalid", false);
    return;
  }
  if (!validation.ok) {
    patchStatusEl.textContent = `${validation.reason} Current: ${formatRectSize(validation.rect || state.selectionRect)}.`;
    patchStatusEl.classList.toggle("invalid", true);
    return;
  }
  const rects = buildPatchRects(validation.rect, state.world);
  const patchText = state.lastPatchResult
    ? ` Last patch: ${state.lastPatchResult.label}, terrain ${state.lastPatchResult.updatedCells.toLocaleString()} cells, coast ${state.lastPatchResult.coastCellsChanged || 0}, natural ${state.lastPatchResult.naturalRegionsUpdated || 0}${state.lastPatchResult.humanGeography?.ok ? `, connectors ${(state.lastPatchResult.humanGeography.roadConnectorsCreated || 0) + (state.lastPatchResult.humanGeography.railwayConnectorsCreated || 0)}, admin ${state.lastPatchResult.humanGeography.adminCellsReassigned || 0}, invalid ports ${state.lastPatchResult.humanGeography.invalidPortsRemoved || 0}` : ""}.`
    : "";
  patchStatusEl.textContent = `Core: ${formatRectSize(rects.coreRect)}. Write: ${formatRectSize(rects.writeRect)}. Repair: ${formatRectSize(rects.repairRect)}.${patchText}`;
  patchStatusEl.classList.toggle("invalid", false);
}

function clearDragMode() {
  dragState.mode = null;
  dragState.pointerId = null;
  dragState.pendingCamera = null;
  if (dragState.panRaf != null) {
    cancelAnimationFrame(dragState.panRaf);
    dragState.panRaf = null;
  }
  canvasShell?.classList.remove("panning", "selecting");
}

function schedulePanRedraw(camera) {
  dragState.pendingCamera = camera;
  if (dragState.panRaf != null) return;
  dragState.panRaf = requestAnimationFrame(() => {
    dragState.panRaf = null;
    if (!dragState.pendingCamera) return;
    const next = dragState.pendingCamera;
    dragState.pendingCamera = null;
    if (next.x === state.camera.x && next.y === state.camera.y) return;
    state.camera = next;
    redraw({ fastTerrain: true });
  });
}

function hideSelectionOverlay() {
  dragState.selectStart = null;
  dragState.selectEnd = null;
  state.selectionRect = null;
  if (selectionEl) selectionEl.style.display = "none";
  updatePatchControls();
}

function selectionPixelsToCells(start, end) {
  const map = activeMap();
  if (!map || !start || !end) return null;
  const rect = canvas.getBoundingClientRect();
  if (!rect.width || !rect.height) return null;
  const localX0 = Math.floor(Math.min(start.x, end.x) / rect.width * map.width);
  const localY0 = Math.floor(Math.min(start.y, end.y) / rect.height * map.height);
  const localX1 = Math.ceil(Math.max(start.x, end.x) / rect.width * map.width);
  const localY1 = Math.ceil(Math.max(start.y, end.y) / rect.height * map.height);
  const cameraX = Math.round(state.camera?.x || 0);
  const cameraY = Math.round(state.camera?.y || 0);
  return {
    x0: cameraX + Math.min(Math.max(localX0, 0), map.width - 1),
    y0: cameraY + Math.min(Math.max(localY0, 0), map.height - 1),
    x1: cameraX + Math.min(Math.max(localX1, 1), map.width),
    y1: cameraY + Math.min(Math.max(localY1, 1), map.height),
  };
}

function handleMapPointerDown(event) {
  if (!state.world || !canvasShell) return;
  if (event.button !== 0 && event.button !== 2) return;
  dragState.pointerId = event.pointerId;
  dragState.startClientX = event.clientX;
  dragState.startClientY = event.clientY;
  dragState.startCameraX = state.camera.x;
  dragState.startCameraY = state.camera.y;
  tooltipEl?.classList.remove("visible");

  if (event.button === 0) {
    dragState.mode = "pan";
    canvasShell.classList.add("panning");
  } else {
    dragState.mode = "select";
    dragState.selectStart = clampCanvasPoint(event);
    dragState.selectEnd = dragState.selectStart;
    canvasShell.classList.add("selecting");
    updateSelectionOverlay();
  }

  canvas.setPointerCapture?.(event.pointerId);
  event.preventDefault();
}

function handleMapPointerMove(event) {
  if (!dragState.mode || dragState.pointerId !== event.pointerId || !canvasShell) return;
  tooltipEl?.classList.remove("visible");

  if (dragState.mode === "pan") {
    const dxCells = Math.round((event.clientX - dragState.startClientX) / CELL_SIZE);
    const dyCells = Math.round((event.clientY - dragState.startClientY) / CELL_SIZE);
    const nextCamera = clampCameraToWorld({
      x: dragState.startCameraX - dxCells,
      y: dragState.startCameraY - dyCells,
    }, state.world, MAP_W, MAP_H);
    schedulePanRedraw(nextCamera);
  } else if (dragState.mode === "select") {
    dragState.selectEnd = clampCanvasPoint(event);
    updateSelectionOverlay();
  }

  event.preventDefault();
}

function handleMapPointerUp(event) {
  if (dragState.pointerId !== event.pointerId) return;
  const wasPanning = dragState.mode === "pan";
  if (dragState.mode === "select") {
    dragState.selectEnd = clampCanvasPoint(event);
    const width = Math.abs(dragState.selectEnd.x - dragState.selectStart.x);
    const height = Math.abs(dragState.selectEnd.y - dragState.selectStart.y);
    if (width >= 4 && height >= 4) {
      state.selectionRect = selectionPixelsToCells(dragState.selectStart, dragState.selectEnd);
      updateSelectionOverlayFromWorldRect();
      updatePatchControls();
    } else {
      hideSelectionOverlay();
    }
  }
  canvas.releasePointerCapture?.(event.pointerId);
  if (wasPanning && dragState.pendingCamera) {
    state.camera = dragState.pendingCamera;
    dragState.pendingCamera = null;
  }
  clearDragMode();
  if (wasPanning) redraw({ fastTerrain: false });
  event.preventDefault();
}

function parseSeed(seedText) {
  const numeric = Number.parseInt(seedText, 10);
  if (Number.isFinite(numeric)) return numeric >>> 0;

  let hash = 2166136261;
  for (const ch of seedText) hash = Math.imul(hash ^ ch.charCodeAt(0), 16777619);
  return hash >>> 0;
}

function insideCount(items) {
  return items.filter((item) => item.insidePrefecture).length;
}

function outsideCount(items) {
  return items.length - insideCount(items);
}

function countText(items) {
  return `${insideCount(items)} / outside ${outsideCount(items)}`;
}

function formatMs(ms) {
  if (!Number.isFinite(ms)) return "-";
  return ms >= 1000 ? `${(ms / 1000).toFixed(2)}s` : `${Math.round(ms)}ms`;
}

function renderTimingRows(timings = []) {
  if (!progressTimingsEl) return;
  progressTimingsEl.innerHTML = "";
  for (const row of timings) {
    const item = document.createElement("div");
    item.className = "progress-timing-row";
    const label = document.createElement("span");
    label.textContent = row.label;
    const value = document.createElement("strong");
    value.textContent = formatMs(row.ms);
    item.append(label, value);
    progressTimingsEl.append(item);
  }
}

function updateGenerationProgress(event) {
  if (!progressEl) return;
  progressEl.classList.remove("hidden");
  if (event?.status === "start") generationCurrentStage = event.label || "Preparing";
  if (progressStageEl) {
    const elapsed = generationStartedAt ? ` / elapsed ${formatMs(performance.now() - generationStartedAt)}` : "";
    progressStageEl.textContent = event?.status === "done"
      ? `Completed: ${event.label} / ${formatMs(event.ms)}${elapsed}`
      : `Running: ${event?.label || generationCurrentStage || "Preparing"}${elapsed}`;
  }
  renderTimingRows(event?.timings || []);
}

function setProgressVisible(visible, message = "Preparing") {
  if (!progressEl) return;
  progressEl.classList.toggle("hidden", !visible);
  if (visible) {
    generationStartedAt = performance.now();
    generationCurrentStage = message;
    if (generationTimer) window.clearInterval(generationTimer);
    generationTimer = window.setInterval(() => {
      if (progressStageEl && !progressEl.classList.contains("hidden")) {
        progressStageEl.textContent = `Running: ${generationCurrentStage || "Preparing"} / elapsed ${formatMs(performance.now() - generationStartedAt)}`;
      }
    }, 100);
  } else if (generationTimer) {
    window.clearInterval(generationTimer);
    generationTimer = null;
  }
  if (progressStageEl) progressStageEl.textContent = message;
  if (visible) renderTimingRows([]);
}

function nextFrame() {
  return new Promise((resolve) => requestAnimationFrame(() => resolve()));
}

function getStats(map) {
  return [
    ["Map Type", map.terrainTemplate?.terrainTypeLabel || map.terrainDebug?.terrainTypeLabel || "-"],
    ["Terrain ID", map.terrainTemplate?.terrainType || map.terrainDebug?.terrainType || "-"],
    ["Generation Total", map.generationTotalMs ? formatMs(map.generationTotalMs) : "-"],
    ["Geography Basis", map.geographyDebug?.version ? `${map.geographyDebug.version} / ${map.geographyDebug.stage || "-"}` : "-"],
    ...(map.generationTimings || []).map((row) => [`Time: ${row.label}`, formatMs(row.ms)]),
    ["Villages", countText(map.villages)],
    ["Market Towns", countText(map.markets)],
    ["Castles", countText(map.castles)],
    ["Premodern Roads", map.premodernRoads.length],
    ["Minor Roads", map.minorRoads.length],
    ["Prefecture", map.prefectureName || "-"],
    ["Neighbor Prefectures", (map.neighborPrefectures || []).map((p) => p.name).join(" / ") || "-"],
    ["Neighbor Features", map.neighborPrefectureDetails ? `${map.neighborPrefectureDetails.cities?.length || 0} cities / ${map.neighborPrefectureDetails.adminCenters?.length || 0} municipalities / ${map.neighborPrefectureDetails.roads?.length || 0} roads` : "-"],
    ["Prefectural Capital", map.prefecturalCapital?.name || "-"],
    ["Regional Capitals", (map.modernCities || []).filter((p) => p.isRegionalCapital).length],
    ["Modern Cities", countText(map.modernCities)],
    ["Ports", `${map.ports.filter((p) => p.portClass === "major").length} major / ${map.ports.filter((p) => p.portClass === "regional").length} regional / ${map.ports.filter((p) => p.portClass === "fishing").length} fishing / ${map.ports.filter((p) => p.portClass === "lake").length} lake`],
    ["Satellite Cities", countText(map.satelliteCities || [])],
    ["Population", (map.totalPopulation || 0).toLocaleString()],
    ["Rivers", `${map.mainRivers.length} main / ${(map.tributaryRivers || []).length} tributary / ${(map.smallStreams || []).length} hidden streams`],
    ["Neighbor Prefecture Borders", (map.regionalPrefectureBorders || []).length],
    ["Rail Lines", map.railways.length + map.branchRailways.length + (map.ringRailways || []).length + map.externalRailways.length],
    ["Industrial Zones", countText(map.industrialZones)],
    ["National Roads", `${map.nationalRoads.length} / pop cover ${Math.round((map.transportDebug?.nationalRoadPopulationCoverage || 0) * 100)}% / uncovered ${(map.transportDebug?.nationalRoadUncoveredPopulation || 0).toLocaleString()}`],
    ["General Ring Roads", (map.ringRoads || []).length],
    ["Expressways", map.expressways.length + map.externalExpressways.length],
    ["External Gateways", map.externalGateways.length],
    ["Interchanges", countText(map.interchanges)],
    ["Logistics Parks", countText(map.logisticsParks)],
    ["New Towns", countText(map.newTowns)],
    ["Municipalities", map.adminCenters.length],
    ["Prefecture source", map.regionalDebug?.prefectureSource ?? "-"],
  ];
}

function renderStats(map) {
  statsEl.innerHTML = "";
  for (const [labelText, valueText] of getStats(map)) {
    const row = document.createElement("div");
    row.className = "stat-row";

    const label = document.createElement("span");
    label.textContent = labelText;

    const value = document.createElement("strong");
    value.textContent = String(valueText);

    row.append(label, value);
    statsEl.append(row);
  }
}

function buildHoverEntities(map) {
  return [
    ...(map.modernCities || []),
    ...(map.ports || []),
    ...(map.stations || []),
    ...(map.interchanges || []),
    ...(map.industrialZones || []),
    ...(map.logisticsParks || []),
    ...(map.newTowns || []),
    ...(map.castles || []),
    ...(map.markets || []),
    ...(map.villages || []),
    ...(map.adminCenters || []),
  ];
}

function nearestEntity(items, x, y, maxDistance = 5) {
  let best = null;
  let bestD = maxDistance;
  for (const item of items) {
    const d = Math.hypot(item.x - x, item.y - y);
    if (d < bestD) { best = item; bestD = d; }
  }
  return best;
}

function landuseName(value) {
  return landuseLabel(value);
}

function adminName(map, adminId) {
  const center = (map.adminCenters || [])[adminId];
  return center?.name || (adminId >= 0 ? `Municipality ${adminId + 1}` : "-");
}

function adminPopulation(map, adminId) {
  const center = (map.adminCenters || [])[adminId];
  return Number.isFinite(center?.municipalityPopulation) ? center.municipalityPopulation : null;
}

function prefectureNameForCell(map, i) {
  const id = map.prefectureRegionId?.[i] ?? -1;
  const region = (map.prefectureRegions || []).find((p) => p.id === id);
  return region?.name || (id >= 0 ? `Prefecture ${id + 1}` : "-");
}

function updateTooltip(event) {
  const map = activeMap();
  if (!map || !tooltipEl || dragState.mode) return;
  const rect = canvas.getBoundingClientRect();
  const cell = mapClientToCell(event);
  if (!cell) return;
  const { x, y } = cell;
  if (x < 0 || y < 0 || x >= map.width || y >= map.height) {
    tooltipEl.classList.remove("visible");
    return;
  }
  const i = y * map.width + x;
  const worldCell = viewportCellToWorldCell({ x, y });
  const entity = nearestEntity(state.hoverEntities, x, y);
  const elevation = map.elevation?.[i] ?? 0;
  const density = map.populationDensity?.[i] ?? 0;
  const hoveredAdminId = map.adminId?.[i] ?? -1;
  const hoveredAdminPopulation = adminPopulation(map, hoveredAdminId);
  const coordinateText = worldCell ? `World ${worldCell.x}, ${worldCell.y} / View ${x}, ${y}` : `${x}, ${y}`;
  const entityTitle = entity
    ? `${entity.name || entity.facilityLabel || entity.kind || "Feature"} / ${entity.kind || "Feature"}`
    : coordinateText;
  const lines = [
    `<strong>${entityTitle}</strong>`,
    `Prefecture: ${prefectureNameForCell(map, i)}`,
    `Admin: ${adminName(map, hoveredAdminId)}`,
    `Admin Pop: ${hoveredAdminPopulation === null ? "-" : hoveredAdminPopulation.toLocaleString()}`,
    `Land: ${map.sea?.[i] ? "Sea" : landuseName(map.landuse?.[i])}`,
    `Elevation: ${elevation.toFixed(3)} / Slope: ${(map.slope?.[i] ?? 0).toFixed(3)}`,
    `River: ${(map.river?.[i] ?? 0).toFixed(2)} / Density: ${density.toFixed(2)}`,
  ];
  if (entity?.population) lines.splice(1, 0, `Population: ${entity.population.toLocaleString()}`);
  tooltipEl.innerHTML = lines.join("<br>");
  const margin = 8;
  const offset = 14;
  const maxLeft = Math.max(margin, rect.width - tooltipEl.offsetWidth - margin);
  const maxTop = Math.max(margin, rect.height - tooltipEl.offsetHeight - margin);
  const desiredLeft = event.clientX - rect.left + offset;
  const desiredTop = event.clientY - rect.top + offset;
  tooltipEl.style.left = `${Math.min(Math.max(margin, desiredLeft), maxLeft)}px`;
  tooltipEl.style.top = `${Math.min(Math.max(margin, desiredTop), maxTop)}px`;
  tooltipEl.classList.add("visible");
}

function renderModeButtons() {
  modeGrid.innerHTML = "";
  for (const [key, label] of modes) {
    const button = document.createElement("button");
    button.type = "button";
    button.textContent = label;
    button.className = key === state.mode ? "mode-button active" : "mode-button";
    button.addEventListener("click", () => {
      state.mode = key;
      renderModeButtons();
      redraw();
    });
    modeGrid.append(button);
  }
}

async function regenerate() {
  state.seedText = seedInput.value;
  state.generationType = generationTypeInput?.value || "auto";
  setProgressVisible(true, "Preparing generation...");
  await nextFrame();
  try {
    state.map = await generateMapAsync(parseSeed(state.seedText), { onProgress: updateGenerationProgress, terrainType: state.generationType });
    state.world = createWorldMap(state.map);
    state.camera = createInitialCamera(state.world);
    state.lastPatchResult = null;
    hideSelectionOverlay();
    renderStats(state.map);
    redraw();
    if (progressStageEl) progressStageEl.textContent = `Done in ${formatMs(state.map.generationTotalMs || 0)}`;
    renderTimingRows(state.map.generationTimings || []);
    window.setTimeout(() => setProgressVisible(false), 900);
  } catch (error) {
    if (progressStageEl) progressStageEl.textContent = `Generation failed: ${error?.message || error}`;
    throw error;
  }
}


function derivePatchSeed(rect, terrainType) {
  let h = parseSeed(state.seedText) ^ 0x9e3779b9;
  h = Math.imul(h ^ (rect.x0 | 0), 1664525) >>> 0;
  h = Math.imul(h ^ (rect.y0 | 0), 1013904223) >>> 0;
  h = Math.imul(h ^ (rect.x1 | 0), 2246822519) >>> 0;
  h = Math.imul(h ^ (rect.y1 | 0), 3266489917) >>> 0;
  for (const ch of String(terrainType || "auto")) h = Math.imul(h ^ ch.charCodeAt(0), 16777619) >>> 0;
  return h >>> 0;
}

async function generateSelectedPatch() {
  const validation = validatePatchRect(state.selectionRect, state.world);
  if (!validation.ok) {
    updatePatchControls();
    return;
  }
  const terrainType = patchTerrainTypeInput?.value || generationTypeInput?.value || "auto";
  const seed = derivePatchSeed(validation.rect, terrainType);
  setProgressVisible(true, "Generating selected patch...");
  await nextFrame();
  try {
    const result = generatePatch(state.world, validation.rect, { terrainType, seed });
    if (!result.ok) {
      if (progressStageEl) progressStageEl.textContent = `Patch failed: ${result.reason || "invalid selection"}`;
      updatePatchControls();
      window.setTimeout(() => setProgressVisible(false), 1200);
      return;
    }
    state.lastPatchResult = result;
    redraw();
    renderStats(state.map);
    updatePatchControls();
    const human = result.humanGeography;
    const humanText = human?.ok ? ` / human: ${human.modernCities || 0} cities, ${human.ports || 0} ports, ${human.villages || 0} villages, ${(human.roadConnectorsCreated || 0) + (human.railwayConnectorsCreated || 0)} connectors, admin ${human.adminCellsReassigned || 0}, invalid ports ${human.invalidPortsRemoved || 0}` : "";
    if (progressStageEl) progressStageEl.textContent = `Patch generated: ${result.label} / core ${formatRectSize(result.rects.coreRect)} / write ${formatRectSize(result.rects.writeRect)} / terrain ${result.updatedCells.toLocaleString()} cells / coast ${result.coastCellsChanged || 0} / natural ${result.naturalRegionsUpdated || 0}${humanText}`;
    renderTimingRows([]);
    window.setTimeout(() => setProgressVisible(false), 900);
  } catch (error) {
    if (progressStageEl) progressStageEl.textContent = `Patch failed: ${error?.message || error}`;
    throw error;
  }
}

function redraw(options = {}) {
  if (!state.world) return;
  state.camera = clampCameraToWorld(state.camera, state.world, MAP_W, MAP_H);
  state.viewportMap = getViewportMap(state.world, state.camera, MAP_W, MAP_H);
  state.hoverEntities = buildHoverEntities(state.viewportMap);
  drawMap(canvas, state.viewportMap, {
    mode: state.mode,
    showFeatures: state.showFeatures,
    showLabels: state.showLabels && !options.fastTerrain,
    continuousTerrain: !options.fastTerrain,
  });
  if (state.selectionRect && dragState.mode !== "select") updateSelectionOverlayFromWorldRect();
}

function init() {
  renderModeButtons();

  seedInput.addEventListener("change", regenerate);
  seedInput.addEventListener("keydown", (event) => {
    if (event.key === "Enter") regenerate();
  });

  generationTypeInput?.addEventListener("change", regenerate);
  patchTerrainTypeInput?.addEventListener("change", updatePatchControls);
  generatePatchButton?.addEventListener("click", generateSelectedPatch);

  randomSeedButton.addEventListener("click", () => {
    seedInput.value = String(Math.floor(Math.random() * 9999999));
    regenerate();
  });

  showFeaturesInput.addEventListener("change", () => {
    state.showFeatures = showFeaturesInput.checked;
    redraw();
  });

  showLabelsInput.addEventListener("change", () => {
    state.showLabels = showLabelsInput.checked;
    redraw();
  });

  canvasShell?.setAttribute("tabindex", "0");
  canvas.addEventListener("contextmenu", (event) => event.preventDefault());
  canvas.addEventListener("pointerdown", handleMapPointerDown);
  canvas.addEventListener("pointermove", handleMapPointerMove);
  canvas.addEventListener("pointerup", handleMapPointerUp);
  canvas.addEventListener("pointercancel", handleMapPointerUp);
  canvas.addEventListener("mousemove", updateTooltip);
  canvas.addEventListener("mouseleave", () => {
    tooltipEl?.classList.remove("visible");
  });

  updatePatchControls();
  regenerate();
}

init();