WIP: What is s and t? swapping them seems to work

html/images/space.svg

@@ -126,10 +126,12 @@
   <!-- <polygon class="wall" points="-100,-60 -10,-60 -10,-50 -100,-50" /> -->
   <!-- <polygon class="wall" points="10,50 100,50 100,60 10,60" /> -->
 
-  <polygon class="wall" points="-50,50 -40,60 -50,70 -60,60" />
+  <!-- <polygon class="wall" points="34,56 56,78 45,98 23,89" /> -->
-  <polygon class="wall" points="50,-30 40,-60 50,-70 60,-60" />
+  <polygon class="wall" points="44,55 55,66 33,88 22,66" />
-  <polygon class="wall" points="50,50 60,60 50,70 40,60" />
+  <!-- <polygon class="wall" points="-50,50 -40,60 -50,70 -60,60" /> -->
-  <polygon class="wall" points="-50,-50 -60,-60 -50,-70 -40,-60" />
+  <!-- <polygon class="wall" points="50,-30 40,-60 50,-70 60,-60" /> -->
+  <!-- <polygon class="wall" points="50,50 60,60 50,70 40,60" /> -->
+  <!-- <polygon class="wall" points="-50,-50 -60,-60 -50,-70 -40,-60" /> -->
 
   <!-- <polygon class="wall" points="-10,20 10,10 10,20" /> -->
   <!-- <polygon class="wall" points="20,20 40,20 40,40 20,40" /> -->
@@ -208,7 +210,7 @@
       position: { x: 0, y: 0 },
       // velocity: { x: 0, y: 0 },
 
-      velocity: { x: -1, y: -1 },
+      velocity: { x: 5, y: 10 },
       // velocity: { x: 10*mult, y: 10*mult },
       acceleration: { x: 0, y: 0 },
       rotate: 0,
@@ -894,12 +896,44 @@
 
       const efs = mes.filter(({ edge, wall }) => {
         const { xa, ya, xb, yb } = edge;
-        console.log("xa", xa, "ya", ya, "xb", xb, "yb", yb);
+        // console.log("xa", xa, "ya", ya, "xb", xb, "yb", yb);
         const det = (xb - xa) * (yc - ya) - (xc - xa) * (yb - ya);
         return det < 0;
       });
       console.log("edges facing ship", efs);
 
+      const edgeCollision = efs.find(({ edge, wall }) => {
+        const { xa, ya, xb, yb } = edge;
+        if (xc === x && yc === y) return;
+
+        const positionSeg = { xa: x, ya: y, xb: xc, yb: yc };
+        // const slopeps = slope(positionSeg);
+        // const posNormIntxn = perpIntxn(slopeps, x, y, c.corner.x, c.corner.y);
+
+        const rise = yb - ya;
+        const run = xb - xa;
+        const length = distance(xa, ya, xb, yb);
+
+        const riol = rise / length * shipRadius;
+        const ruol = run / length * shipRadius;
+
+        const edgeSeg = { xa: xa + riol, ya: ya - ruol, xb: xb + riol, yb: yb - ruol};
+
+        const { xa: x1, ya: y1, xb: x2, yb: y2 } = positionSeg;
+        const { xa: x3, ya: y3, xb: x4, yb: y4 } = edgeSeg;
+
+        // https://en.wikipedia.org/wiki/Intersection_(geometry)#Two_line_segments
+        // https://en.wikipedia.org/wiki/Cramer%27s_rule#Explicit_formulas_for_small_systems
+        const s = ((x3-x1)*(y4-y3)-(x4-x3)*(y3-y1))/((x2-x1)*(y4-y3)-(x4-x3)*(y2-y1));
+        const t = -((x2-x1)*(y3-y1)-(x3-x1)*(y2-y1))/((x2-x1)*(y4-y3)-(x4-x3)*(y2-y1));
+        const roundedT = +t.toFixed(2);
+
+        console.log("positionSeg", positionSeg, "edgeSeg", edgeSeg);
+        console.log("s", s, "t", roundedT);
+
+        return s <= 1 && roundedT >= 0;
+      });
+
       efs.forEach(({ edge, wall }) => {
         const { xa, ya, xb, yb } = edge;
         const sl = slope(edge);
@@ -914,28 +948,13 @@
         } else {
           const rise = yb - ya;
           const run = xb - xa;
-          // drawLine(xa + 2, ya - 2, xb, yb);
-          // if (sl > 0)
-            // drawLine(xa + run, ya - rise, xb + run, yb - rise);
           const length = distance(xa, ya, xb, yb)
 
-          // drawLine(xa + rise, ya - run, xb + rise, yb - run);
+          const riol = rise / length * shipRadius;
-          drawLine(xa + rise / length * shipRadius, ya - run / length *
+          const ruol = run / length * shipRadius;
-          shipRadius, xb + rise / length * shipRadius, yb - run / length *
-            shipRadius);
 
-            //determine length of edge and divide values by length?
+          drawLine(xa + riol, ya - ruol, xb + riol, yb - ruol);
-
-          // else
-            // drawLine(xa - run, ya + rise, xb - run, yb + rise);
-            // drawLine(xa - rise, ya + run, xb - rise, yb + run);
-
-
-          // drawLine(xa - run, ya - rise, xb, yb);
-          // drawLine(xa - rise, ya - run, xb, yb);
-          // drawLine(xa + rise, ya + run, xb + rise, yb + run);
         }
-        console.log(edge, "slope", sl);
       });
 
       // corners ahead of ship
@@ -950,25 +969,25 @@
 
       const cornerColl = cwcd.find(detectCornerCollision([xc, yc], [x, y], shipRadius));
 
-      const edgeColl = collE.find(({ edge, wall }) => {
+      // const edgeColl = collE.find(({ edge, wall }) => {
-        const { xa, ya, xb, yb } = edge;
+      //   const { xa, ya, xb, yb } = edge;
-        const da = distance(xa, ya, xc, yc);
+      //   const da = distance(xa, ya, xc, yc);
-        const db = distance(xb, yb, xc, yc);
+      //   const db = distance(xb, yb, xc, yc);
-        // TODO: calculate this one ahead of time
+      //   // TODO: calculate this one ahead of time
-        const dc = distance(xa, ya, xb, yb);
+      //   const dc = distance(xa, ya, xb, yb);
+      //
+      //   // https://en.wikipedia.org/wiki/Altitude_(triangle)#Altitude_in_terms_of_the_sides
+      //   // Find altitude of side c (the base)
+      //   const s = (1 / 2) * (da + db + dc);
+      //   const hc = (2 / dc) * Math.sqrt(s * (s - da) * (s - db) * (s - dc));
+      //   console.log("hc", hc);
+      //
+      //   return +hc.toFixed(2) <= shipRadius;
+      // });
 
-        // https://en.wikipedia.org/wiki/Altitude_(triangle)#Altitude_in_terms_of_the_sides
+      s.collision = cornerColl || edgeCollision;
-        // Find altitude of side c (the base)
-        const s = (1 / 2) * (da + db + dc);
-        const hc = (2 / dc) * Math.sqrt(s * (s - da) * (s - db) * (s - dc));
-        console.log("hc", hc);
 
-        return +hc.toFixed(2) <= shipRadius;
+      if (s.collision) console.log("COLLISION", s.collision);
-      });
-
-      s.collision = cornerColl || edgeColl;
-
-      console.log("COLLISION", s.collision);
 
       legs.style.display = s.gearDown ? "initial" : "none";