hotline

strukturart · Sep 21, 2023 · 5372c9a · 5372c9a
1 parent 2d94e04
commit 5372c9a
Show file tree

Hide file tree

Showing 15 changed files with 1,233 additions and 23 deletions.
diff --git a/application/assets/js/GPXParser.js b/application/assets/js/GPXParser.js
diff --git a/application/assets/js/chroma.min.js b/application/assets/js/chroma.min.js
diff --git a/application/assets/js/maps.js b/application/assets/js/maps.js
@@ -221,6 +221,11 @@ const maps = (() => {
         document.activeElement.style.background = "black";
         document.activeElement.style.color = "white";
         general.last_map_url = "";
+        localStorage.setItem("last_map_type", "");
+        localStorage.setItem("last_map_attribution", "");
+        localStorage.setItem("last_map_max_zoom", "");
+        localStorage.setItem("last_map_url", "");
+
         helper.side_toaster("layer removed", 3000);
       }
       return false;

diff --git a/application/assets/js/module.js b/application/assets/js/module.js
@@ -87,6 +87,39 @@ const module = (() => {
     return result;
   };
 
+  var hotline_group = L.layerGroup().addTo(map);
+  var colors = ["blue", "green", "yellow", "red", "black"];
+
+  let hotline = (data) => {
+    // Clear the existing polylines from the group
+    hotline_group.clearLayers();
+
+    // Define the elevation range (adjust as needed)
+    const minElevation = 0;
+    const maxElevation = 4000;
+
+    // Loop through the coordinates using forEach
+    data.forEach(function (coord, index, array) {
+      if (index < array.length - 1) {
+        var segmentCoords = [
+          [coord.lat, coord.lng],
+          [array[index + 1].lat, array[index + 1].lng],
+        ];
+
+        var altitude = coord.alt;
+
+        // Calculate the percentage of elevation within the range
+        const elevationPercent =
+          (altitude - minElevation) / (maxElevation - minElevation);
+
+        // Interpolate color based on elevation percentage using Chroma.js
+        const color = chroma.scale(colors).mode("lab")(elevationPercent).hex();
+
+        L.polyline(segmentCoords, { color: color }).addTo(hotline_group);
+      }
+    });
+  };
+
   /////////////////////////
   /////Load GPX///////////
   ///////////////////////
@@ -138,7 +171,7 @@ const module = (() => {
         };
 
         reader.onloadend = function (event) {
-          var gpx = reader.result; // URL to your GPX file or the GPX itself
+          var gpx = reader.result;
 
           new L.GPX(gpx, {
             async: true,
@@ -260,10 +293,32 @@ const module = (() => {
         //to do if geojson is marker add to  marker_array[]
         //https://blog.codecentric.de/2018/06/leaflet-geojson-daten/
         L.geoJSON(geojson_data, {
-          onEachFeature: function (feature, layer) {
+          style: function (feature) {
+            // Default values if not defined in the GeoJSON file
+            var color = "black"; // Default line color
+            var weight = 0.5; // Default line width
+
+            // Check if the style properties are defined in the GeoJSON
+            if (feature.properties.stroke) {
+              color = feature.properties.stroke; // Use "stroke" property for line color
+            }
+
+            if (feature.properties["stroke-width"]) {
+              weight = feature.properties["stroke-width"];
+            }
+
+            return {
+              color: color, // Line color
+              weight: weight, // Line width
+            };
+          },
+
+          onEachFeature: function (feature) {
             if (feature.geometry != null) {
               let p = feature.geometry.coordinates[0];
-              map.flyTo([p[1], p[0]]);
+              try {
+                map.flyTo([p[1], p[0]]);
+              } catch (e) {}
             }
             //routing data
             if (feature.properties.segments != undefined) {
@@ -272,10 +327,10 @@ const module = (() => {
               }
             }
           },
+
           // Marker Icon
           pointToLayer: function (feature, latlng) {
             let t = L.marker(latlng);
-            //to do
             if (feature.properties.hasOwnProperty("popup")) {
               t.bindPopup(feature.properties.popup, module.popup_option);
             }
@@ -851,10 +906,9 @@ const module = (() => {
         if (mainmarker.device_alt) {
           if (isNaN(mainmarker.device_alt)) return false;
           alt = mainmarker.device_alt;
+          tracking_altitude.push(alt);
         }
 
-        tracking_altitude.push(alt);
-
         polyline_tracking.addLatLng([
           mainmarker.device_lat,
           mainmarker.device_lng,
@@ -868,6 +922,12 @@ const module = (() => {
           timestamp: ts.toISOString(),
         });
 
+        try {
+          hotline(tracking_cache);
+        } catch (e) {
+          alert(e);
+        }
+
         // Update the view with tracking data
 
         if (tracking_cache.length > 2) {
@@ -1100,6 +1160,7 @@ const module = (() => {
   };
 
   return {
+    hotline,
     convert_units,
     set_f_upd_markers,
     select_marker,

diff --git a/application/index.html b/application/index.html
@@ -826,10 +826,15 @@ <h2>Thank You!</h2>
 
     </div>
     <script src="assets/js/dayjs.js"></script>
+    <script src="assets/js/chroma.min.js"></script>
+    <script src="assets/js/GPXParser.js"></script>
+
+
 
     <script src="http://127.0.0.1/api/v1/shared/core.js"></script>
     <script src="http://127.0.0.1/api/v1/shared/session.js"></script>
     <script src="http://127.0.0.1/api/v1/apps/service.js"></script>
+
     <script defer src="assets/js/keepalive.js"></script>
     <script defer src="assets/js/osm.js"></script>
 
@@ -840,6 +845,8 @@ <h2>Thank You!</h2>
     <script defer src="assets/js/applait.finder.min.js"></script>
     <script defer src="assets/js/olc.js"></script>
     <script defer src="assets/js/leaflet.js"></script>
+
+
     <script defer src="assets/js/GeometryUtil.js"></script>
     <script defer src="assets/js/pouchdb_7.3.0_pouchdb.min.js"></script>
 
@@ -862,5 +869,7 @@ <h2>Thank You!</h2>
     <script defer src="assets/js/openweather.js"></script>
     <script defer src="assets/js/togpx.js"></script>
 
+
+
   </body>
 </html>
diff --git a/application/index.js b/application/index.js
@@ -89,7 +89,7 @@ let general = {
   last_map_attribution:
     localStorage.getItem("last_map_attribution") != null
       ? localStorage.getItem("last_map_attribution")
-      : "test",
+      : "",
   last_map_url:
     localStorage.getItem("last_map_url") != null
       ? localStorage.getItem("last_map_url")
@@ -996,9 +996,7 @@ document.addEventListener("DOMContentLoaded", function () {
   };
 
   let open_finder = function () {
-    helper.calculateDatabaseSizeInMB(tilesLayer._db).then(function (sizeInMB) {
-      document.querySelector("#clear-cache em").innerText = sizeInMB.toFixed(2);
-    });
+
     settings.load_settings();
     finder_tabindex();
     document.querySelector("div#finder").style.display = "block";
@@ -1020,6 +1018,9 @@ document.addEventListener("DOMContentLoaded", function () {
         openweather_callback
       );
     }
+    helper.calculateDatabaseSizeInMB(tilesLayer._db).then(function (sizeInMB) {
+      document.querySelector("#clear-cache em").innerText = sizeInMB.toFixed(2);
+    });
   };
 
   //////////////////////////
@@ -1537,7 +1538,7 @@ document.addEventListener("DOMContentLoaded", function () {
 
       //custom maps and layers from json file
       if (document.activeElement.classList.contains("active-layer")) {
-        maps.addMap("");
+        maps.addMap("", "", "", "");
 
         return false;
       }

diff --git a/application/manifest.webapp b/application/manifest.webapp
@@ -1,13 +1,13 @@
   {
-  "version": "1.9.72",
+  "version": "1.9.729",
   "version_name": "together we are strong",
   "name": "o.map",
   "description": "O.map, your ultimate navigation companion for KaiOS-powered devices. O.map is a lightweight and feature-rich map application designed specifically for KaiOS, enabling you to explore and navigate the world with ease. Whether you're a local resident, a tourist, or an adventurer, O.map is here to enhance your journey and keep you on the right track.",
   "launch_path": "/index.html",
   "type": "privileged",
   "fullscreen": "true",
   "priority": "high",
-  "userAgentInfo": "o.map / 1.9.718  written by [email protected]",
+  "userAgentInfo": "o.map / 1.9.7  written by [email protected]",
   "icons": {
     "56": "/assets/icons/icon-56-56.png",
     "112": "/assets/icons/icon-112-112.png"