From c0008a32788949d8d2c3489216a8929ffb4c2f2d Mon Sep 17 00:00:00 2001
From: liamcottle <liam@liamcottle.com>
Date: Wed, 17 Apr 2024 22:38:32 +1200
Subject: [PATCH] remember user preference for tile layers across page reloads

---
 src/public/index.html | 32 +++++++++++++++++++++++++-------
 1 file changed, 25 insertions(+), 7 deletions(-)

diff --git a/src/public/index.html b/src/public/index.html
index 1fd98f1..431e059 100644
--- a/src/public/index.html
+++ b/src/public/index.html
@@ -1439,6 +1439,14 @@
         return localStorage.setItem("config_enable_map_animations", value);
     }
 
+    function getConfigMapSelectedTileLayer() {
+        return localStorage.getItem("config_map_selected_tile_layer") || "OpenStreetMap";
+    }
+
+    function setConfigMapSelectedTileLayer(layer) {
+        return localStorage.setItem("config_map_selected_tile_layer", layer);
+    }
+
     function getConfigMapEnabledOverlayLayers() {
 
         try {
@@ -2030,7 +2038,7 @@
     var openStreetMapTileLayer = L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
         maxZoom: 22, // increase from 18 to 22
         attribution: 'Tiles &copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> | Data from <a target="_blank" href="https://meshtastic.org/docs/software/integrations/mqtt/">Meshtastic</a>',
-    }).addTo(map);
+    });
 
     var esriWorldImageryTileLayer = L.tileLayer('https://server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}', {
         maxZoom: 21, // esri doesn't have tiles closer than this
@@ -2049,6 +2057,18 @@
         attribution: 'Tiles &copy; Google | Data from <a target="_blank" href="https://meshtastic.org/docs/software/integrations/mqtt/">Meshtastic</a>'
     });
 
+    var tileLayers = {
+        "OpenStreetMap": openStreetMapTileLayer,
+        "Esri Satellite": esriWorldImageryTileLayer,
+        "Google Satellite": googleSatelliteTileLayer,
+        "Google Hybrid": googleHybridTileLayer,
+    };
+
+    // use tile layer based on config
+    const selectedTileLayerName = getConfigMapSelectedTileLayer();
+    const selectedTileLayer = tileLayers[selectedTileLayerName] || openStreetMapTileLayer;
+    selectedTileLayer.addTo(map);
+
     // create layer groups
     var nodesLayerGroup = new L.LayerGroup();
     var neighboursLayerGroup = new L.LayerGroup();
@@ -2089,12 +2109,10 @@
         return div;
     };
 
-    var tileLayers = {
-        "OpenStreetMap": openStreetMapTileLayer,
-        "Esri Satellite": esriWorldImageryTileLayer,
-        "Google Satellite": googleSatelliteTileLayer,
-        "Google Hybrid": googleHybridTileLayer,
-    };
+    // handle baselayerchange to update tile layer preference
+    map.on('baselayerchange', function(event) {
+        setConfigMapSelectedTileLayer(event.name);
+    });
 
     // handle adding/remove legend on map (can't use L.Control as an overlay, so we toggle an empty L.LayerGroup)
     map.on('overlayadd overlayremove', function(event) {