Merge branch 'Azgaar:master' into master

index.css

@@ -50,6 +50,7 @@ iframe {
   mask-mode: alpha;
   mask-clip: no-clip;
   fill-rule: evenodd;
+  user-select: none;
 }
 
 #canvas {

main.js

@@ -172,29 +172,32 @@ landmass.append("rect").attr("x", 0).attr("y", 0).attr("width", graphWidth).attr
 oceanPattern.append("rect").attr("fill", "url(#oceanic)").attr("x", 0).attr("y", 0).attr("width", graphWidth).attr("height", graphHeight);
 oceanLayers.append("rect").attr("id", "oceanBase").attr("x", 0).attr("y", 0).attr("width", graphWidth).attr("height", graphHeight);
 
-if (!location.hostname) {
-  const wiki = "https://github.com/Azgaar/Fantasy-Map-Generator/wiki/Run-FMG-locally";
-  alertMessage.innerHTML = `Fantasy Map Generator cannot run serverless.
-  Follow the <a href="${wiki}" target="_blank">instructions</a> on how you can easily run a local web-server`;
+document.addEventListener("DOMContentLoaded", async () => {
+  if (!location.hostname) {
+    const wiki = "https://github.com/Azgaar/Fantasy-Map-Generator/wiki/Run-FMG-locally";
+    alertMessage.innerHTML = `Fantasy Map Generator cannot run serverless.
+    Follow the <a href="${wiki}" target="_blank">instructions</a> on how you can easily run a local web-server`;
 
-  $("#alert").dialog({
-    resizable: false,
-    title: "Loading error",
-    width: "28em",
-    position: {my: "center center-4em", at: "center", of: "svg"},
-    buttons: {
-      OK: function () {
-        $(this).dialog("close");
+    $("#alert").dialog({
+      resizable: false,
+      title: "Loading error",
+      width: "28em",
+      position: {my: "center center-4em", at: "center", of: "svg"},
+      buttons: {
+        OK: function () {
+          $(this).dialog("close");
+        }
       }
-    }
-  });
+    });
 
-  d3.select("#loading-text").transition().duration(1000).style("opacity", 0);
-  d3.select("#init-rose").transition().duration(4000).style("opacity", 0);
-} else {
-  hideLoading();
-  checkLoadParameters();
-}
+    d3.select("#loading-text").transition().duration(1000).style("opacity", 0);
+    d3.select("#init-rose").transition().duration(4000).style("opacity", 0);
+  } else {
+    hideLoading();
+    await checkLoadParameters();
+  }
+  restoreDefaultEvents(); // apply default viewbox events
+});
 
 function hideLoading() {
   const queryString = window.location.search;
@@ -218,7 +221,7 @@ function showLoading() {
 }
 
 // decide which map should be loaded or generated on page load
-function checkLoadParameters() {
+async function checkLoadParameters() {
   const url = new URL(window.location.href);
   const params = url.searchParams;
 
@@ -239,32 +242,39 @@ function checkLoadParameters() {
   // if there is a seed (user of MFCG provided), generate map for it
   if (params.get("seed")) {
     WARN && console.warn("Generate map for seed");
-    generateMapOnLoad();
+    await generateMapOnLoad();
     return;
   }
 
   // open latest map if option is active and map is stored
-  if (onloadMap.value === "saved") {
+  const loadLastMap = () => new Promise((resolve, reject) => {
     ldb.get("lastMap", blob => {
       if (blob) {
         WARN && console.warn("Load last saved map");
         try {
           uploadMap(blob);
+          resolve();
         } catch (error) {
-          ERROR && console.error(error);
-          WARN && console.warn("Cannot load stored map, random map to be generated");
-          generateMapOnLoad();
+          reject(error);
         }
       } else {
-        ERROR && console.error("No map stored, random map to be generated");
-        generateMapOnLoad();
+        reject("No map stored");
       }
-    });
-    return;
-  }
+    })
+  })
 
-  WARN && console.warn("Generate random map");
-  generateMapOnLoad();
+  if (onloadMap.value === "saved") {
+    try {
+      await loadLastMap();
+    } catch(error) {
+      ERROR && console.error(error);
+      WARN && console.warn("Cannot load stored map, random map to be generated");
+      await generateMapOnLoad();
+    }
+  } else {
+    WARN && console.warn("Generate random map");
+    await generateMapOnLoad();
+  }
 }
 
 async function generateMapOnLoad() {

modules/ui/editors.js

@@ -2,7 +2,6 @@
 "use strict";
 
 modules.editors = true;
-restoreDefaultEvents(); // apply default viewbox events on load
 
 // restore default viewbox events
 function restoreDefaultEvents() {
@@ -478,14 +477,14 @@ function createPicker() {
     .attr("height", 20)
     .on("mousemove", () => tip("Color value in different color spaces. Edit to change"));
   const html = `
-  <label style="margin-right: 6px">HSL: 
+  <label style="margin-right: 6px">HSL:
     <input type="number" id="pickerHSL_H" data-space="hsl" min=0 max=360 value="231">,
-    <input type="number" id="pickerHSL_S" data-space="hsl" min=0 max=100 value="70">, 
+    <input type="number" id="pickerHSL_S" data-space="hsl" min=0 max=100 value="70">,
     <input type="number" id="pickerHSL_L" data-space="hsl" min=0 max=100 value="70">
   </label>
-  <label style="margin-right: 6px">RGB: 
+  <label style="margin-right: 6px">RGB:
     <input type="number" id="pickerRGB_R" data-space="rgb" min=0 max=255 value="125">,
-    <input type="number" id="pickerRGB_G" data-space="rgb" min=0 max=255 value="142">, 
+    <input type="number" id="pickerRGB_G" data-space="rgb" min=0 max=255 value="142">,
     <input type="number" id="pickerRGB_B" data-space="rgb" min=0 max=255 value="232">
   </label>
   <label>HEX: <input type="text" id="pickerHEX" data-space="hex" style="width:42px" autocorrect="off" spellcheck="false" value="#7d8ee8"></label>`;

modules/ui/layers.js

@@ -1502,6 +1502,12 @@ function drawRivers() {
 
   const riverPaths = pack.rivers.map(({cells, points, i, widthFactor, sourceWidth}) => {
     if (!cells || cells.length < 2) return;
+
+    if (points && points.length !== cells.length) {
+      console.error(`River ${i} has ${cells.length} cells, but only ${points.length} points defined. Resetting points data`);
+      points = undefined;
+    }
+
     const meanderedPoints = addMeandering(cells, points);
     const path = getRiverPath(meanderedPoints, widthFactor, sourceWidth);
     return `<path id="river${i}" d="${path}"/>`;

modules/ui/options.js

@@ -105,7 +105,7 @@ function showSupporters() {
     Jonathan Williams,ojacid .,Brian Wilson,A Patreon of the Ahts,Shubham Jakhotiya,www15o,Jan Bundesmann,Angelique Badger,Joshua Xiong,Moist mongol,
     Frank Fewkes,jason baldrick,Game Master Pro,Andrew Kircher,Preston Mitchell,Chris Kohut,Emarandzeb,Trentin Bergeron,Damon Gallaty,Pleaseworkforonce,
     Jordan,William Markus,Sidr Dim,Alexander Whittaker,The Next Level,Patrick Valverde,Markus Peham,Daniel Cooper,the Beagles of Neorbus,Marley Moule,
-    Maximilian Schielke,Johnathan Xavier Hutchinson,Ele,Rita`;
+    Maximilian Schielke,Johnathan Xavier Hutchinson,Ele,Rita,Randy Ross,John Wick,RedSpaz,cameron cannon,Ian Grau-Fay,Kyle Barrett,Charlotte Wiland`;
 
   const array = supporters
     .replace(/(?:\r\n|\r|\n)/g, "")