one step forward, one step back

state/states/LoadState.ts

@@ -31,7 +31,12 @@ export class LoadState extends State<States> {
 
     bootstrapInputs();
 
-    this.stateMachine.transitionTo(States.RUNNING);
+    resources.set("engine-sprites", new Image());
+    resources.get<HTMLImageElement>("engine-sprites")!.src =
+      "/sprites/EngineSprites.png";
+    resources.ready().then(() => {
+      this.stateMachine.transitionTo(States.RUNNING);
+    });
   }
   override stop(): void {
     // noop

state/states/RunningState.ts

@@ -1,5 +1,8 @@
-import { getContext } from "../../lib/context.ts";
+import { getContext, getContextItem } from "../../lib/context.ts";
+import { InputManager } from "../../lib/input.ts";
 import { TrackSystem } from "../../track/system.ts";
+import { Tender } from "../../train/cars.ts";
+import { RedEngine } from "../../train/engines.ts";
 import { Train } from "../../train/train.ts";
 import { State } from "../machine.ts";
 import { States } from "./index.ts";
@@ -19,12 +22,20 @@ export class RunningState extends State<States> {
     // Draw (maybe via a layer system that syncs with doodler)
     ctx.track.draw();
     for (const train of ctx.trains) {
+      train.move(dt);
       train.draw();
     }
     // Monitor world events
   }
   override start(): void {
     // noop
+    const inputManager = getContextItem<InputManager>("inputManager");
+    const track = getContextItem<TrackSystem>("track");
+    const ctx = getContext() as { trains: Train[] };
+    inputManager.onKey(" ", () => {
+      const train = new Train(track.path, [new RedEngine(), new Tender()]);
+      ctx.trains.push(train);
+    });
   }
   override stop(): void {
     // noop