fix: restore secure clipping to prevent landmass being cut at map edges (#1385)

* Initial plan

* fix: restore secure clipping to prevent landmass edge artifacts

The f2fc427 refactor replaced window.polygonclip (which had a secure=1
mode) with lineclip.clipPolygon, removing the behavior that added each
boundary-crossing intersection point three times. Without this, the
curveBasisClosed B-spline arcs away from the map edges instead of
following them, leaving a visible ocean band at the map boundary.

Restore the secure parameter on clipPoly: when secure=1, boundary
points are duplicated twice after standard clipping, forcing the
B-spline to stay on the boundary. Re-expose the parameter on
window.clipPoly for legacy JS callers.

Agent-Logs-Url: https://github.com/Azgaar/Fantasy-Map-Generator/sessions/0b83756d-4055-4265-9258-c23b0a3681cd

Co-authored-by: Azgaar <26469650+Azgaar@users.noreply.github.com>

---------

Co-authored-by: copilot-swe-agent[bot] <198982749+Copilot@users.noreply.github.com>
Co-authored-by: Azgaar <26469650+Azgaar@users.noreply.github.com>

Author: Copilot

src/renderers/draw-features.ts

@@ -95,7 +95,7 @@ function featurePathRenderer(feature: PackedGraphFeature): string {
   }
 
   const simplifiedPoints = simplify(points, 0.3);
-  const clippedPoints = clipPoly(simplifiedPoints, graphWidth, graphHeight);
+  const clippedPoints = clipPoly(simplifiedPoints, graphWidth, graphHeight, 1);
 
   const lineGen = line().curve(curveBasisClosed);
   const path = `${round(lineGen(clippedPoints) || "")}Z`;

src/utils/commonUtils.ts

@@ -9,20 +9,41 @@ import { rand } from "./probabilityUtils";
  * @param points - Array of points [[x1, y1], [x2, y2], ...]
  * @param graphWidth - Width of the graph
  * @param graphHeight - Height of the graph
+ * @param secure - When truthy, duplicate boundary-crossing points to prevent B-spline
+ *   curves from arcing away from map edges (restores original "secure clipping" behavior)
  * @returns Clipped polygon points
  */
 export const clipPoly = (
   points: [number, number][],
   graphWidth: number,
   graphHeight: number,
+  secure?: number,
 ) => {
   if (points.length < 2) return points;
   if (points.some((point) => point === undefined)) {
     window.ERROR && console.error("Undefined point in clipPoly", points);
     return points;
   }
 
-  return clipPolygon(points, [0, 0, graphWidth, graphHeight]);
+  const clipped = clipPolygon(points, [0, 0, graphWidth, graphHeight]);
+
+  if (!secure || !clipped.length) return clipped;
+
+  // Duplicate each boundary point twice so the B-spline passes through it
+  // rather than arcing away from the map edge (replicates polygonclip secure=1)
+  const secured: [number, number][] = [];
+  for (const point of clipped) {
+    secured.push(point);
+    if (
+      point[0] === 0 ||
+      point[0] === graphWidth ||
+      point[1] === 0 ||
+      point[1] === graphHeight
+    ) {
+      secured.push(point, point);
+    }
+  }
+  return secured;
 };
 
 /**
@@ -375,7 +396,7 @@ declare global {
   interface Window {
     ERROR: boolean;
 
-    clipPoly: typeof clipPoly;
+    clipPoly: (points: [number, number][], secure?: number) => [number, number][];
     getSegmentId: typeof getSegmentId;
     debounce: typeof debounce;
     throttle: typeof throttle;

src/utils/index.ts

@@ -227,8 +227,8 @@ import {
   wiki,
 } from "./commonUtils";
 
-window.clipPoly = (points: [number, number][]) =>
-  clipPoly(points, graphWidth, graphHeight);
+window.clipPoly = (points: [number, number][], secure?: number) =>
+  clipPoly(points, graphWidth, graphHeight, secure);
 window.getSegmentId = getSegmentId;
 window.debounce = debounce;
 window.throttle = throttle;