Better radiused banks

.gitignore

@@ -23,3 +23,6 @@ dist-ssr
 *.njsproj
 *.sln
 *.sw?
+
+# Packed devtools
+devtools.zip

deno.json

@@ -3,7 +3,8 @@
     "dev": "deno run -A --node-modules-dir npm:vite",
     "build": "deno run -A --node-modules-dir npm:vite build",
     "preview": "deno run -A --node-modules-dir npm:vite preview",
-    "serve": "deno run --allow-net --allow-read jsr:@std/http@1/file-server dist/"
+    "serve": "deno run --allow-net --allow-read jsr:@std/http@1/file-server dist/",
+    "pack-devtools": "rm -rf devtools.zip && deno run -A npm:web-ext build -o --source-dir devtools --artifacts-dir devtools.zip"
   },
   "compilerOptions": {
     "lib": [

devtools/manifest.json

@@ -1,8 +1,9 @@
 {
   "manifest_version": 2,
-  "name": "Context Stack DevTools",
+  "name": "SNR DevTools",
   "version": "1.0",
   "description": "A devtools panel to view and edit context stack values.",
+  "author": "Emmaline Autumn",
   "devtools_page": "devtools.html",
   "background": {
     "scripts": [
@@ -24,5 +25,13 @@
     "devtools",
     "tabs",
     "*://*/*"
-  ]
+  ],
+  "icons": {
+    "48": "train icon.png"
+  },
+  "browser_specific_settings": {
+    "gecko": {
+      "id": "snrdt@cyborggrizzly.com"
+    }
+  }
 }

src/lib/resources.ts

@@ -1,16 +1,39 @@
+// namespace:type/location
+type NamespacedId = `${string}:${"img" | "audio" | "sprite"}/${string}`;
+
+/**
+ * Resources are stored in namespaces, and can be accessed by their namespaced id.
+ * Sprites are located in blob storage as a single png file.
+ * Audio is located in blob storage as a single mp3 file.
+ *
+ * Custom resources can be loaded via the public API, however they will not be loaded on other clients.
+ * Ideally, engine and car definitions should be stored in the resource manager so that custom cars can be created.
+ */
 export class ResourceManager {
   private resources: Map<string, unknown> = new Map();
   private statuses: Map<string, Promise<boolean>> = new Map();
 
-  get<T>(name: string): T {
+  get<T>(name: NamespacedId): T {
     if (!this.resources.has(name)) {
       throw new Error(`Resource ${name} not found`);
     }
     return this.resources.get(name) as T;
   }
 
-  set(name: string, value: unknown) {
+  set(
+    name: NamespacedId,
+    value: unknown,
+  ) {
+    const identifier = parseNamespacedId(name);
     if (typeof (value as EventSource).addEventListener === "function") {
+      if (value instanceof Image) {
+        // During development, we can use the local file system
+        value.src =
+          `/blobs/${identifier.namespace}/${identifier.type}/${identifier.name}${
+            extensionByType(identifier.type)
+          }`;
+        console.log(value.src);
+      }
       this.statuses.set(
         name,
         new Promise((resolve) => {
@@ -36,3 +59,28 @@ export class ResourceManager {
     return Promise.all(Array.from(this.statuses.values()));
   }
 }
+
+type ResourceType = "img" | "audio" | "sprite";
+
+function extensionByType(type: ResourceType) {
+  switch (type) {
+    case "img":
+      return ".png";
+    case "audio":
+      return ".mp3";
+    case "sprite":
+      return ".png";
+  }
+}
+
+type NamespaceIdentifier = {
+  namespace: string;
+  type: ResourceType;
+  name: string;
+};
+
+function parseNamespacedId(id: NamespacedId): NamespaceIdentifier {
+  const [namespace, location] = id.split(":");
+  const [type, ...name] = location.split("/");
+  return { namespace, type: type as ResourceType, name: name.join("/") };
+}

src/state/states/LoadState.ts

@@ -34,9 +34,11 @@ export class LoadState extends State<States> {
 
     bootstrapInputs();
 
-    resources.set("engine-sprites", new Image());
-    resources.get<HTMLImageElement>("engine-sprites")!.src =
-      "/sprites/EngineSprites.png";
+    // This should be driven by a manifest
+    resources.set("snr:sprite/engine", new Image());
+    resources.set("snr:sprite/LargeLady", new Image());
+    // resources.get<HTMLImageElement>("snr:sprite/engine")!.src =
+    //   "/sprites/EngineSprites.png";
     resources.ready().then(() => {
       this.stateMachine.transitionTo(States.RUNNING);
     });

src/state/states/RunningState.ts

@@ -8,6 +8,7 @@ import { DotFollower } from "../../train/newTrain.ts";
 import { Train } from "../../train/train.ts";
 import { State } from "../machine.ts";
 import { States } from "./index.ts";
+import { LargeLady } from "../../train/LargeLady.ts";
 
 export class RunningState extends State<States> {
   override name: States = States.RUNNING;
@@ -58,12 +59,14 @@ export class RunningState extends State<States> {
       // const path = track.path;
       // const follower = new DotFollower(path, path.points[0].copy());
       // ctx.trains.push(follower);
-      const train = new Train(track.path, [new RedEngine(), new Tender()]);
-      ctx.trains.push(train);
+      // const train = new Train(track.path, [new LargeLady(), new Tender()]);
+      // ctx.trains.push(train);
     });
+    const train = new Train(track.path, [new LargeLady()]);
+    ctx.trains.push(train);
     // const trainCount = 1000;
     // for (let i = 0; i < trainCount; i++) {
-    //   const train = new Train(track.path, [new RedEngine(), new Tender()]);
+    //   const train = new Train(track.path, [new LargeLady(), new Tender()]);
     //   ctx.trains.push(train);
     // }
 

src/track/shapes.ts

@@ -44,7 +44,7 @@ export class BankLeft extends TrackSegment {
     const p2 = start.copy();
     const p3 = start.copy();
     const p4 = start.copy();
-    const scale = 33;
+    const scale = 66;
 
     p2.add(new Vector(1, 0).mult(scale));
     p3.set(p2);
@@ -70,7 +70,7 @@ export class BankRight extends TrackSegment {
     const p2 = start.copy();
     const p3 = start.copy();
     const p4 = start.copy();
-    const scale = 33;
+    const scale = 66;
 
     p2.add(new Vector(1, 0).mult(scale));
     p3.set(p2);

src/train/LargeLady.ts

@@ -0,0 +1,121 @@
+import { Doodler, Vector } from "@bearmetal/doodler";
+import { TrainCar } from "./train.ts";
+import { getContextItem } from "../lib/context.ts";
+import { ResourceManager } from "../lib/resources.ts";
+
+export class LargeLady extends TrainCar {
+  scale = 1;
+  constructor() {
+    const resources = getContextItem<ResourceManager>("resources");
+    const img = resources.get<HTMLImageElement>("snr:sprite/LargeLady")!;
+    super(50, 10, img, 160, 23, {
+      at: new Vector(0, 0),
+      width: 160,
+      height: 23,
+    });
+
+    this.bogies = [
+      {
+        pos: new Vector(0, 0),
+        angle: 0,
+        length: 35 * this.scale,
+        sprite: {
+          at: new Vector(0, 23),
+          width: 33,
+          height: 19,
+          offset: new Vector(-19, -9),
+        },
+      },
+      {
+        pos: new Vector(0, 0),
+        angle: 0,
+        length: 64 * this.scale,
+        // sprite: {
+        //   at: new Vector(0, 23),
+        //   width: 33,
+        //   height: 19,
+        //   offset: new Vector(-19, -9.5),
+        // },
+        sprite: {
+          at: new Vector(34, 23),
+          width: 51,
+          height: 19,
+          offset: new Vector(-25.5, -9.5),
+        },
+      },
+      {
+        pos: new Vector(0, 0),
+        angle: 0,
+        length: 35 * this.scale,
+        sprite: {
+          at: new Vector(34, 23),
+          width: 60,
+          height: 19,
+          offset: new Vector(-25.5, -9.5),
+        },
+        rotate: true,
+      },
+      {
+        pos: new Vector(0, 0),
+        angle: 0,
+        length: 0,
+        sprite: {
+          at: new Vector(95, 23),
+          width: 16,
+          height: 19,
+          offset: new Vector(-8, -9.5),
+        },
+      },
+    ];
+  }
+
+  override draw(): void {
+    const doodler = getContextItem<Doodler>("doodler");
+    for (const b of this.bogies) {
+      if (!b.sprite) continue;
+      doodler.drawRotated(b.pos, b.angle + (b.rotate ? 0 : Math.PI), () => {
+        doodler.drawSprite(
+          this.img,
+          b.sprite!.at,
+          b.sprite!.width,
+          b.sprite!.height,
+          b.pos.copy().add(b.sprite!.offset ?? new Vector(0, 0)),
+          b.sprite!.width,
+          b.sprite!.height,
+        );
+      });
+    }
+
+    const b = this.bogies[2];
+    const a = this.bogies[1];
+    const origin = b.pos.copy().add(new Vector(18, 0).rotate(b.angle));
+    // const origin = Vector.add(Vector.sub(a.pos, b.pos).div(2), b.pos);
+    // const angle = Vector.sub(b.pos, a.pos).heading();
+
+    // const difAngle = Vector.sub(b.pos, c.pos).heading();
+    const angle = b.angle + Math.PI;
+    // const avgAngle = (difAngle + angle) / 2;
+
+    doodler.drawCircle(origin, 4, { color: "blue" });
+
+    doodler.drawRotated(origin, angle, () => {
+      this.sprite
+        ? doodler.drawSprite(
+          this.img,
+          this.sprite.at,
+          this.sprite.width,
+          this.sprite.height,
+          origin.copy().sub(
+            this.imgWidth * this.scale / 2,
+            this.imgHeight * this.scale / 2,
+          ),
+          this.imgWidth * this.scale,
+          this.imgHeight * this.scale,
+        )
+        : doodler.drawImage(
+          this.img,
+          origin.copy().sub(this.imgWidth / 2, this.imgHeight / 2),
+        );
+    });
+  }
+}

src/train/cars.ts

@@ -6,50 +6,85 @@ import { getContextItem } from "../lib/context.ts";
 export class Tender extends TrainCar {
   constructor() {
     const resources = getContextItem<ResourceManager>("resources");
-    super(25, resources.get<HTMLImageElement>("engine-sprites")!, 40, 20, {
-      at: new Vector(80, 0),
-      width: 40,
-      height: 20,
-    });
+    super(
+      25,
+      10,
+      resources.get<HTMLImageElement>("snr:sprite/engine")!,
+      40,
+      20,
+      {
+        at: new Vector(80, 0),
+        width: 40,
+        height: 20,
+      },
+    );
   }
 }
 export class Tank extends TrainCar {
   constructor() {
     const resources = getContextItem<ResourceManager>("resources");
-    super(50, resources.get<HTMLImageElement>("engine-sprites")!, 70, 20, {
-      at: new Vector(80, 20),
-      width: 70,
-      height: 20,
-    });
+    super(
+      50,
+      10,
+      resources.get<HTMLImageElement>("snr:sprite/engine")!,
+      70,
+      20,
+      {
+        at: new Vector(80, 20),
+        width: 70,
+        height: 20,
+      },
+    );
   }
 }
 export class YellowDumpCar extends TrainCar {
   constructor() {
     const resources = getContextItem<ResourceManager>("resources");
-    super(50, resources.get<HTMLImageElement>("engine-sprites")!, 70, 20, {
-      at: new Vector(80, 40),
-      width: 70,
-      height: 20,
-    });
+    super(
+      50,
+      10,
+      resources.get<HTMLImageElement>("snr:sprite/engine")!,
+      70,
+      20,
+      {
+        at: new Vector(80, 40),
+        width: 70,
+        height: 20,
+      },
+    );
   }
 }
 export class GrayDumpCar extends TrainCar {
   constructor() {
     const resources = getContextItem<ResourceManager>("resources");
-    super(50, resources.get<HTMLImageElement>("engine-sprites")!, 70, 20, {
-      at: new Vector(80, 60),
-      width: 70,
-      height: 20,
-    });
+    super(
+      50,
+      10,
+      resources.get<HTMLImageElement>("snr:sprite/engine")!,
+      70,
+      20,
+      {
+        at: new Vector(80, 60),
+        width: 70,
+        height: 20,
+      },
+    );
   }
 }
 export class NullCar extends TrainCar {
   constructor() {
     const resources = getContextItem<ResourceManager>("resources");
-    super(50, resources.get<HTMLImageElement>("engine-sprites")!, 70, 20, {
-      at: new Vector(80, 80),
-      width: 70,
-      height: 20,
-    });
+    super(
+      50,
+      10,
+      resources.get<HTMLImageElement>("snr:sprite/engine")!,
+      70,
+      20,
+      {
+        at: new Vector(80, 80),
+        width: 70,
+        height: 20,
+      },
+    );
   }
 }

src/train/engines.ts

@@ -6,50 +6,85 @@ import { ResourceManager } from "../lib/resources.ts";
 export class RedEngine extends TrainCar {
   constructor() {
     const resources = getContextItem<ResourceManager>("resources");
-    super(55, resources.get<HTMLImageElement>("engine-sprites")!, 80, 20, {
-      at: new Vector(0, 60),
-      width: 80,
-      height: 20,
-    });
+    super(
+      55,
+      10,
+      resources.get<HTMLImageElement>("snr:sprite/engine")!,
+      80,
+      20,
+      {
+        at: new Vector(0, 60),
+        width: 80,
+        height: 20,
+      },
+    );
   }
 }
 export class PurpleEngine extends TrainCar {
   constructor() {
     const resources = getContextItem<ResourceManager>("resources");
-    super(55, resources.get<HTMLImageElement>("engine-sprites")!, 80, 20, {
-      at: new Vector(0, 60),
-      width: 80,
-      height: 20,
-    });
+    super(
+      55,
+      10,
+      resources.get<HTMLImageElement>("snr:sprite/engine")!,
+      80,
+      20,
+      {
+        at: new Vector(0, 60),
+        width: 80,
+        height: 20,
+      },
+    );
   }
 }
 export class GreenEngine extends TrainCar {
   constructor() {
     const resources = getContextItem<ResourceManager>("resources");
-    super(55, resources.get<HTMLImageElement>("engine-sprites")!, 80, 20, {
-      at: new Vector(0, 40),
-      width: 80,
-      height: 20,
-    });
+    super(
+      55,
+      10,
+      resources.get<HTMLImageElement>("snr:sprite/engine")!,
+      80,
+      20,
+      {
+        at: new Vector(0, 40),
+        width: 80,
+        height: 20,
+      },
+    );
   }
 }
 export class GrayEngine extends TrainCar {
   constructor() {
     const resources = getContextItem<ResourceManager>("resources");
-    super(55, resources.get<HTMLImageElement>("engine-sprites")!, 80, 20, {
-      at: new Vector(0, 20),
-      width: 80,
-      height: 20,
-    });
+    super(
+      55,
+      10,
+      resources.get<HTMLImageElement>("snr:sprite/engine")!,
+      80,
+      20,
+      {
+        at: new Vector(0, 20),
+        width: 80,
+        height: 20,
+      },
+    );
   }
 }
 export class BlueEngine extends TrainCar {
   constructor() {
     const resources = getContextItem<ResourceManager>("resources");
-    super(55, resources.get<HTMLImageElement>("engine-sprites")!, 80, 20, {
-      at: new Vector(0, 0),
-      width: 80,
-      height: 20,
-    });
+    super(
+      55,
+      10,
+      resources.get<HTMLImageElement>("snr:sprite/engine")!,
+      80,
+      20,
+      {
+        at: new Vector(0, 0),
+        width: 80,
+        height: 20,
+      },
+    );
   }
 }

src/train/train.ts

@@ -3,6 +3,7 @@ import { Doodler, Vector } from "@bearmetal/doodler";
 import { Spline, TrackSegment, TrackSystem } from "../track/system.ts";
 import { Debuggable } from "../lib/debuggable.ts";
 import { map } from "../math/lerp.ts";
+import { off } from "node:process";
 
 export class Train extends Debuggable {
   nodes: Vector[] = [];
@@ -14,39 +15,39 @@ export class Train extends Debuggable {
 
   spacing = 20;
 
-  speed = 10;
+  speed = 0;
 
   get segments() {
-    return Array.from(new Set(this.cars.flatMap((c) => c.segments)));
+    return Array.from(
+      new Set(this.cars.flatMap((c) => c.segments.values().toArray())),
+    );
   }
 
-  constructor(track: Spline<TrackSegment>, cars: TrainCar[]) {
+  constructor(track: Spline<TrackSegment>, cars: TrainCar[], t = 0) {
     super("train", "path");
     this.path = track;
-    this.t = 0;
+    this.t = t;
     this.cars = cars;
 
     let currentOffset = 0;
     try {
       for (const car of this.cars) {
-        currentOffset += this.spacing;
-        const a = this.path.followEvenPoints(this.t - currentOffset);
-        currentOffset += car.length;
-        const b = this.path.followEvenPoints(this.t - currentOffset);
-        car.points = [a.p, b.p];
-        this.nodes.push(a.p, b.p);
-        car.segments = [a.segmentId, b.segmentId];
+        car.train = this;
+        currentOffset += car.moveAlongPath(this.t - currentOffset) +
+          this.spacing;
       }
+      console.log("forward");
     } catch {
       currentOffset = 0;
+      console.log("Reversed");
       for (const car of this.cars.toReversed()) {
-        currentOffset += this.spacing;
-        const a = this.path.followEvenPoints(this.t - currentOffset);
-        currentOffset += car.length;
-        const b = this.path.followEvenPoints(this.t - currentOffset);
-        car.points = [a.p, b.p];
-        this.nodes.push(a.p, b.p);
-        car.segments = [a.segmentId, b.segmentId];
+        for (const [i, bogie] of car.bogies.entries().toArray().reverse()) {
+          currentOffset += bogie.length;
+          const a = this.path.followEvenPoints(this.t - currentOffset);
+          car.setBogiePosition(a.p, i);
+          this.nodes.push(a.p);
+          car.segments.add(a.segmentId);
+        }
       }
     }
   }
@@ -58,16 +59,18 @@ export class Train extends Debuggable {
     let currentOffset = 0;
     for (const car of this.cars) {
       // This needs to be moved to the car itself
-      if (!car.points) return;
-      const [a, b] = car.points;
-      const nA = this.path.followEvenPoints(this.t - currentOffset);
-      a.set(nA.p);
-      currentOffset += car.length;
-      const nB = this.path.followEvenPoints(this.t - currentOffset);
-      b.set(nB.p);
-      currentOffset += this.spacing;
-      car.segments = [nA.segmentId, nB.segmentId];
+      // if (!car.points) return;
+      // const [a, b] = car.points;
+      // const nA = this.path.followEvenPoints(this.t - currentOffset);
+      // a.set(nA.p);
+      // currentOffset += car.length;
+      // const nB = this.path.followEvenPoints(this.t - currentOffset);
+      // b.set(nB.p);
+      // currentOffset += this.spacing;
+      // car.segments = [nA.segmentId, nB.segmentId];
       // car.draw();
+
+      currentOffset += car.moveAlongPath(this.t - currentOffset) + this.spacing;
     }
     // this.draw();
   }
@@ -118,7 +121,7 @@ export class Train extends Debuggable {
       colors.push(colors.shift()!);
       colors.push(colors.shift()!);
       colors.push(colors.shift()!);
-      for (const [i, segmentId] of this.segments.entries()) {
+      for (const [i, segmentId] of this.segments.entries().toArray()) {
         const segment = track.getSegment(segmentId);
         segment &&
           doodler.drawBezier(...segment.points, {
@@ -134,6 +137,14 @@ export class Train extends Debuggable {
   }
 }
 
+interface Bogie {
+  pos: Vector;
+  angle: number;
+  length: number;
+  sprite?: ISprite & { offset?: Vector };
+  rotate?: boolean;
+}
+
 export class TrainCar extends Debuggable {
   img: HTMLImageElement;
   imgWidth: number;
@@ -143,10 +154,15 @@ export class TrainCar extends Debuggable {
   points?: [Vector, Vector, ...Vector[]];
   length: number;
 
-  segments: string[] = [];
+  bogies: Bogie[] = [];
+
+  segments: Set<string> = new Set();
+
+  train?: Train;
 
   constructor(
     length: number,
+    trailing: number,
     img: HTMLImageElement,
     w: number,
     h: number,
@@ -158,14 +174,52 @@ export class TrainCar extends Debuggable {
     this.imgWidth = w;
     this.imgHeight = h;
     this.length = length;
+
+    this.bogies = [
+      {
+        pos: new Vector(0, 0),
+        angle: 0,
+        length: length,
+      },
+      {
+        pos: new Vector(0, 0),
+        angle: 0,
+        length: trailing,
+      },
+    ];
+  }
+
+  setBogiePosition(pos: Vector, idx: number) {
+    this.bogies[idx].pos.set(pos);
+  }
+
+  update(dTime: number, t: number) {
+    if (this.train) {
+      for (const [i, bogie] of this.bogies.entries()) {
+        const a = this.train.path.followEvenPoints(t - this.length * i);
+      }
+    }
+  }
+
+  moveAlongPath(t: number): number {
+    if (!this.train) return 0;
+    let offset = 0;
+    this.segments.clear();
+    for (const [i, bogie] of this.bogies.entries()) {
+      const a = this.train.path.followEvenPoints(t - offset);
+      offset += bogie.length;
+      this.setBogiePosition(a.p, i);
+      bogie.angle = a.tangent.heading();
+      this.segments.add(a.segmentId);
+    }
+    return offset;
   }
 
   draw() {
-    if (!this.points) return;
     const doodler = getContextItem<Doodler>("doodler");
-    const [a, b] = this.points;
-    const origin = Vector.add(Vector.sub(a, b).div(2), b);
-    const angle = Vector.sub(b, a).heading();
+    const [a, b] = this.bogies;
+    const origin = Vector.add(Vector.sub(a.pos, b.pos).div(2), b.pos);
+    const angle = Vector.sub(b.pos, a.pos).heading();
 
     doodler.drawCircle(origin, 4, { color: "blue" });
 
@@ -187,11 +241,19 @@ export class TrainCar extends Debuggable {
     });
   }
   override debugDraw(...args: unknown[]): void {
-    if (!this.points) return;
     const doodler = getContextItem<Doodler>("doodler");
-    doodler.drawLine(this.points, {
+    doodler.drawLine(this.bogies.map((b) => b.pos), {
       color: "blue",
-      weight: 3,
+      weight: 2,
+    });
+    doodler.deferDrawing(() => {
+      const colors = getContextItem<string[]>("colors");
+      for (const [i, b] of this.bogies.entries()) {
+        doodler.drawCircle(b.pos, 5, { color: colors[i % colors.length] });
+        doodler.fillText(b.length.toString(), b.pos.copy().add(10, 0), 100, {
+          color: "white",
+        });
+      }
     });
   }
 }

temp.json

@@ -0,0 +1 @@
+[{"p":[[633.178123792903,100.31612523465073,0],[699.1781237929027,100.31612523465073,0],[762.9292283279814,117.39818221141712,0],[820.0869049777544,150.39818221141715,0]],"id":"83b9fc8c-778e-4e5e-a3db-1199863a2e13","bNeighbors":["a149432a-e04e-481a-ada2-c05a30ffb4c0"],"fNeighbors":["dc3ec17d-f28e-40fe-ba68-8a4ae6b2c117"]},{"p":[[820.0869049777544,150.39818221141715,0],[877.2445816275272,183.398182211417,0],[923.9136291858395,230.06722976972924,0],[956.9136291858396,287.2249064195022,0]],"id":"dc3ec17d-f28e-40fe-ba68-8a4ae6b2c117","bNeighbors":["83b9fc8c-778e-4e5e-a3db-1199863a2e13"],"fNeighbors":["1b6409da-5c9d-4b1d-b460-fcc5e40eaee4"]},{"p":[[956.9136291858396,287.2249064195022,0],[989.9136291858396,344.3825830692749,0],[1006.9956861626059,408.13368760435344,0],[1006.9956861626064,474.1336876043541,0]],"id":"1b6409da-5c9d-4b1d-b460-fcc5e40eaee4","bNeighbors":["dc3ec17d-f28e-40fe-ba68-8a4ae6b2c117"],"fNeighbors":["24861245-ca99-4f97-9e0a-5828773fcf7a"]},{"p":[[1006.9956861626064,474.1336876043541,0],[1006.9956861626068,540.1336876043545,0],[989.9136291858408,603.884792139433,0],[956.9136291858412,661.042468789207,0]],"id":"24861245-ca99-4f97-9e0a-5828773fcf7a","bNeighbors":["1b6409da-5c9d-4b1d-b460-fcc5e40eaee4"],"fNeighbors":["98ad61a1-f2e7-4c53-9caa-022faa15ce68"]},{"p":[[956.9136291858412,661.042468789207,0],[923.9136291858417,718.2001454389806,0],[877.2445816275301,764.8691929972932,0],[820.0869049777573,797.8691929972947,0]],"id":"98ad61a1-f2e7-4c53-9caa-022faa15ce68","bNeighbors":["24861245-ca99-4f97-9e0a-5828773fcf7a"],"fNeighbors":["7f11837f-f043-468f-b1cb-254236501199"]},{"p":[[820.0869049777573,797.8691929972947,0],[762.9292283279847,830.8691929972961,0],[699.1781237929068,847.9512499740634,0],[633.1781237929063,847.9512499740653,0]],"id":"7f11837f-f043-468f-b1cb-254236501199","bNeighbors":["98ad61a1-f2e7-4c53-9caa-022faa15ce68"],"fNeighbors":["d89abe0b-7d84-4921-b690-23cdb6ec7c4a"]},{"p":[[633.1781237929063,847.9512499740653,0],[567.1781237929059,847.9512499740671,0],[503.4270192578273,830.8691929973024,0],[446.26934260805274,797.869192997304,0]],"id":"d89abe0b-7d84-4921-b690-23cdb6ec7c4a","bNeighbors":["7f11837f-f043-468f-b1cb-254236501199"],"fNeighbors":["3fb143a5-3d6e-409c-88b1-c20e9005a14f"]},{"p":[[446.26934260805274,797.869192997304,0],[389.1116659582787,764.869192997306,0],[342.44261839996534,718.2001454389954,0],[309.4426183999627,661.0424687892232,0]],"id":"3fb143a5-3d6e-409c-88b1-c20e9005a14f","bNeighbors":["d89abe0b-7d84-4921-b690-23cdb6ec7c4a"],"fNeighbors":["de299c76-bdbd-4b59-9514-722e3292ed49"]},{"p":[[309.4426183999627,661.0424687892232,0],[276.4426183999604,603.8847921394515,0],[259.36056142319165,540.1336876043738,0],[259.36056142318864,474.13368760437345,0]],"id":"de299c76-bdbd-4b59-9514-722e3292ed49","bNeighbors":["3fb143a5-3d6e-409c-88b1-c20e9005a14f"],"fNeighbors":["e573e278-4039-425f-89f5-245f96fe9096"]},{"p":[[259.36056142318864,474.13368760437345,0],[259.36056142318563,408.13368760437334,0],[276.4426183999492,344.38258306929436,0],[309.44261839994635,287.22490641951936,0]],"id":"e573e278-4039-425f-89f5-245f96fe9096","bNeighbors":["de299c76-bdbd-4b59-9514-722e3292ed49"],"fNeighbors":["87a06884-75e3-4802-ba38-3be366bac467"]},{"p":[[309.44261839994635,287.22490641951936,0],[342.4426183999434,230.06722976974456,0],[389.111665958253,183.39818221143025,0],[446.26934260802403,150.39818221142656,0]],"id":"87a06884-75e3-4802-ba38-3be366bac467","bNeighbors":["e573e278-4039-425f-89f5-245f96fe9096"],"fNeighbors":["a149432a-e04e-481a-ada2-c05a30ffb4c0"]},{"p":[[446.26934260802403,150.39818221142656,0],[503.42701925779517,117.3981822114228,0],[567.1781237928724,100.31612523465262,0],[633.1781237928726,100.31612523464773,0]],"id":"a149432a-e04e-481a-ada2-c05a30ffb4c0","bNeighbors":["87a06884-75e3-4802-ba38-3be366bac467"],"fNeighbors":["83b9fc8c-778e-4e5e-a3db-1199863a2e13"]}]