Menu bar for brush selection implemented.

tilorswift/js/module.js

@@ -2,22 +2,49 @@ import Terrain from "./Terrain.js";
 import FileLoader from "../../js/FileLoader.js";
 import TilorswiftEvent from "./events/TilorswiftEvent.js";
 import Mouse from "./Mouse.js";
+import Tileset from "./Tileset.js";
+import ButtonTile from "./ButtonTile.js";
+
+let loader = new FileLoader('../levels/level.json');
 
 let image = new Image();
 image.src = '../graphics/tileset-landscape01.jpg';
 image.onload = function () {
-    let loader = new FileLoader('../levels/level.json');
     let terrain = Terrain.createFromJson(loader.getContent());
 
     let map = document.getElementById('map');
     map.appendChild(terrain.getElement());
 
+    let menuTileset = document.getElementById('tileset');
+
+    let tileset = new Tileset(image, 8, 3);
+
+    for (let t = 0; t < tileset.tiles; t++) {
+        let button = new ButtonTile(tileset, t);
+        menuTileset.appendChild(button.getElement());
+    }
+
     let mouse = new Mouse();
 
     window.addEventListener(
         TilorswiftEvent.FIELD_CLICKED,
         (event) => {
-            event.getField().setIndex(terrain.brushTileIndex);
+            console.log(event);
+            switch (event.button) {
+                case 0:
+                    event.getField().setIndex(terrain.brushTileIndex);
+                    break;
+                case 2:
+                    event.getField().setIndex(-1);
+                    break;
+            }
+        }
+    );
+
+    window.addEventListener(
+        'contextmenu',
+        (event) => {
+            event.preventDefault();
         }
     );
 
@@ -26,6 +53,8 @@ image.onload = function () {
         (event) => {
             if (mouse.isPressedLeft) {
                 event.getField().setIndex(terrain.brushTileIndex);
+            } else if (mouse.isPressedRight) {
+                event.getField().setIndex(-1);
             }
         }
     );