Merge branch 'master' of https://github.com/traccar/traccar-web

6 files changed, 46 insertions, 15 deletions

diff --git a/modern/src/map/AccuracyMap.js b/modern/src/map/AccuracyMap.js
index 4baa1054..5734ee82 100644
--- a/modern/src/map/AccuracyMap.js
+++ b/modern/src/map/AccuracyMap.js
@@ -36,8 +36,12 @@ const AccuracyMap = () => {
     });
 
     return () => {
-      map.removeLayer(id);
-      map.removeSource(id);
+      if (map.getLayer(id)) {
+        map.removeLayer(id);
+      }
+      if (map.getSource(id)) {
+        map.removeSource(id);
+      }
     };
   }, []);
 
diff --git a/modern/src/map/GeofenceMap.js b/modern/src/map/GeofenceMap.js
index d00cbb18..c0ecef40 100644
--- a/modern/src/map/GeofenceMap.js
+++ b/modern/src/map/GeofenceMap.js
@@ -56,10 +56,18 @@ const GeofenceMap = () => {
     });
 
     return () => {
-      map.removeLayer('geofences-fill');
-      map.removeLayer('geofences-line');
-      map.removeLayer('geofences-title');
-      map.removeSource(id);
+      if (map.getLayer('geofences-fill')) {
+        map.removeLayer('geofences-fill');
+      }
+      if (map.getLayer('geofences-line')) {
+        map.removeLayer('geofences-line');
+      }
+      if (map.getLayer('geofences-title')) {
+        map.removeLayer('geofences-title');
+      }
+      if (map.getSource(id)) {
+        map.removeSource(id);
+      }
     };
   }, []);
 
diff --git a/modern/src/map/Map.js b/modern/src/map/Map.js
index 16470ad6..bcd9b9f0 100644
--- a/modern/src/map/Map.js
+++ b/modern/src/map/Map.js
@@ -60,7 +60,7 @@ const initMap = async () => {
 
 map.on('load', initMap);
 
-const switchingControl = new SwitcherControl(
+const switcher = new SwitcherControl(
   [
     { title: t('mapOsm'), uri: styleOsm() },
     { title: t('mapCarto'), uri: styleCarto() },
@@ -88,12 +88,12 @@ const navigationControl = new maplibregl.NavigationControl({
 
 const addPrimaryControls = position => {
   map.addControl(navigationControl, position);
-  map.addControl(switchingControl, position);
+  map.addControl(switcher, position);
 }
 
 const removePrimaryControls =()=> {
   map.removeControl(navigationControl);
-  map.removeControl(switchingControl);
+  map.removeControl(switcher);
 }
 
 
diff --git a/modern/src/map/PositionsMap.js b/modern/src/map/PositionsMap.js
index 9719b45b..8d100534 100644
--- a/modern/src/map/PositionsMap.js
+++ b/modern/src/map/PositionsMap.js
@@ -148,9 +148,15 @@ const PositionsMap = ({ positions }) => {
       map.off('click', id, onMarkerClick);
       map.off('click', clusters, onClusterClick);
 
-      map.removeLayer(id);
-      map.removeLayer(clusters);
-      map.removeSource(id);
+      if (map.getLayer(id)) {
+        map.removeLayer(id);
+      }
+      if (map.getLayer(clusters)) {
+        map.removeLayer(clusters);
+      }
+      if (map.getSource(id)) {
+        map.removeSource(id);
+      }
     };
   }, [onMarkerClick]);
 
diff --git a/modern/src/map/ReplayPathMap.js b/modern/src/map/ReplayPathMap.js
index 62b3f279..022548b7 100644
--- a/modern/src/map/ReplayPathMap.js
+++ b/modern/src/map/ReplayPathMap.js
@@ -31,8 +31,12 @@ const ReplayPathMap = ({ positions }) => {
     });
 
     return () => {
-      map.removeLayer(id);
-      map.removeSource(id);
+      if (map.getLayer(id)) {
+        map.removeLayer(id);
+      }
+      if (map.getSource(id)) {
+        map.removeSource(id);
+      }
     };
   }, []);
 
diff --git a/modern/src/map/switcher/switcher.js b/modern/src/map/switcher/switcher.js
index e9076aa6..cb7326f4 100644
--- a/modern/src/map/switcher/switcher.js
+++ b/modern/src/map/switcher/switcher.js
@@ -5,12 +5,17 @@ export class SwitcherControl {
     this.beforeSwitch = beforeSwitch;
     this.afterSwitch = afterSwitch;
     this.onDocumentClick = this.onDocumentClick.bind(this);
+    this.variables = {};
   }
 
   getDefaultPosition() {
     return 'top-right';
   }
 
+  setVariable(key, value) {
+    this.variables[key] = value;
+  }
+
   onAdd(map) {
     this.map = map;
     this.controlContainer = document.createElement('div');
@@ -32,7 +37,11 @@ export class SwitcherControl {
           return;
         }
         this.beforeSwitch();
-        this.map.setStyle(JSON.parse(srcElement.dataset.uri));
+        let uri = JSON.parse(srcElement.dataset.uri);
+        if (typeof uri === 'string') {
+          Object.entries(this.variables).forEach(([key, value]) => uri = uri.replaceAll(`\{${key}}`, value));
+        }
+        this.map.setStyle(uri);
         this.afterSwitch();
         this.mapStyleContainer.style.display = 'none';
         this.styleButton.style.display = 'block';