From 112c100057e5e0f7a127faec702c1147be74c30f Mon Sep 17 00:00:00 2001
From: Catalin Constantin Mititiuc <webdevcat@proton.me>
Date: Wed, 21 Jan 2026 14:16:34 -0800
Subject: [PATCH] WIP: slide along wall on collision

---
 html/images/space.svg | 29 ++++++++++++++++++++++++-----
 1 file changed, 24 insertions(+), 5 deletions(-)

diff --git a/html/images/space.svg b/html/images/space.svg
index 6412550..74e298c 100644
--- a/html/images/space.svg
+++ b/html/images/space.svg
@@ -125,7 +125,9 @@
   <!-- <polygon class="wall" points="-10,50 -3,50 -3,60 -10,60" /> -->
 
   <!-- <polygon class="wall" points="20,-50 10,-50 10,-60 20,-60" /> -->
-  <polygon class="wall" points="-10,10 10,10 10,40 -10,40" />
+  <!-- <polygon class="wall" points="-10,10 10,10 10,40 -10,40" /> -->
+  <!-- <polygon class="wall" points="-10,10 10,20 -10,40 -20,20" /> -->
+  <polygon class="wall" points="-10,10 10,30 -10,40 -20,20" />
 
   <!-- <polygon class="wall" points="-20,-50 -10,-50 -10,-60 -20,-60" /> -->
   <!-- <polygon class="wall" points="20,50 10,50 10,60 20,60" /> -->
@@ -542,9 +544,28 @@ const Move = (() => {
                 Position[entity_id] = { x: p.x, y: p.y };
               }
             }
-
           } else {
+            if (contact.edge.xa < contact.edge.xb && contact.edge.ya < contact.edge.yb) {
+              // const m1 = slope({ xa: vx, ya: vy, xb: v.x, yb: v.y });
+              // const m2 = slope(contact.edge);
+              // const theta = Math.atan(Math.abs((m1-m2)/(1+m1*m2)));
+              const thetaY = Math.atan((contact.edge.yb - contact.edge.ya)/(contact.edge.xb-contact.edge.xa));
+              const thetaX = Math.atan((contact.edge.xb-contact.edge.xa)/(contact.edge.yb - contact.edge.ya));
+              console.log("VELOCITY", v);
 
+              Velocity[entity_id] = {
+                x: v.x * Math.sin(thetaX) + v.y * Math.cos(thetaY),
+                y: v.y * Math.sin(thetaY) + v.x * Math.cos(thetaX)
+              };
+
+              console.log("VELOCITY AFTER", Velocity[entity_id]);
+
+              Position[entity_id] = { x: p.x, y: p.y };
+              // console.log("contact", contact.edge);
+              // Position[entity_id] = contact.position;
+            } else {
+
+            }
           }
         }
       } else {
@@ -637,7 +658,7 @@ function init() {
 
   s.position = { x: 0, y: 0 };
   // s.velocity = { x: 0, y: -10 };
-  s.velocity = { x: 0, y: 0 };
+  s.velocity = { x: 0, y: 10 };
   s.angularVelocity = 0;
 
   // s. velocity = { x: -5*mult, y: 7*mult };
@@ -1112,8 +1133,6 @@ function edgeContactPosition(xc, yc, x, y, edge, radius) {
   const theta = Math.atan(normalSegLength / baseSegLength);
   const h = (radius)/ Math.sin(theta);
 
-  console.log("HHHHHHHHHHHHHHHHHHHHHHHHHHHHH", h);
-
   const cl = document.createElementNS(namespaceURIsvg, 'line');
   cl.setAttribute('x1', basePosIntxn.x);
   cl.setAttribute('y1', basePosIntxn.y);