feat: add more demo land and objects

scripts/extrude.js

@@ -13,6 +13,13 @@ const extrusionAssets = new Map([
       "tileWidth": 32
     }
   ],
+  [
+    `${assetsPath}/environment2.png`,
+    {
+      "tileHeight": 32,
+      "tileWidth": 32
+    }
+  ],
   [
     `${assetsPath}/objects1.png`,
     {

src/ui/index.ts

@@ -3,9 +3,9 @@ import {
   Scene
 } from "phaser";
 
-import environmentImage from "./assets/environment-extruded.png";
-import landscapeJson    from "./assets/proto1-landscape.json";
-import objects1Image    from "./assets/objects1.png";
+import environmentImage   from "./assets/environment-extruded.png";
+import environment2Image  from "./assets/environment2-extruded.png";
+import objects1Image      from "./assets/objects1.png";
 
 import "./index.scss";
 
@@ -20,20 +20,24 @@ class BootScene extends Scene
   {
     // Landscape
 
-    this.load.tilemapTiledJSON(
-      "environmentTilemap",
-      landscapeJson
-    );
-
     this.load.image(
       "environmentTileset",
       environmentImage
     );
 
+    this.load.spritesheet(
+      "environment2Tileset",
+      environment2Image,
+      {
+        "frameHeight" : 32,
+        "frameWidth"  : 32
+      }
+    );
+
     // Objects
 
     this.load.spritesheet(
-      "objects1",
+      "objects1Tileset",
       objects1Image,
       {
         "frameHeight" : 32,
@@ -59,21 +63,40 @@ class HelloWorldScene extends Scene
   {
     // Landscape
 
+    const mapHeight = 32;
+    const mapWidth  = 128;
+
+    const landscape : number[][] = [];
+
+    // Lay random tiles
+
+    for (let i = 0; i < mapHeight; i += 1)
+    {
+      landscape[i] = [];
+
+      for (let j = 0; j < mapWidth; j += 1)
+      {
+        landscape[i][j] = Math.floor(Math.random() * 3) * 4;
+      }
+    }
+
     const tileMap = this.make.tilemap({
-      "key" : "environmentTilemap",
+      "data"        : landscape,
+      "tileHeight"  : 32,
+      "tileWidth"   : 32
     });
 
     const tiles = tileMap.addTilesetImage(
       "environment",
-      "environmentTileset",
+      "environment2Tileset",
       32,
       32,
       1,
       2
     );
 
     tileMap.createStaticLayer(
-      "Base 1",
+      0,
       tiles
     );
 
@@ -82,10 +105,10 @@ class HelloWorldScene extends Scene
     // Conveyer belt
     this.anims.create({
       "key"       : "conveyerBelt",
-      "frameRate" : 6,
+      "frameRate" : 12,
       "repeat"    : -1,
       "frames"  : this.anims.generateFrameNumbers(
-        "objects1",
+        "objects1Tileset",
         {
           "frames"  : [0, 8, 16, 24]
         }
@@ -94,6 +117,14 @@ class HelloWorldScene extends Scene
 
     // Scene
 
+    // Coal
+    this.add.sprite(
+      128,
+      64,
+      "environment2Tileset",
+      1
+    );
+
     // Conveyer belts
     this.placeConveyerBelt(128, 96);
     this.placeConveyerBelt(160, 96);
@@ -109,7 +140,7 @@ class HelloWorldScene extends Scene
     const conveyerBelt = this.add.sprite(
       x,
       y,
-      "objects1",
+      "objects1Tileset",
       0
     );