diff --git a/html/images/space.svg b/html/images/space.svg index 4ef3e44..766b77b 100644 --- a/html/images/space.svg +++ b/html/images/space.svg @@ -113,6 +113,7 @@ + @@ -190,7 +191,12 @@ const s = { position: { x: 0, y: 0 }, // velocity: { x: 0, y: 0 }, - velocity: { x: 0, y: -5000 }, + velocity: { x: 1, y: 1 }, + // velocity: { x: 10, y: -10 }, + // velocity: { x: -10, y: 10 }, + // velocity: { x: 0, y: 10 }, + // velocity: { x: 10, y: 0 }, + // velocity: { x: 0, y: -5000 }, // velocity: { x: 0.25 * mult, y: 1 * mult }, // velocity: { x: 0, y: 1 * mult }, @@ -393,6 +399,95 @@ }, []); } + function getForwardCollisionCorners(walls, position, velocity) { + const { x: x1, y: y1 } = position; + const { x: x2, y: y2 } = velocity; + // const a = { x: -100, y: 0 }; + // const b = { x: 100, y: 0 }; + + console.log("VELOCITY", velocity); + + const { x: vx, y: vy } = velocity; + + console.log("velocity", velocity, "position", position); + let perppts; + + if (vx === 0 && yx === 0) { + // none + } else if (vx === 0 && vy > 0) { + } else if (vx === 0 && vy < 0) { + } else if (vy === 0 && vx > 0) { + } else if (vy === 0 && vx < 0) { + } else if (vy > 0 && vx > 0) { + const vslope = vy / vx; + const pslope = 1 / -vslope; + // Point-slope line equation + // y − y1 = m(x − x1) + // y − y1 = mx - mx1 + // y = mx - mx1 + y1 + const pya = pslope * (x1 + 1) - pslope * x1 + y1; + const pyb = pslope * (x1 - 1) - pslope * x1 + y1; + + perppts = { a: { x: x1 + 1, y: pya }, b: { x: x1 - 1, y: pyb }}; + } else if (vy > 0 && vx < 0) { + } else if (vy < 0 && vx > 0) { + } else if (vy < 0 && vx < 0) { + + } else { + // + } + + + // const slopev = slope({ xa: x1, ya: y1, xb: x1 + x2, yb: y1 + y2 }); + // console.log("SLOPE", slopev); + // let slopeperp; + // + // if (slopev === -Infinity) { + // slopeperp = 0; + // } else if (slopev === Infinity) { + // slopeperp = -0; + // } else if (Object.is(slopev, -0)) { + // slopeperp = Infinity; + // } else if (slopev === 0) { + // slopeperp = -Infinity; + // } else { + // slopeperp = 1 / -slopev; + // } + // + // + // if (Object.is(slopeperp, 0)) { + // perppts = { a: { x: x1 - 1, y: y1 }, b: { x: x1 + 1, y: y1 }}; + // } else if (Object.is(slopeperp, -0)) { + // perppts = { a: { x: x1 + 1, y: y1 }, b: { x: x1 - 1, y: y1 }}; + // } else if (slopeperp === Infinity) { + // perppts = { a: { x: x1, y: y1 + 1 }, b: { x: x1, y: y1 - 1 }}; + // } else if (slopeperp === -Infinity) { + // perppts = { a: { x: x1, y: y1 - 1 }, b: { x: x1, y: y1 + 1 }}; + // } else { + // if (y2 < 0) + // perppts = { a: { x: x1 - 1, y: y1 }, b: { x: x1 + 1, y: y1 }}; + // else + // perppts = { a: { x: x1 + 1, y: y1 }, b: { x: x1 - 1, y: y1 }}; + // } + + + const { a, b } = perppts; + drawLine(a.x, a.y, b.x, b.y); + + return walls.reduce((acc, w) => { + // console.log(w.corners); + const filtered = w.corners.filter(c => { + // https://stackoverflow.com/a/1560510 + // position = sign((Bx - Ax) * (Y - Ay) - (By - Ay) * (X - Ax)) + + const det = (b.x - a.x) * (c.y - a.y) - (b.y - a.y) * (c.x - a.x); + return det < 0; + }); + + return [...acc, ...filtered]; + }, []); + } + function updateTriangles([positionX, positionY]) { const delim = ' '; const className = 'clockwise-orientation'; @@ -581,6 +676,9 @@ } function cornerCollisionPosition({ x: x1, y: y1 }, { x: x2, y: y2 }) { + // todo1: i only want the collisions ahead, not behind + // todo2: how do we tell if we've passed the collision point already? + const diffx = x2; const diffy = y2; const detv = x2 * y1 - y2 * x1; @@ -672,20 +770,23 @@ const changeY = 0.001 * elapsed * velocityY; let { x, y } = s.position; - console.log("current position", x, y); + // console.log("current position", x, y); // console.log("elapsed", elapsed, "changeX", changeX, "changeY", changeY); // let position = [positionX, positionY] = restart ? [0, 0] : wrapPos(changeX + x, changeY + y); let position = [positionX, positionY] = [changeX + x, changeY + y]; let [xc, yc] = position; - console.log("future position", xc, yc); + // console.log("future position", xc, yc); const collE = getCollisionEdges(edgeszz, position); // console.log("position", { x, y }, "velocity", s.velocity); const collC = getCollisionCorners(ws, { x, y }, s.velocity); + const fCollC = getForwardCollisionCorners(ws, { x, y }, s.velocity); - console.log("collision corners", collC); + + // console.log("collision corners", collC); + console.log("forward collision corners", fCollC); ccps = collC.map(cornerCollisionPosition({ x, y }, s.velocity)); - console.log("corner collision position", ccps); + // console.log("corner collision position", ccps); current = s.collision; s.collision = detectCollisions(position, allWallCorners, collE);