emma/trainsim
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

pick and place editing working, saving and loading working

Browse Source
This commit is contained in:
Emmaline Autumn
2025-02-09 02:54:17 -07:00
parent 8dc0af650f
commit 3d4596f8fb
13 changed files with 879 additions and 309 deletions
Download Patch File Download Diff File Expand all files Collapse all files

338
state/states/EditTrackState.ts
View File

@@ -1,11 +1,22 @@
import { Doodler, Vector } from "@bearmetal/doodler";
import { getContextItem, setContextItem } from "../../lib/context.ts";
import {
getContextItem,
getContextItemOrDefault,
setContextItem,
} from "../../lib/context.ts";
import { InputManager } from "../../lib/input.ts";
import { TrackSystem } from "../../track/system.ts";
import { State, StateMachine } from "../machine.ts";
import { States } from "./index.ts";
import { StraightTrack } from "../../track/shapes.ts";
import {
BankLeft,
BankRight,
SBendLeft,
SBendRight,
StraightTrack,
} from "../../track/shapes.ts";
import { TrackSegment } from "../../track/system.ts";
import { clamp } from "../../math/clamp.ts";
export class EditTrackState extends State<States> {
override name: States = States.EDIT_TRACK;
@@ -14,14 +25,18 @@ export class EditTrackState extends State<States> {
States.PAUSED,
]);
private heldEvents: Map<string | number, (() => void) | undefined> =
new Map();
private heldEvents: Map<string, (() => void) | undefined> = new Map();
private currentSegment?: TrackSegment;
private selectedSegment?: TrackSegment;
private ghostSegment?: TrackSegment;
private ghostRotated = false;
private closestEnd?: End;
override update(dt: number): void {
const inputManager = getContextItem<InputManager>("inputManager");
const track = getContextItem<TrackSystem>("track");
const doodler = getContextItem<Doodler>("doodler");
// For moving a segment, i.e. the currently active one
// const segment = track.lastSegment;
@@ -35,6 +50,112 @@ export class EditTrackState extends State<States> {
// });
// }
if (this.selectedSegment) {
const segment = this.selectedSegment;
const firstPoint = segment.points[0].copy();
const mousePos = inputManager.getMouseLocationV();
segment.points.forEach((p, i) => {
const relativePoint = Vector.sub(p, firstPoint);
p.set(mousePos);
p.add(relativePoint);
});
const ends = track.findEnds();
setContextItem("showEnds", true);
const nearbyEnds = ends.filter((end) => {
const dist = Vector.dist(end.pos, mousePos);
return dist < 20 && end.segment !== segment;
});
let closestEnd = nearbyEnds[0];
for (const end of nearbyEnds) {
if (end === closestEnd) continue;
const closestEndTangent = Vector.add(
closestEnd.tangent.copy().mult(20),
closestEnd.pos,
);
const endTangent = Vector.add(
end.tangent.copy().rotate(Math.PI).mult(20),
end.pos,
);
doodler.drawCircle(closestEndTangent, 4, { color: "red", weight: 1 });
doodler.drawCircle(endTangent, 4, { color: "blue", weight: 1 });
if (
endTangent.dist(mousePos) < closestEndTangent.dist(mousePos) ||
end.pos.dist(mousePos) < closestEnd.pos.dist(mousePos)
) {
closestEnd = end;
}
}
if (closestEnd !== this.closestEnd) {
this.closestEnd = closestEnd;
this.ghostSegment = undefined;
this.ghostRotated = false;
}
if (closestEnd) {
// doodler.drawCircle(closestEnd.pos, 4, { color: "green", weight: 1 });
doodler.line(
closestEnd.pos,
Vector.add(closestEnd.pos, closestEnd.tangent.copy().mult(20)),
{ color: "green" },
);
}
if (
this.closestEnd
) {
if (!this.ghostSegment) {
this.ghostSegment = segment.copy();
this.ghostRotated = false;
}
switch (this.closestEnd.frontOrBack) {
case "front":
this.ghostSegment.setPositionByPoint(
this.closestEnd.pos,
this.ghostSegment.points[0],
);
// this.ghostSegment.points[0] = this.closestEnd.pos;
!this.ghostRotated && this.ghostSegment.rotateAboutPoint(
this.closestEnd.tangent.heading(),
this.ghostSegment.points[0],
);
this.ghostRotated = true;
break;
case "back":
this.ghostSegment.setPositionByPoint(
this.closestEnd.pos,
this.ghostSegment.points[3],
);
// this.ghostSegment.points[3] = this.closestEnd.pos;
!this.ghostRotated && this.ghostSegment.rotateAboutPoint(
this.closestEnd.tangent.heading(),
this.ghostSegment.points[3],
);
this.ghostRotated = true;
break;
}
// } else if (closestEnd) {
// this.closestEnd = closestEnd;
} else if (!this.closestEnd || !closestEnd) {
this.ghostSegment = undefined;
this.ghostRotated = false;
}
this.selectedSegment?.draw();
if (this.ghostSegment) {
doodler.drawWithAlpha(0.5, () => {
if (!this.ghostSegment) return;
this.ghostSegment.draw();
if (getContextItemOrDefault("debug", false)) {
const colors = getContextItem<string[]>("colors");
for (
const [i, point] of this.ghostSegment.points.entries() ?? []
) {
doodler.fillCircle(point, 4, { color: colors[i + 3] });
}
}
});
}
}
// manipulate only end of segment while maintaining length
// const segment = track.lastSegment;
// if (segment) {
@@ -50,56 +171,96 @@ export class EditTrackState extends State<States> {
// // doodler.fillText(curveLength.toFixed(2), p3.copy().add(10, 0), 100);
// }
const doodler = getContextItem<Doodler>("doodler");
// Adjust angles until tangent points to mouse
const segment = this.currentSegment;
if (segment) {
segment.propagate();
// const segment = this.currentSegment;
// if (segment) {
// segment.propagate();
const mousePos = inputManager.getMouseLocationV();
const p1 = segment.points[0];
const p2 = segment.points[1];
const p3 = segment.points[2];
const p4 = segment.points[3];
// const mousePos = inputManager.getMouseLocationV();
// const p1 = segment.points[0];
// const p2 = segment.points[1];
// const p3 = segment.points[2];
// const p4 = segment.points[3];
const prevp3 = p3.copy();
const dirToMouse = Vector.sub(mousePos, p2).normalize();
const angleToMouse = dirToMouse.heading();
const angleToP1 = Vector.sub(p2, p1).heading();
const p2DistToMouse = Vector.dist(p2, mousePos);
const p3DistToMouse = Vector.dist(p3, mousePos);
const distToP3 = Vector.dist(p2, p3);
const distToP4 = Vector.dist(prevp3, p4);
if (
Math.abs(angleToMouse - angleToP1) < .6 &&
p2DistToMouse > distToP3 &&
p3DistToMouse > distToP4
) {
{
const dirToNewP3 = dirToMouse.copy().rotate(
-(angleToMouse - angleToP1) / 2,
);
dirToNewP3.setMag(distToP3);
p3.set(Vector.add(p2, dirToNewP3));
doodler.line(p2, Vector.add(p2, dirToNewP3), { color: "blue" });
doodler.line(p2, Vector.add(p2, dirToMouse.mult(100)), {
color: "red",
});
}
{
const dirToMouse = Vector.sub(mousePos, p3).normalize();
dirToMouse.setMag(distToP4);
p4.set(Vector.add(p3, dirToMouse));
doodler.line(p3, Vector.add(p3, dirToMouse), { color: "green" });
}
segment.clampLength();
}
doodler.fillText(
segment.calculateApproxLength().toFixed(2),
p2.copy().add(10, 0),
100,
);
// const prevp3 = p3.copy();
// const dirToMouse = Vector.sub(mousePos, p2).normalize();
// const angleToMouse = dirToMouse.heading();
// const dirToP1 = Vector.sub(p2, p1).normalize();
// const angleToP1 = dirToP1.heading();
// const p2DistToMouse = Vector.dist(p2, mousePos);
// const p3DistToMouse = Vector.dist(p3, mousePos);
// const distToP3 = Vector.dist(p2, p3);
// const distToP4 = Vector.dist(prevp3, p4);
// const goodangle = clamp(
// angleToMouse - angleToP1,
// angleToP1 - .6,
// angleToP1 + .6,
// );
// if (
// // Math.abs(goodangle) < .6 &&
// p2DistToMouse > distToP3 &&
// p3DistToMouse > distToP4
// ) {
// {
// const dirToNewP3 = dirToP1.copy().rotate(
// goodangle / 2,
// );
// dirToNewP3.setMag(distToP3);
// p3.set(Vector.add(p2, dirToNewP3));
// doodler.line(p2, Vector.add(p2, dirToNewP3), { color: "blue" });
// doodler.line(
// p2,
// Vector.add(p2, dirToNewP3),
// {
// color: "red",
// },
// );
// }
// {
// const dirToMouse = Vector.sub(mousePos, p3).normalize();
// const dirToP3 = Vector.sub(p3, p2).normalize();
// const angleToP3 = dirToP3.heading();
// const goodangle = clamp(
// dirToMouse.heading() - angleToP3,
// angleToP3 - .6,
// angleToP3 + .6,
// );
// const dirToNewP4 = dirToP3.copy().rotate(
// goodangle / 2,
// );
// dirToNewP4.setMag(distToP4);
// p4.set(Vector.add(p3, dirToNewP4));
// doodler.line(p3, Vector.add(p3, dirToNewP4), { color: "green" });
// }
// segment.clampLength();
// }
// // doodler.fillText(
// // segment.calculateApproxLength().toFixed(2),
// // p2.copy().add(10, 0),
// // 100,
// // );
// }
const translation = new Vector(0, 0);
if (inputManager.getKeyState("ArrowUp")) {
translation.y -= 1;
}
if (inputManager.getKeyState("ArrowDown")) {
translation.y += 1;
}
if (inputManager.getKeyState("ArrowLeft")) {
translation.x -= 1;
}
if (inputManager.getKeyState("ArrowRight")) {
translation.x += 1;
}
if (translation.x !== 0 || translation.y !== 0) {
track.translate(translation);
}
track.draw(true);
@@ -109,6 +270,15 @@ export class EditTrackState extends State<States> {
// Draw track tangents
}
override start(): void {
setContextItem("trackSegments", [
undefined,
new StraightTrack(),
new SBendLeft(),
new SBendRight(),
new BankLeft(),
new BankRight(),
]);
const inputManager = getContextItem<InputManager>("inputManager");
this.heldEvents.set("e", inputManager.offKey("e"));
this.heldEvents.set("Escape", inputManager.offKey("Escape"));
@@ -127,20 +297,62 @@ export class EditTrackState extends State<States> {
state.transitionTo(States.RUNNING);
});
inputManager.onKey("w", () => {
const track = getContextItem<TrackSystem>("track");
const segment = track.lastSegment;
if (!segment) return;
const n = new StraightTrack(segment.points[3]);
const t = segment.tangent(1).heading();
n.rotate(t);
segment.frontNeighbours.push(n);
track.registerSegment(n);
this.currentSegment = n;
inputManager.onKey(" ", () => {
if (this.selectedSegment) {
this.selectedSegment = undefined;
} else {
this.selectedSegment = new StraightTrack();
}
});
inputManager.onKey("1", () => {
this.currentSegment = track.firstSegment;
inputManager.onMouse("left", () => {
const track = getContextItem<TrackSystem>("track");
if (this.ghostSegment && this.closestEnd) {
const segment = this.ghostSegment.cleanCopy();
switch (this.closestEnd.frontOrBack) {
case "front":
this.closestEnd.segment.frontNeighbours.push(segment);
segment.backNeighbours.push(this.closestEnd.segment);
break;
case "back":
this.closestEnd.segment.backNeighbours.push(segment);
segment.frontNeighbours.push(this.closestEnd.segment);
break;
}
track.registerSegment(segment);
this.ghostSegment = undefined;
this.closestEnd = undefined;
} else if (this.selectedSegment) {
track.registerSegment(this.selectedSegment);
this.selectedSegment = new StraightTrack();
} else {
this.selectedSegment = undefined;
}
});
// inputManager.onKey("w", () => {
// const track = getContextItem<TrackSystem>("track");
// const segment = track.lastSegment;
// if (!segment) return;
// const n = new StraightTrack(segment.points[3]);
// const t = segment.tangent(1).heading();
// n.rotate(t);
// segment.frontNeighbours.push(n);
// track.registerSegment(n);
// this.currentSegment = n;
// });
// inputManager.onKey("1", () => {
// this.currentSegment = track.firstSegment;
// });
inputManager.onNumberKey((i) => {
console.log(i);
const segments = getContextItem<TrackSegment[]>("trackSegments");
this.selectedSegment = segments[i];
this.ghostRotated = false;
this.ghostSegment = undefined;
});
this.currentSegment = track.lastSegment;
@@ -151,6 +363,7 @@ export class EditTrackState extends State<States> {
override stop(): void {
const inputManager = getContextItem<InputManager>("inputManager");
inputManager.offKey("e");
inputManager.offKey("w");
inputManager.offKey("Escape");
if (this.heldEvents.size > 0) {
for (const [key, cb] of this.heldEvents) {
@@ -161,5 +374,6 @@ export class EditTrackState extends State<States> {
}
}
setContextItem("trackCopy", undefined);
setContextItem("trackSegments", undefined);
}
}