WIP: collision corners

html/images/space.svg

@@ -110,7 +110,9 @@
 
   <!-- <polygon class="wall" points="20,20 30,20 40,40 20,40" /> -->
   <!-- <polygon class="wall" points="20,20 50,20 70,40 70,70 50,90 20,90 0,70 0,40" /> -->
-  <polygon class="wall" points="-10,-10 -20,-10 -20,-20 -10,-20" />
+  <!-- <polygon class="wall" points="-10,-10 -20,-10 -20,-20 -10,-20" /> -->
+  <!-- <polygon class="wall" points="-50,-50 -60,-50 -60,-60 -50,-60" /> -->
+  <polygon class="wall" points="10,-50 0,-50 0,-60 10,-60" />
 
   <!-- <polygon class="wall" points="-10,20 10,10 10,20" /> -->
   <!-- <polygon class="wall" points="20,20 40,20 40,40 20,40" /> -->
@@ -187,7 +189,8 @@
 
     const s = {
       position: { x: 0, y: 0 },
-      velocity: { x: 0, y: 0 },
+      // velocity: { x: 0, y: 0 },
+      velocity: { x: 0, y: -8 },
 
       // velocity: { x: 0.25 * mult, y: 1 * mult },
       // velocity: { x: 0, y: 1 * mult },
@@ -367,40 +370,27 @@
 
     // function getCollisionCorners(ws, { x: px, y: py }, { x: vx, y: vy }) {
     function getCollisionCorners(ws, { x: x1, y: y1 }, { x: x2, y: y2 }) {
-      // https://en.wikipedia.org/wiki/Distance_from_a_point_to_a_line#Line_defined_by_two_points
+      const diffx = x2;
+      const diffy = y2;
+      const detv = x2 * y1 - y2 * x1;
+      const dv = Math.sqrt(diffy ** 2 + diffx ** 2);
+      const slopev = slope({ xa: x1, ya: y1, xb: x1 + x2, yb: y1 + y2 });
 
-      // find shortest distance between corners and velocity line
-      // if that distance is less than the ship's radius, we need to check
-      // that corner for collision
-      // console.log("position", px, py);
-      // console.log("velocity", vx, vy);
-      const blah = ws.reduce((acc, w) => {
-        // console.log("wall corners", w, w.corners);
-        // console.log("wall", w);
-        // w.corners.forEach(c => {
-        //   console.log("corner", c);
-        //   const { x: x0, y: y0 } = c;
-        //   const d = Math.abs((y2-y1)*x0 - (x2-x1)*y0 + x2*y1-y2*x1) / Math.sqrt((y2 - y1) ** 2 + (x2 - x1) ** 2)
-        //   console.log("d", d);
-        //   return c;
-        // });
-        // return [...acc, ...w.corners];
-        const corners = w.corners.map(c => ({ corner: c, node: w }));
+      return ws.reduce((acc, w) => {
+        const filtered = w.corners.filter(c => {
+          const { x: x0, y: y0 } = c;
+          const velNormIntxn = perpIntxn(slopev, x1, y1, x0, y0);
+          // const d = distance(velNormIntxn.x, velNormIntxn.y , x0, y0);
 
-        const filtered = corners.filter(c => {
-          const { x: x0, y: y0 } = c.corner;
-          const d = Math.abs((y2-y1)*x0 - (x2-x1)*y0 + x2*y1-y2*x1) / Math.sqrt((y2 - y1) ** 2 + (x2 - x1) ** 2);
-          // console.log("corner", c.corner, "d", d, "shipRadius", shipRadius);
+          // https://en.wikipedia.org/wiki/Distance_from_a_point_to_a_line#Line_defined_by_two_points
+          const d = Math.abs(diffy * x0 - diffx * y0 + detv) / dv;
+          // console.log("corner", c, "d", d, "shipRadius", shipRadius);
           return d <= shipRadius;
+        // }).map(c => ({ corner: c, node: w }));
         });
 
-        // console.log("filtered", filtered);
-
-        // return [...acc, ...corners];
         return [...acc, ...filtered];
       }, []);
-
-      return blah;
     }
 
     function updateTriangles([positionX, positionY]) {
@@ -664,6 +654,7 @@
       let [xc, yc] = position;
 
       const collE = getCollisionEdges(edgeszz, position);
+      // console.log("position", { x, y }, "velocity", s.velocity);
       const collC = getCollisionCorners(ws, { x, y }, s.velocity);
 
       console.log("collision corners", collC);