Added reset/load/save settings

calc.css

@@ -47,6 +47,7 @@ button.ui {
     background: linear-gradient(to bottom, var(--light), var(--medium));
     border: 2px outset var(--light);
     border-radius: 0.4em;
+    cursor: pointer;
 }
 button.ui:active {
     border-style: inset;
@@ -58,6 +59,11 @@ button.ui:focus {
 button#debug_button {
     float: right;
 }
+#settings_tab button {
+    margin-top: 1em;
+    margin-left: 0.5em
+    line-height: 2em;
+}
 img.icon {
     background-repeat: no-repeat;
     display: inline-block;

calc.html

@@ -158,6 +158,15 @@
         <label for="rational_format">Rationals</label></td>
         </tr>
         </table>
+        <button id="settings_reset" class="ui" onclick="resetSettings()">
+            Reset to default
+        </button>
+        <button id="settings_load" class="ui" onclick="loadSettingsLocalStorage()">
+            Load settings
+        </button>
+        <button id="settings_save" class="ui" onclick="saveSettingsLocalStorage()">
+            Save settings
+        </button>
     </div>
 
     <div id="about_tab" class="tab">

events.js

@@ -46,6 +46,48 @@ function RateHandler(target) {
 
 // settings events
 
+function resetSettings() {
+    var settings = loadSettings(window.location.hash)
+    for (var i = 0; i < LOCALSTORAGE_SAVED_SETTINGS.length; i++) {
+        delete settings[LOCALSTORAGE_SAVED_SETTINGS[i]]
+    }
+    if (currentMod() != DEFAULT_MODIFICATION) {
+        document.getElementById("data_set").value = DEFAULT_MODIFICATION
+        changeMod()
+    } else {
+        // changeMod >> loadData calls these, so don't duplicate calls
+        renderSettings(settings)
+        itemUpdate()
+    }
+}
+
+function loadSettingsLocalStorage() {
+    var settings = JSON.parse(localStorage.getItem("settings"))
+    if ("data" in settings && settings.data != currentMod()) {
+        document.getElementById("data_set").value = settings.data
+        changeMod()
+    } else if (currentMod() != DEFAULT_MODIFICATION) {
+        document.getElementById("data_set").value = DEFAULT_MODIFICATION
+        changeMod()
+    } else {
+        // changeMod >> loadData calls these, so don't duplicate calls
+        renderSettings(settings)
+        itemUpdate()
+    }
+}
+
+function saveSettingsLocalStorage() {
+    var settings = loadSettings(window.location.hash)
+    for (var name in settings) {
+        // delete setting if not in settingsToSave
+        if (LOCALSTORAGE_SAVED_SETTINGS.indexOf(name) == -1) {
+            delete settings[name]
+        }
+    }
+    localStorage.setItem("settings", JSON.stringify(settings))
+    document.getElementById("settings_load").style.display = ""
+}
+
 // Obtains current data set from UI element, and resets the world with the new
 // data.
 function changeMod() {
@@ -322,6 +364,12 @@ var tabMap = {
 
 // Triggered when a tab is clicked on.
 function clickTab(tabName) {
+    if (!tabName) {
+        tabName = DEFAULT_TAB
+    }
+    if (!tabName.endsWith("_tab")) {
+        tabName += "_tab"
+    }
     currentTab = tabName
     var tabs = document.getElementsByClassName("tab")
     for (var i=0; i < tabs.length; i++) {
@@ -357,4 +405,3 @@ function toggleVisible(targetID) {
         target.style.display = "none"
     }
 }
-

fragment.js

@@ -132,5 +132,21 @@ function loadSettings(fragment) {
         var unzip = pako.inflateRaw(window.atob(settings.zip), {to: "string"})
         return loadSettings("#" + unzip)
     }
+
+    var userHasCustomisedSettingsInHash = false
+    for (var name in settings) {
+        if (LOCALSTORAGE_SAVED_SETTINGS.indexOf(name) != -1) {
+            userHasCustomisedSettingsInHash = true
+        }
+    }
+    if (!userHasCustomisedSettingsInHash) {
+        if (localStorageEnabled && localStorage.getItem("settings")) {
+            var loadedSettings = JSON.parse(localStorage.getItem("settings"))
+            for (var name in loadedSettings) {
+                settings[name] = loadedSettings[name]
+            }
+        }
+    }
+
     return settings
 }

init.js

@@ -20,6 +20,19 @@ var itemGroups
 
 var initDone = false
 
+// check if localStorage is usable
+var localStorageEnabled
+function checkLocalStorageEnabled() {
+    var test = "test";
+    try {
+        localStorage.setItem(test, test);
+        localStorage.removeItem(test);
+        return true;
+    } catch (e) {
+        return false;
+    }
+}
+
 // Set the page back to a state immediately following initial setup, but before
 // the dataset is loaded for the first time.
 //
@@ -166,13 +179,24 @@ function loadData(modName, settings) {
 }
 
 function init() {
+    localStorageEnabled = checkLocalStorageEnabled()
+    // hide reset/load/save settings if localStorage is disabled
+    if (!localStorageEnabled) {
+        document.getElementById("settings_load").style.display = "none"
+        document.getElementById("settings_save").style.display = "none"
+    }
+    // if there is no setting saved then hide the "load" button
+    else if (!localStorage.getItem("settings")) {
+        document.getElementById("settings_load").style.display = "none"
+    }
+
     var settings = loadSettings(window.location.hash)
     renderDataSetOptions(settings)
-    if ("tab" in settings) {
-        currentTab = settings.tab + "_tab"
-    }
     loadData(currentMod(), settings)
     // We don't need to call clickVisualize here, as we will properly render
     // the graph when we call itemUpdate() at the end of initialization.
+    if ("tab" in settings) {
+        currentTab = settings.tab + "_tab"
+    }
     clickTab(currentTab)
 }

settings.js

@@ -356,3 +356,8 @@ function renderSettings(settings) {
     renderDefaultBeacon(settings)
     renderValueFormat(settings)
 }
+
+var LOCALSTORAGE_SAVED_SETTINGS = [
+    "data", "rate", "rp", "cp", "min",
+    "furnace", "belt", "pipe", "mprod", "vf"
+]