src/components/GameCanvas.tsx

@@ -11,7 +11,7 @@ export interface GameCanvasProps {
 export const GameCanvas = ({ width, height }: GameCanvasProps) => {
   const canvasRef = useRef<HTMLCanvasElement>(null);
   const [game, setGame] = useState<TheAbstractionEngine>();
-  const [ready, setReady] = useState(false);
+  const [ready, setReady] = useState(true); // false);
   const [loading, setLoading] = useState(true);
 
   useEffect(() => {

src/engine/TheAbstractionEngine.ts

@@ -33,7 +33,7 @@ export class TheAbstractionEngine {
     const facingDirectionSystem = new FacingDirection(inputSystem);
 
     [
-      new Level(LevelNames.LevelSelection),
+      new Level(LevelNames.Tutorial),
       inputSystem,
       facingDirectionSystem,
       new Grid(

src/engine/config/sounds.ts

@@ -22,31 +22,29 @@ export const LambdaTransformSound: SoundSpec = {
 export const LambdaSave: SoundSpec = {
   name: "lambdaSave",
   url: "/assets/sound/lambda_save.wav",
-  volume: 0.3,
 };
 
 export const Failure: SoundSpec = {
   name: "failure",
   url: "/assets/sound/failure.wav",
-  volume: 0.3,
+  volume: 0.5,
 };
 
 export const ModalOpen: SoundSpec = {
   name: "modalOpen",
   url: "/assets/sound/modal_open.wav",
-  volume: 0.3,
+  volume: 0.5,
 };
 
 export const ModalClose: SoundSpec = {
   name: "modalClose",
   url: "/assets/sound/modal_close.wav",
-  volume: 0.3,
+  volume: 0.5,
 };
 
 export const KeyOpen: SoundSpec = {
   name: "keyOpen",
   url: "/assets/sound/keyopen.wav",
-  volume: 0.5,
 };
 
 export const Music: SoundSpec = {

src/engine/entities/Grass.ts

@@ -1,5 +1,5 @@
 import { Entity, EntityNames } from ".";
-import { BoundingBox, Grid, Sprite } from "../components";
+import { Grid, Sprite } from "../components";
 import { IMAGES, SPRITE_SPECS, SpriteSpec, Sprites } from "../config";
 import { Coord2D } from "../interfaces";
 
@@ -11,28 +11,17 @@ export class Grass extends Entity {
 
     this.addComponent(new Grid(gridPosition));
 
-    const dimensions = {
-      width: Grass.spriteSpec.width,
-      height: Grass.spriteSpec.height,
-    };
     this.addComponent(
       new Sprite(
         IMAGES.get(Grass.spriteSpec.sheet)!,
         { x: 0, y: 0 },
-        dimensions,
+        {
+          width: Grass.spriteSpec.width,
+          height: Grass.spriteSpec.height,
+        },
         Grass.spriteSpec.msPerFrame,
         Grass.spriteSpec.frames,
       ),
     );
-
-    this.addComponent(
-      new BoundingBox(
-        {
-          x: 0,
-          y: 0,
-        },
-        dimensions,
-      ),
-    );
   }
 }

src/engine/levels/Tutorial.ts

@@ -3,49 +3,21 @@ import { Game } from "..";
 import {
   Curry,
   FunctionApplication,
-  Grass,
   LambdaFactory,
   LockedDoor,
   Player,
   Sign,
   Wall,
 } from "../entities";
-import { Grid, SystemNames } from "../systems";
-import { normalRandom } from "../utils";
 
 export class Tutorial extends Level {
   constructor() {
     super(LevelNames.Tutorial);
   }
 
-  public init(game: Game) {
-    const grid = game.getSystem<Grid>(SystemNames.Grid);
-    const dimensions = grid.getGridDimensions();
-
-    const grasses = Array.from({ length: dimensions.width })
-      .fill(0)
-      .map(() => {
-        // random grass
-        return new Grass({
-          x: Math.floor(
-            normalRandom(dimensions.width / 2, dimensions.width / 4, 1.5),
-          ),
-          y: Math.floor(
-            normalRandom(dimensions.height / 2, dimensions.height / 4, 1.5),
-          ),
-        });
-      });
-
+  public init(game: Game): void {
     const entities = [
-      ...grasses,
-      new Sign(
-        "<div>this is a Lambda Factory<br><br>modify the produced term by interacting from the top or bottom ↕️<br><br>then produce the term by pressing the button on the left or right ↔️<br><br></div>",
-        { x: 4, y: 3 },
-      ),
-      new Sign(
-        "this is a Term Application; interact to view its code<br><br>push the term ➡️ created by the factory any direction into the Application to produce a new one 💭<br><br>note that:<br><br>+ _INPUT is the term replaced by the pushed term<br><br>+ in this case _KEY is applied to the function to make a new KEY! 🔑",
-        { x: 4, y: 6 },
-      ),
+      new Sign("TODO: Explain entities", { x: 4, y: 3 }),
       new Wall({ x: 10, y: 9 }),
       new Wall({ x: 10, y: 11 }),
       new Wall({ x: 11, y: 10 }),

src/engine/systems/Grid.ts

@@ -28,13 +28,6 @@ export class Grid extends System {
       .map(() => new Array(columns).fill(null).map(() => new Set()));
   }
 
-  public getGridDimensions() {
-    return {
-      width: this.grid[0].length,
-      height: this.grid.length,
-    };
-  }
-
   public update(dt: number, game: Game) {
     this.putUninitializedEntitiesInGrid(game);
     this.rebuildGrid(game);