Add setting to change the map zoom level when location is being tracked

www/assets/js/map_leaflet.js

@@ -32,7 +32,7 @@ function leafletMap() {
         showPopup: false,
         locateOptions: {
             enableHighAccuracy: true,
-            maxZoom: 16
+            maxZoom: localStorage.getItem("trackzoom") == null ? 16 : localStorage.getItem("trackzoom")
         },
         setView: "untilPanOrZoom",
         icon: "far fa-compass",

www/assets/js/map_mapbox.js

@@ -29,7 +29,9 @@ function mapboxMap() {
 
     map.maptype = "mapbox";
 
-    map.addControl(new mapboxgl.NavigationControl());
+    map.addControl(new mapboxgl.NavigationControl({
+        visualizePitch: true
+    }));
 
     map.addControl(
             new mapboxgl.GeolocateControl({
@@ -38,7 +40,7 @@ function mapboxMap() {
                     timeout: 10 * 1000
                 },
                 fitBoundsOptions: {
-                    maxZoom: 16
+                    maxZoom: localStorage.getItem("trackzoom") == null ? 16 : localStorage.getItem("trackzoom")
                 },
                 trackUserLocation: true
             })

www/assets/js/settings.js

@@ -21,6 +21,10 @@ $('.item-link[data-setting=units] select').on("change", function () {
     localStorage.setItem("units", $('.item-link[data-setting=units] select').val());
 });
 
+$('.item-link[data-setting=trackzoom] select').on("change", function () {
+    localStorage.setItem("trackzoom", $('.item-link[data-setting=trackzoom] select').val());
+});
+
 $('.item-content[data-setting=wakelock] .toggle input').on("change", function () {
     var checked = $(this).prop('checked');
     console.log(checked);

www/routes.js

@@ -373,6 +373,28 @@ var routes = [
                                 }
                             ]
                         },
+                        {
+                            setting: "trackzoom",
+                            title: "Zoom when tracking location",
+                            select: true,
+                            options: [
+                                {
+                                    value: 15,
+                                    label: "Low",
+                                    selected: localStorage.getItem("trackzoom") == 15
+                                },
+                                {
+                                    value: 16,
+                                    label: "Normal",
+                                    selected: localStorage.getItem("trackzoom") == null || localStorage.getItem("trackzoom") == 16
+                                },
+                                {
+                                    value: 17,
+                                    label: "High",
+                                    selected: localStorage.getItem("trackzoom") == 17
+                                }
+                            ]
+                        },
                         {
                             setting: "maptype",
                             title: "Alternative map",