ccm/miti.sh
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

WIP: more rounding

Browse Source
This commit is contained in:
Catalin Constantin Mititiuc
2026-01-30 13:25:51 -08:00
parent d2a8758fb8
commit 89cf20e35a
1 changed files with 112 additions and 52 deletions
Download Patch File Download Diff File Expand all files Collapse all files

164
html/images/space.svg
View File

@@ -1,6 +1,6 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?> <?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg viewBox="-200 -150 400 300" version="1.1" xmlns="http://www.w3.org/2000/svg"> <!-- <svg viewBox="-200 -150 400 300" version="1.1" xmlns="http://www.w3.org/2000/svg"> -->
<!-- <svg viewBox="-10 -10 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg"> --> <svg viewBox="-20 -20 30 30" version="1.1" xmlns="http://www.w3.org/2000/svg">
<style> <style>
foreignObject { foreignObject {
font-size: 4pt; font-size: 4pt;
@@ -129,7 +129,7 @@
<!-- <polygon class="wall" points="-10,-40 10,-40 10,-20 -10,-20" /> --> <!-- <polygon class="wall" points="-10,-40 10,-40 10,-20 -10,-20" /> -->
<!-- <polygon class="wall" points="-10,-40 10,-40 10,-15 -10,-15" /> --> <!-- <polygon class="wall" points="-10,-40 10,-40 10,-15 -10,-15" /> -->
<!-- <polygon class="wall" points="-20,-10 20,10 -10,100 -100,100" /> --> <polygon class="wall" points="-20,-10 20,10 -10,100 -100,100" />
<!-- <polygon class="wall" points="-10,10 10,30 -10,40 -20,20" /> --> <!-- <polygon class="wall" points="-10,10 10,30 -10,40 -20,20" /> -->
<!-- <polygon class="wall" points="-20,-10 0,10 -20,20 -30,0" /> --> <!-- <polygon class="wall" points="-20,-10 0,10 -20,20 -30,0" /> -->
@@ -241,13 +241,13 @@ const Move = (() => {
// https://en.wikipedia.org/wiki/Curve_orientation#Practical_considerations // https://en.wikipedia.org/wiki/Curve_orientation#Practical_considerations
// Determinant for a convex polygon // Determinant for a convex polygon
const det = (xb - xa) * (yc - ya) - (xc - xa) * (yb - ya); const det = (xb - xa) * (yc - ya) - (xc - xa) * (yb - ya);
console.log("xa, ya, xb, yb, xc, yc", xa, ya, xb, yb, xc, yc); // console.log("xa, ya, xb, yb, xc, yc", xa, ya, xb, yb, xc, yc);
const detEx = (xb*expo - xa*expo) * (yc*expo - ya*expo) - (xc*expo - xa*expo) * (yb*expo - ya*expo); const detEx = (xb*expo - xa*expo) * (yc*expo - ya*expo) - (xc*expo - xa*expo) * (yb*expo - ya*expo);
console.log("=----", xb*expo - xa*expo, yc*expo - ya*expo, xc*expo - xa*expo, yb*expo - ya*expo); // console.log("=----", xb*expo - xa*expo, yc*expo - ya*expo, xc*expo - xa*expo, yb*expo - ya*expo);
console.log("=----", xb*expo, xa*expo, yc*expo, ya*expo, xc*expo, xa*expo, yb*expo, ya*expo); // console.log("=----", xb*expo, xa*expo, yc*expo, ya*expo, xc*expo, xa*expo, yb*expo, ya*expo);
console.log("=----", xb*expo - xa*expo, yc*expo - ya*expo, xc*expo - xa*expo, yb*expo - ya*expo); // console.log("=----", xb*expo - xa*expo, yc*expo - ya*expo, xc*expo - xa*expo, yb*expo - ya*expo);
console.log("=----", (xb*expo - xa*expo) * (yc*expo - ya*expo), (xc*expo - xa*expo) * (yb*expo - ya*expo)); // console.log("=----", (xb*expo - xa*expo) * (yc*expo - ya*expo), (xc*expo - xa*expo) * (yb*expo - ya*expo));
console.log("detxxxxxxxxxxxxxxxxxxxxxxxxxxxxx", detEx * 1e-16); // console.log("detxxxxxxxxxxxxxxxxxxxxxxxxxxxxx", detEx * 1e-16);
// (8.0046e+33) / 1e30 // (8.0046e+33) / 1e30
// -> 8004.599999999999 // -> 8004.599999999999
@@ -272,7 +272,7 @@ const Move = (() => {
// console.log(xb, xa, yc, ya, xc, xa, yb, ya); // console.log(xb, xa, yc, ya, xc, xa, yb, ya);
console.log("dettttttttttttttttttttt", det); // console.log("dettttttttttttttttttttt", det);
return det < 0; return det < 0;
} }
@@ -385,25 +385,62 @@ const Move = (() => {
// console.log("x2", x2, "x1", x1, "y4", y4, "y3", y3, "x4", x4, "x3", x3, "y2", y2, "y1", y1); // console.log("x2", x2, "x1", x1, "y4", y4, "y3", y3, "x4", x4, "x3", x3, "y2", y2, "y1", y1);
// console.log("denom", denom); // console.log("denom", denom);
const x21 = +(x2-x1).toPrecision(13); // const x21 = +(x2-x1).toPrecision(13);
const y43 = +(y4-y3).toPrecision(13); // const y43 = +(y4-y3).toPrecision(13);
const x43 = +(x4-x3).toPrecision(13); // const x43 = +(x4-x3).toPrecision(13);
const y21 = +(y2-y1).toPrecision(13); // const y21 = +(y2-y1).toPrecision(13);
const denom = +(x21*y43-x43*y21).toPrecision(13); // const denom = +(x21*y43-x43*y21).toPrecision(13);
const x31 = +(x3-x1).toPrecision(13); // const x31 = +(x3-x1).toPrecision(13);
const y31 = +(y3-y1).toPrecision(13); // const y31 = +(y3-y1).toPrecision(13);
console.log("DENOM", denom); const subR = (a, b) => Math.round(a * 100 - b * 100) / 100;
if (denom) { const x21 = x2-x1;
const x21r = subR(x2, x1);
// Math.round(3.8 * 100 - 3.74 * 100) / 100
const y43 = y4-y3;
const y43r = subR(y4, y3);
const x43 = x4-x3;
const x43r = subR(x4, x3);
const y21 = y2-y1;
const y21r = subR(y2, y1);
const denom = x21*y43-x43*y21;
const denomr = Math.round(x21r*100*y43r-x43r*y21r*100) / 100;
console.log("denom", denom);
console.log("denomr", denomr, x21r, y43r, x43r, y21r);
const x31 = x3-x1;
const x31r = subR(x3, x1);
const y31 = y3-y1;
const y31r = subR(y3, y1);
// console.log("x2", x2, " - ", "x1", x1, "=", x2-x1);
// console.log(x21, y43, x43, y21, denom, x31, y31);
// if (denom) {
if (denomr) {
// const s = ((x3-x1)*(y4-y3)-(x4-x3)*(y3-y1))/denom; // const s = ((x3-x1)*(y4-y3)-(x4-x3)*(y3-y1))/denom;
// const t = -((x2-x1)*(y3-y1)-(x3-x1)*(y2-y1))/denom; // const t = -((x2-x1)*(y3-y1)-(x3-x1)*(y2-y1))/denom;
// const roundedT = +t.toFixed(2); // const roundedT = +t.toFixed(2);
// const roundedS = +s.toFixed(2); // const roundedS = +s.toFixed(2);
// const roundedT = +t.toFixed(15); // const roundedT = +t.toFixed(15);
// const roundedS = +s.toFixed(15); // const roundedS = +s.toFixed(15);
const s = +(+(x31*y43-x43*y31).toPrecision(13) / denom).toPrecision(13); // const s = +(+(x31*y43-x43*y31).toPrecision(13) / denom).toPrecision(13);
const t = +(-(x21*y31-x31*y21).toPrecision(13) / denom).toPrecision(13); // const t = +(-(x21*y31-x31*y21).toPrecision(13) / denom).toPrecision(13);
const s = (x31*y43-x43*y31) / denom;
const t = -(x21*y31-x31*y21) / denom;
const sr = (x31r*y43r-x43r*y31r) / denomr;
const tr = (-(x21r*y31r*100*100-x31r*y21r*100*100) / denomr)/10000;
console.log(x21r, y31r, x31r, y21r, denomr);
// console.log("checking edge for collision", edge); // console.log("checking edge for collision", edge);
// console.log("position edge segs", positionSeg, edgeSeg); // console.log("position edge segs", positionSeg, edgeSeg);
@@ -413,15 +450,35 @@ const Move = (() => {
// console.log("position seg", positionSeg); // console.log("position seg", positionSeg);
// console.log("s", s, "roundedS", roundedS, "t", t, "roundedT", roundedT); // console.log("s", s, "roundedS", roundedS, "t", t, "roundedT", roundedT);
console.log("s", s, "t", t); console.log("s", s, "t", t);
console.log("sr", sr, "tr", tr);
// 2.03 * 10
// 20.299999999999997
// if (roundedS >= 0 && roundedS <= 1 && roundedT >= 0 && roundedT <= 1) { // if (roundedS >= 0 && roundedS <= 1 && roundedT >= 0 && roundedT <= 1) {
if (s >= 0 && s < 1 && t >= 0 && t <= 1) { // this falls through // if (s >= 0 && s < 1 && t >= 0 && t <= 1) { // this falls through
// if (s >= 0 && s <= 1 && t >= 0 && t <= 1) { // this sometimes falls through if (s >= 0 && s <= 1 && t >= 0 && t <= 1) { // this sometimes falls through
const xs = +((x1 + s * +(x2 - x1).toPrecision(13))).toPrecision(13); // const xs = x1 + s * (x2 - x1);
const ys = +((y1 + s * +(y2 - y1).toPrecision(13))).toPrecision(13); // const ys = y1 + s * (y2 - y1);
console.log("xs", xs, "ys", ys);
collision.position = { x: xs, y: ys }; const xs = x1 + s * (x2 - x1);
const ys = y1 + s * (y2 - y1);
// Math.round(Math.round(-2.03 * 100) + 0.45000000000000445 * (Math.round(-1.95 * 100) - Math.round(-2.03 * 100))) / 100
// console.log("xs", xs, "ys", ys);
console.log("x1", x1, "x2", x2);
console.log("y1", y1, "y2", y2);
const x1r = Math.round(x1 * 100);
const x2r = Math.round(x2 * 100);
const y1r = Math.round(y1 * 100);
const y2r = Math.round(y2 * 100);
const xsr = Math.round(x1r + s * (x2r - x1r)) / 100;
const ysr = Math.round(y1r + s * (y2r - y1r)) / 100;
// collision.position = { x: xs, y: ys };
collision.position = { x: xsr, y: ysr };
// console.log("xs, yx", xs, ys); // console.log("xs, yx", xs, ys);
// console.log("xc, yc", xc, yc); // console.log("xc, yc", xc, yc);
@@ -628,9 +685,9 @@ const Move = (() => {
}; };
console.log("----------elapsed", elapsed) console.log("----------elapsed", elapsed)
console.log("velocity", v); // console.log("velocity", v);
console.log("current position", px, py); // console.log("current position", px, py);
console.log("future position", p); // console.log("future position", p);
// console.log("px + elapsed * 1000 * v.x / 1000", px + elapsed * 1000 * v.x / 1000 / 1000); // console.log("px + elapsed * 1000 * v.x / 1000", px + elapsed * 1000 * v.x / 1000 / 1000);
// 0.57 * 1000 * 20 / 1000 // 0.57 * 1000 * 20 / 1000
@@ -675,8 +732,8 @@ const Move = (() => {
} else if (contact.edge) { } else if (contact.edge) {
// if (isLandable(contact.edge) && s.gearDown) s.isLanded = true; // if (isLandable(contact.edge) && s.gearDown) s.isLanded = true;
const accVect = vector(ax, ay); const accVect = vector(ax, ay);
const rise = (contact.edge.yb-contact.edge.ya).toPrecision(16); const rise = contact.edge.yb-contact.edge.ya;
const run = (contact.edge.xb-contact.edge.xa); const run = contact.edge.xb-contact.edge.xa;
const edgeNrmlVect = vector(rise, -run); const edgeNrmlVect = vector(rise, -run);
const velocityVect = vector(v.x, v.y); const velocityVect = vector(v.x, v.y);
@@ -708,14 +765,19 @@ const Move = (() => {
// drawLine(contact.position.x, contact.position.y, contact.position.x + prVonNx, contact.position.y + prVonNy, "teal"); // drawLine(contact.position.x, contact.position.y, contact.position.x + prVonNx, contact.position.y + prVonNy, "teal");
const side = isClockwise([contact.edge.xa, contact.edge.ya], [contact.edge.xb, contact.edge.yb], [px, py]); const side = isClockwise([contact.edge.xa, contact.edge.ya], [contact.edge.xb, contact.edge.yb], [px, py]);
console.log("Side of edge I'm on", side < 0 ? "side A" : "side B");
// contact.velocity = { x: prVonNx, y: prVonNy }; // contact.velocity = { x: prVonNx, y: prVonNy };
Velocity[entity_id] = { x: prVonNx, y: prVonNy }; Velocity[entity_id] = { x: -prVonNx, y: -prVonNy };
console.log("contact.position", contact.position); console.log("velocity", Velocity[entity_id]);
// drawCircle(contact.position.x, contact.position.y);
console.log("current position", px, py); console.log("current position", px, py);
console.log("future position", p); drawCircle(px, py, "pink");
console.log("contact.position", contact.position);
drawCircle(contact.position.x, contact.position.y, "limegreen");
console.log("intended next position", p);
drawCircle(p.x, p.y, "red");
// const newV = { // const newV = {
// x: vx > 0 && vx + ax <= 0 ? 0 : vx + ax, // x: vx > 0 && vx + ax <= 0 ? 0 : vx + ax,
@@ -723,14 +785,14 @@ const Move = (() => {
// }; // };
const newP = { const newP = {
x: contact.position.x + elapsed * prVonNx * metersPerMillisecond, // x: contact.position.x + elapsed * prVonNx * metersPerMillisecond,
y: contact.position.y + elapsed * prVonNy * metersPerMillisecond // y: contact.position.y + elapsed * prVonNy * metersPerMillisecond
x: Math.round((contact.position.x + elapsed * prVonNx * metersPerMillisecond) * 100) / 100,
y: Math.round((contact.position.y + elapsed * prVonNy * metersPerMillisecond) * 100) / 100,
}; };
newP.x = +newP.x.toPrecision(13); console.log("actual next position", newP);
newP.y = +newP.y.toPrecision(13); drawCircle(newP.x, newP.y, "black");
console.log("newP", newP);
drawCircle(newP.x, newP.y, "red", 0.1);
Position[entity_id] = newP; Position[entity_id] = newP;
} }
@@ -824,17 +886,17 @@ function init() {
const mult = 10; const mult = 10;
s.position = { x: 0, y: -10 }; s.position = { x: 0, y: -10 };
// s.velocity = { x: -10, y: 20 }; s.velocity = { x: 0, y: 0 };
// s.velocity = { x: 10, y: 20 }; // s.velocity = { x: 10, y: 20 };
// s.velocity = { x: -20, y: 40 }; // s.velocity = { x: -20, y: 40 };
s.velocity = { x: -1, y: 2 }; // s.velocity = { x: -1, y: 2 };
s.angularVelocity = 0; s.angularVelocity = 0;
// s. velocity = { x: -5*mult, y: 7*mult }; // s. velocity = { x: -5*mult, y: 7*mult };
// drawCircle(0, 0); // drawCircle(0, 0);
// s.acceleration = { x: 1, y: 3 }; s.acceleration = { x: -1, y: 2 };
s.acceleration = { x: 0, y: 0 }; // s.acceleration = { x: 0, y: 0 };
Ships.forEach(({ entity_id }) => { Ships.forEach(({ entity_id }) => {
// Acceleration[entity_id] = s.acceleration; // Acceleration[entity_id] = s.acceleration;
@@ -1137,7 +1199,7 @@ function drawLine(xa, ya, xb, yb, color = "black") {
return el; return el;
} }
function drawCircle(cx, cy, color = "black", r = 1) { function drawCircle(cx, cy, color = "black", r = 0.2) {
const el = document.createElementNS(namespaceURIsvg, 'circle'); const el = document.createElementNS(namespaceURIsvg, 'circle');
el.setAttribute('cx', cx); el.setAttribute('cx', cx);
el.setAttribute('cy', cy); el.setAttribute('cy', cy);
@@ -1563,10 +1625,8 @@ function animate(timestamp) {
newVel = Velocity[Ships[0].entity_id]; newVel = Velocity[Ships[0].entity_id];
s.node.style.transform = `translate(${newPos.x}px, ${newPos.y}px)`; s.node.style.transform = `translate(${newPos.x}px, ${newPos.y}px)`;
// s.node.style.transform = `translate(${Math.round(newPos.x)}px, ${Math.round(newPos.y)}px)`; positionEl.innerText = `${newPos.x},${newPos.y}`;
// console.log("translation", s.node.style.transform); velocityEl.innerText = `${newVel.x},${newVel.y}`;
positionEl.innerText = `${newPos.x.toFixed(1)},${newPos.y.toFixed(1)}`;
velocityEl.innerText = `${newVel.x.toFixed(1)},${newVel.y.toFixed(1)}`;
// updateEdges(position); // updateEdges(position);
if (drawCollisionLines) updateTriangles(position); if (drawCollisionLines) updateTriangles(position);
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 59 KiB

After

Width:  |  Height:  |  Size: 60 KiB