refactor: define globals

src/scripts/indexedDB.ts

@@ -1,41 +1,40 @@
-// indexedDB support: ldb object
-
 // @ts-ignore unimplemented historical interfaces
 const indexedDBfactory = window.indexedDB || window.mozIndexedDB || window.webkitIndexedDB || window.msIndexedDB;
 if (!indexedDBfactory) console.error("indexedDB not supported");
 
-let database;
+let database: IDBDatabase | null = null;
 const databaseRequest = indexedDBfactory.open("d2", 1);
 
 databaseRequest.onsuccess = function () {
   database = this.result;
 };
 
-databaseRequest.onerror = function (e) {
+databaseRequest.onerror = e => {
   console.error("indexedDB request error", e);
 };
 
-databaseRequest.onupgradeneeded = function (event) {
+databaseRequest.onupgradeneeded = () => {
   database = null;
   const store = databaseRequest.result.createObjectStore("s", {keyPath: "k"});
-  store.transaction.oncomplete = function (e) {
-    database = e.target.db;
+  store.transaction.oncomplete = event => {
+    database = (event.target as IDBTransaction)?.db;
   };
 };
 
-function getValue(key, callback) {
+function getValue(key: string, callback: (value: unknown) => void) {
   if (!database) {
     setTimeout(() => getValue(key, callback), 100);
     return;
   }
 
-  database.transaction("s").objectStore("s").get(key).onsuccess = function (e) {
-    const value = (e.target.result && e.target.result.v) || null;
+  database.transaction("s").objectStore("s").get(key).onsuccess = event => {
+    const target = event.target as IDBRequest<IDBDatabase>;
+    const value = target.result || null;
     callback(value);
   };
 }
 
-function setValue(key) {
+function setValue(key: string, value: unknown) {
   if (!database) {
     setTimeout(() => setValue(key, value), 100);
     return;

src/scripts/listeners.ts

@@ -1,4 +1,3 @@
-import {PRODUCTION} from "../constants";
 // @ts-ignore
 import {checkIfServerless} from "./loading";
 import {assignLockBehavior} from "./options/lock";

src/scripts/statistics.ts

@@ -1,8 +1,8 @@
-// @ts-nocheck global variables
 import {INFO} from "config/logging";
 import {heightmapTemplates} from "config/heightmap-templates";
 import {locked} from "scripts/options/lock";
 import {getInputValue} from "utils/nodeUtils";
+import {byId} from "utils/shorthands";
 
 // show map stats on generation complete
 export function showStatistics() {
@@ -16,12 +16,12 @@ export function showStatistics() {
     Heightmap: ${heightmap} (${isRandomTemplate}${heightmapType})
     Points: ${grid.points.length}
     Cells: ${pack.cells.i.length}
-    Map size: ${mapSizeOutput.value}%
+    Map size: ${getInputValue("mapSizeOutput")}%
     States: ${pack.states.length - 1}
     Provinces: ${pack.provinces.length - 1}
     Burgs: ${pack.burgs.length - 1}
     Religions: ${pack.religions.length - 1}
-    Culture set: ${culturesSet.selectedOptions[0].innerText}
+    Culture set: ${(byId("culturesSet") as HTMLSelectElement)?.selectedOptions[0].innerText}
     Cultures: ${pack.cultures.length - 1}`;
 
   mapId = Date.now(); // unique map id is it's creation date number

src/scripts/updater.ts

@@ -0,0 +1,75 @@
+import {byId} from "utils/shorthands";
+
+console.info("Azgaar's Fantasy Map Generator", `v${APP_VERSION}`);
+
+export function checkForUpdates() {
+  const versionNumber = parseFloat(APP_VERSION);
+  const storedVersion = parseFloat(localStorage.getItem("version") || "0");
+
+  const isOutdated = storedVersion !== versionNumber;
+  if (isOutdated) clearCache();
+
+  const showUpdate = storedVersion < versionNumber;
+  if (showUpdate) setTimeout(() => showUpdateWindow(storedVersion), 6000);
+}
+
+const LATEST_CHANGES = [
+  "Data Charts screen",
+  "Сultures and religions can have multiple parents in hierarchy tree",
+  "Heightmap selection screen",
+  "Dialogs optimization for mobile",
+  "New heightmap template: Fractious",
+  "Template Editor: mask and invert tools",
+  "Ability to install the App",
+  "14 new default fonts",
+  "Caching for faster startup"
+];
+
+function showUpdateWindow(storedVersion: number) {
+  const changelog = "https://github.com/Azgaar/Fantasy-Map-Generator/wiki/Changelog";
+  const reddit = "https://www.reddit.com/r/FantasyMapGenerator";
+  const discord = "https://discordapp.com/invite/X7E84HU";
+  const patreon = "https://www.patreon.com/azgaar";
+
+  byId("alertMessage")!.innerHTML = /* html */ `
+    The Fantasy Map Generator is updated up to version <strong>${APP_VERSION}</strong>. This version is compatible with <a href="${changelog}" target="_blank">previous versions</a>, loaded <i>.map</i> files will be auto-updated.
+    ${storedVersion ? "<span>Reload the page to fetch fresh code.</span>" : ""}
+
+    <ul>
+      <strong>Latest changes:</strong>
+      ${LATEST_CHANGES.map(change => `<li>${change}</li>`).join("")}
+    </ul>
+
+    <p>Join our <a href="${discord}" target="_blank">Discord server</a> and <a href="${reddit}" target="_blank">Reddit community</a> to ask questions, share maps, discuss the Generator and Worlbuilding, report bugs and propose new features.</p>
+    <span><i>Thanks for all supporters on <a href="${patreon}" target="_blank">Patreon</a>!</i></span>
+  `;
+
+  const buttons: {Ok: noop; Reload?: noop} = {
+    Ok: function () {
+      $(this).dialog("close");
+      if (storedVersion) localStorage.clear();
+      localStorage.setItem("version", APP_VERSION);
+    }
+  };
+
+  if (storedVersion) {
+    buttons.Reload = () => {
+      localStorage.clear();
+      localStorage.setItem("version", APP_VERSION);
+      location.reload();
+    };
+  }
+
+  $("#alert").dialog({
+    resizable: false,
+    title: "Fantasy Map Generator update",
+    width: "28em",
+    position: {my: "center center-4em", at: "center", of: "svg"},
+    buttons
+  });
+}
+
+async function clearCache() {
+  const cacheNames = await caches.keys();
+  Promise.all(cacheNames.map(cacheName => caches.delete(cacheName)));
+}