WIP: land with gear down

html/images/space.svg

@@ -212,6 +212,8 @@
     s.node = ship;
     const gun = ship.querySelector('#cannon');
     const shipBody = ship.querySelector("#body");
+    const shipRadius = +shipBody.getAttribute('r');
+
     const legs = ship.querySelector("#legs");
     // const walls = document.querySelectorAll('.wall:not(.inverse)');
     const walls = document.querySelectorAll('.wall');
@@ -491,9 +493,7 @@
       return Object.is(slope(edge), +0);
     }
 
-    function detectEdgeCollision([xc, yc], { xa, ya, xb, yb }) {
-      const shipRadius = 5;
-
+    function detectEdgeCollision([xc, yc], { xa, ya, xb, yb }, shipRadius) {
       const da = distance(xa, ya, xc, yc);
       const db = distance(xb, yb, xc, yc);
       // TODO: calculate this one ahead of time
@@ -524,14 +524,14 @@
 
       const edge = z.find(({ edge: pts, node: ee }) => {
         const str = `${pts.xa},${pts.ya} ${pts.xb},${pts.yb}`;
-          return detectEdgeCollision(position, pts);
+          return detectEdgeCollision(position, pts, shipRadius);
         }
       );
 
       return edge || actualCorner;
     }
 
-    function collisionPosition(edge, position, velocity) {
+    function collisionPosition(edge, position, velocity, radius) {
       const baseSlope = slope(edge);
       // if (Object.is(baseSlope, 0)) s.isLanded = true;
 
@@ -555,7 +555,7 @@
       const normalSegLength = distance(baseNrmlIntxn.x, baseNrmlIntxn.y, position.x, position.y);
       // console.log("baseSegLength", baseSegLength, "normalSegLength", normalSegLength);
       const theta = Math.atan(normalSegLength / baseSegLength);
-      const shipRadius = 5;
+      const shipRadius = radius;
       const h = shipRadius / Math.sin(theta);
 
       const cl = document.createElementNS(namespaceURIsvg, 'line');
@@ -611,19 +611,24 @@
       s.collision = detectCollisions(position, allWallCorners, findAllEdges(allEdgePts, position), collE);
 
       // console.log("future position", xc, yc);
+      // legs.style.display = !legs.style.display || legs.style.display === "none" ? "initial" : "none";
+      legs.style.display = s.gearDown ? "initial" : "none";
 
       if (!current && s.collision) {
         const baseSlope = slope(s.collision.edge);
         if (Object.is(baseSlope, 0) && s.gearDown) s.isLanded = true;
-        const clPos = collisionPosition(s.collision.edge, s.position, s.velocity);
-
+        const clPos = collisionPosition(s.collision.edge, s.position, s.velocity, shipRadius);
         s.velocity = { x: 0, y: 0 };
         s.position = { x: clPos.x, y: clPos.y }
         s.node.style.transform = `translate(${s.position.x}px, ${s.position.y}px)`;
       } else if (current && s.collision) {
         s.velocity = { x: 0, y: 0 };
       } else {
-        s.isLanded = false;
+        if (s.isLanded) {
+          s.gearDown = false;
+          s.isLanded = false;
+        }
+
         s.position = { x: positionX, y: positionY }
         s.node.style.transform = `translate(${positionX}px, ${positionY}px)`;
       }
@@ -818,14 +823,14 @@
         case "ArrowLeft":
           if (!leftPressed) {
             leftPressed = true;
-            s.acceleration.x += -force;
+            if (!s.gearDown) s.acceleration.x += -force;
           }
           break;
         case "KeyD":
         case "ArrowRight":
           if (!rightPressed) {
             rightPressed = true;
-            s.acceleration.x += force;
+            if (!s.gearDown) s.acceleration.x += force;
           }
           break;
         case "KeyQ":
@@ -846,7 +851,6 @@
           started = !started;
           break;
         case "KeyG": // Landing gear
-          legs.style.display = !legs.style.display || legs.style.display === "none" ? "initial" : "none";
           s.gearDown = !s.gearDown;
           break;
       }
@@ -879,14 +883,14 @@
         case "ArrowLeft":
           if (leftPressed) {
             leftPressed = false;
-            s.acceleration.x -= -force;
+            if (!s.gearDown) s.acceleration.x -= -force;
           }
           break;
         case "KeyD":
         case "ArrowRight":
           if (rightPressed) {
             rightPressed = false;
-            s.acceleration.x -= force;
+            if (!s.gearDown) s.acceleration.x -= force;
           }
           break;
         case "KeyQ":