add random tile selection from map to the web tools

1 files changed, 41 insertions, 21 deletions

diff --git a/html/tools.html b/html/tools.html
index 5d638ef5..caca608e 100644
--- a/html/tools.html
+++ b/html/tools.html
@@ -68,6 +68,15 @@ body {
 }
   </style>
 
+  <script src="wasm_exec.js"></script>
+
+  <script>
+    const go = new Go();
+    WebAssembly.instantiateStreaming(fetch("webtools.wasm"), go.importObject).then((result) => {
+      go.run(result.instance);
+    });
+  </script>
+
   <script language="javascript" type="text/javascript">
     /*
     @licstart  The following is the entire license notice for the
@@ -93,19 +102,6 @@ body {
     for the JavaScript code in this page.
     */
 
-    // List of houses on the tyrant map
-    let tyrantHouses = Array(
-        {x:1, y:1}, {x:4, y:1}, {x:5, y:1}, {x:8, y:1}, {x:15, y:1},
-        {x:3, y:2}, {x:6, y:2}, {x:12, y:2}, {x:13, y:2}, {x:14, y:2},
-        {x:2, y:3}, {x:14, y:3},
-        {x:2, y:4}, {x:5, y:4}, {x:10, y:4},
-        {x:3, y:5}, {x:6, y:4}, {x:9, y:4},
-        {x:7, y:6}, {x:10, y:6},
-        {x:13, y:10},
-        {x:4, y:11},
-        {x:3, y:15}, {x:9, y:15}, {x:14, y:15},
-    );
-
     // return a random number between 1 and max
     function randomInt(max) {
       return Math.floor(Math.random() * Number(max)) + 1;
@@ -200,11 +196,26 @@ body {
         return false;
       }
 
-      document.getElementById("random_house_tyrant_form").onsubmit = function() {
-        let idx = Math.floor(Math.random() * tyrantHouses.length);
-        let house = tyrantHouses[idx];
-        result.innerHTML = "Random house: " + (idx + 1) + " at (x:" + house.x + ", y:"
-                           + house.y + ")";
+      document.getElementById("random_map_tile_form").onsubmit = function() {
+        const mapName = document.getElementById("random_map_tile_map_select").value;
+        const mapUrl = "maps/" + mapName + ".yml"
+        const symbols =  document.getElementById("random_map_tile_symbols").value.split(" ");
+        const request = new XMLHttpRequest();
+        request.onreadystatechange = function() {
+          if (request.readyState == 4 && request.status == 200) {
+             const pos = randomTileFromSymbol(request.responseText, symbols);
+             if (!pos) {
+               result.innerHTML = "The Go websassembly returned no value";
+             } else if (typeof pos === "string" || pos instanceof String) {
+               result.innerHTML = "An error occured: " + pos;
+             } else {
+               result.innerHTML = "Random tile: (x:" + pos.x + ", y:" + pos.y + ")";
+             }
+          }
+        }
+        request.open("GET", mapUrl, true);
+        request.send(null);
+
         return false;
       }
     });
@@ -250,9 +261,18 @@ Random tile within Range
 <h2>The tyrant tools</h2>
 
 <div>
-<form id="random_house_tyrant_form">
-Random house tile
-  <input id="random_house_tyrant_button" value="generate" type="submit">
+<form id="random_map_tile_form">
+Random tile from
+  <select name="map" id="random_map_tile_map_select">
+    <option value="the-tyrant">the-tyrant</option>
+    <option value="2P-ring-street">2P-ring-street</option>
+    <option value="2P-river-king">2P-river-king</option>
+    <option value="3P-ring-street">3P-ring-street</option>
+    <option value="4P-islands">4P-islands</option>
+    <option value="the-kraken">the-kraken</option>
+  </select>
+  <input id="random_map_tile_symbols" value="symbols">
+  <input id="random_map_tile_button" value="generate" type="submit">
 </form>
 </div>