From 1a2f2ab941f0c7a0dc9af62481ee70537539a1de Mon Sep 17 00:00:00 2001
From: Andres Mendez <shiruken@gmail.com>
Date: Sat, 29 Aug 2026 22:22:56 -0500
Subject: [PATCH 1/2] Adds findClosestLine. Next: break up the line to add a
 new point

---
 script.js | 43 +++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 43 insertions(+)

diff --git a/script.js b/script.js
index 5e068b3..4fc5531 100644
--- a/script.js
+++ b/script.js
@@ -53,6 +53,7 @@ var isFullscreen = false;
 var taskbarAndCanvas = document.querySelector('.right');
 
 var editMode = false;
+var addPoint = false;
 var selectedPointIndex = -1;
 var selectedPolygonIndex = -1;
 
@@ -216,6 +217,42 @@ function getParentPoints() {
     return parentPoints;
 }
 
+function findClosestLine(x, y) {
+    for (let i = 0; i < masterPoints.length; i++) {
+        const lineOrPoly = masterPoints[i];
+
+        for (let j = 0; j < lineOrPoly.length; j++) {
+            const [p1x, p1y] = lineOrPoly[j];
+            let [p2x, p2y] = lineOrPoly[0]; // wrap around in case we're at the end
+            if(lineOrPoly[j+1] != undefined) {
+                [p2x, p2y] = lineOrPoly[j+1];
+            }
+
+            const m = (p2y - p1y) / (p2x - p1x);
+
+            if(m == 0) { // cumbersome edge case of two-point slope
+                const horzStart = Math.min(p2x,p1x);
+                const horzEnd = Math.max(p2x,p1x);
+                if(x >= horzStart && x <= horzEnd && p2y - 5 <= y && y <= p2y + 5 ) {
+                    return i;
+                }
+            }
+            let b = 0
+            if(p1x < p2x) b = p1y
+            if(p1x > p2x) b = p2y
+
+            // ( y - b ) / m because Y is upside down and that's too hard
+            const predictX = Math.round(Math.abs(p1x + ((y-p1y)/m)))
+
+            if(predictX - 5 <= x && x <= predictX + 5) {
+                return i;
+            }
+        }
+    }
+
+    return -1
+}
+
 function findClosestPoint(x, y) {
     let minDist = Infinity;
     let closestPoint = null;
@@ -341,6 +378,8 @@ canvas.addEventListener('mousemove', function(e) {
         drawAllPolygons(offScreenCtx);
         blitCachedCanvas();
         writePoints(getParentPoints());
+    } else if (editMode && selectedPointIndex == -1 && addPoint) {
+
     }
 });
 
@@ -456,6 +495,9 @@ canvas.addEventListener('mousedown', function(e) {
             selectedPointIndex = pointIndex;
             selectedPolygonIndex = polygonIndex;
             canvas.style.cursor = 'grabbing';
+        } else { // don't try add a point if you're already over one
+          const polygonIndex = findClosestLine(x,y);
+console.log('=-=-=- Clicked on a line? ', polygonIndex > -1);
         }
     } else {
         // click handling for drawing mode
@@ -512,6 +554,7 @@ canvas.addEventListener('mouseup', function(e) {
         selectedPointIndex = -1;
         selectedPolygonIndex = -1;
         canvas.style.cursor = 'move';
+        addPoint = true
     }
 });
 

From 0aee59d321965f0e0bbd62d86111290400945cba Mon Sep 17 00:00:00 2001
From: Andres Mendez <shiruken@gmail.com>
Date: Sun, 30 Aug 2026 15:04:03 -0500
Subject: [PATCH 2/2] Reorg'd code for better UX

---
 script.js | 24 ++++++++++++++----------
 1 file changed, 14 insertions(+), 10 deletions(-)

diff --git a/script.js b/script.js
index 4fc5531..6cf035e 100644
--- a/script.js
+++ b/script.js
@@ -53,7 +53,6 @@ var isFullscreen = false;
 var taskbarAndCanvas = document.querySelector('.right');
 
 var editMode = false;
-var addPoint = false;
 var selectedPointIndex = -1;
 var selectedPolygonIndex = -1;
 
@@ -230,13 +229,14 @@ function findClosestLine(x, y) {
 
             const m = (p2y - p1y) / (p2x - p1x);
 
-            if(m == 0) { // cumbersome edge case of two-point slope
+            if(m == 0) { // cumbersome edge case of two-point slope. @TODO: needs buffer
                 const horzStart = Math.min(p2x,p1x);
                 const horzEnd = Math.max(p2x,p1x);
                 if(x >= horzStart && x <= horzEnd && p2y - 5 <= y && y <= p2y + 5 ) {
-                    return i;
+                    return { polygonIndex: i, insertionIndex: j };
                 }
             }
+
             let b = 0
             if(p1x < p2x) b = p1y
             if(p1x > p2x) b = p2y
@@ -245,12 +245,12 @@ function findClosestLine(x, y) {
             const predictX = Math.round(Math.abs(p1x + ((y-p1y)/m)))
 
             if(predictX - 5 <= x && x <= predictX + 5) {
-                return i;
+                return { polygonIndex: i, insertionIndex: j };
             }
         }
     }
 
-    return -1
+    return { polygonIndex: -1, insertionIndex: -1 };
 }
 
 function findClosestPoint(x, y) {
@@ -378,8 +378,6 @@ canvas.addEventListener('mousemove', function(e) {
         drawAllPolygons(offScreenCtx);
         blitCachedCanvas();
         writePoints(getParentPoints());
-    } else if (editMode && selectedPointIndex == -1 && addPoint) {
-
     }
 });
 
@@ -496,8 +494,15 @@ canvas.addEventListener('mousedown', function(e) {
             selectedPolygonIndex = polygonIndex;
             canvas.style.cursor = 'grabbing';
         } else { // don't try add a point if you're already over one
-          const polygonIndex = findClosestLine(x,y);
-console.log('=-=-=- Clicked on a line? ', polygonIndex > -1);
+          const { polygonIndex, insertionIndex } = findClosestLine(x,y);
+
+          if(polygonIndex > -1) {
+            canvas.style.cursor = 'crosshair';
+            masterPoints[polygonIndex].splice(insertionIndex+1, 0, [x, y]);
+            drawAllPolygons(offScreenCtx);
+            blitCachedCanvas();
+            writePoints(getParentPoints());
+          }
         }
     } else {
         // click handling for drawing mode
@@ -554,7 +559,6 @@ canvas.addEventListener('mouseup', function(e) {
         selectedPointIndex = -1;
         selectedPolygonIndex = -1;
         canvas.style.cursor = 'move';
-        addPoint = true
     }
 });