Merge pull request #4049 from bobrippling/recorder/reload-map

recorder: load full map and add author info

Author: bobrippling

apps/recorder/interface.html

@@ -411,10 +411,19 @@
   // check track validity after filtering
   if (!track?.[0]?.Time) return showToast("Error in trackfile (no time or empty).", "error");
   let lastTime = 0;
+  //const trackType = ... -> `<type>${trackType}</type>`
   const gpx = `<?xml version="1.0" encoding="UTF-8"?>
 <gpx creator="Bangle.js" version="1.1" xmlns="http://www.topografix.com/GPX/1/1" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://www.topografix.com/GPX/1/1 http://www.topografix.com/GPX/1/1/gpx.xsd http://www.garmin.com/xmlschemas/GpxExtensions/v3 http://www.garmin.com/xmlschemas/GpxExtensionsv3.xsd http://www.garmin.com/xmlschemas/TrackPointExtension/v1 http://www.garmin.com/xmlschemas/TrackPointExtensionv1.xsd" xmlns:gpxtpx="http://www.garmin.com/xmlschemas/TrackPointExtension/v1" xmlns:gpxx="http://www.garmin.com/xmlschemas/GpxExtensions/v3">
   <metadata><time>${track[0].Time.toISOString()}</time></metadata>
-  <trk><name>${title}</name><trkseg>${track.map(pt => {
+  <metadata>
+    <author>
+      <name>Bangle.js</name>
+      <link href="https://banglejs.com/apps/?id=recorder" />
+    </author>
+  </metadata>
+  <trk>
+    <name>${title}</name>
+    <trkseg>${track.map(pt => {
     // Calculate cadence (steps per minute) from step count
     // Formula: (steps in interval * 60 seconds * 1000ms) / time elapsed in ms
     // Simplified to: steps * 30000 / time_ms (since 60 * 1000 / 2 = 30000)
@@ -455,7 +464,7 @@
   return o;
 }
 
-async function downloadTrack(filename) {
+async function downloadTrack(filename) { // filename: string
   function parse(data) {
     const lines = data.trim().split("\n"), headers = lines.shift().split(",");
     return lines.map(l=>trackLineToObject(headers, l)).filter(t => t.Time);
@@ -478,7 +487,7 @@
   return document.getElementById(`track-download-${trackNumber}`).checked;
 }
 
-async function downloadTracks(tracks, saveCb) {
+async function downloadTracks(tracks, saveCb) { // tracks: [{ filename: string, number: number }]
   for(const track of tracks){
     const lines = await downloadTrack(track.filename);
     const title = `Bangle.js Track ${track.number}`;
@@ -710,7 +719,7 @@
   if (lIdx >= 0) {
     var tries = 100;
     var l = data;
-    while (l && l.split(",")[lIdx]=="" && tries--)
+    while (l && l.split(",")[lIdx]==="" && tries--)
       l = f.readLine();
     if (l) data = l;
   }
@@ -719,6 +728,7 @@
           if (!trackInfo || !("headers" in trackInfo)) {
             showToast("Error loading track list.", "error");
             resolve();
+            return;
           }
           trackInfo.headers = trackInfo.headers.split(",");
           trackList.push({
@@ -842,23 +852,21 @@ <h2>Settings</h2>
         attachTrackButtonListeners(trackContainer);
 
         downloadTrack(track.filename).then(fullTrack => {
-          if (trackData.Latitude) {
-            const coordinates = fullTrack
-              .filter(hasValidGPS)
-              .map(pt => [parseFloat(pt.Latitude), parseFloat(pt.Longitude)]);
-
-            if (coordinates.length > 0) {
-              createLeafletMap(`map-${track.number}`, coordinates, fullTrack);
-
-              let distance = 0;
-              for (let i = 1; i < coordinates.length; i++) distance += L.latLng(coordinates[i-1]).distanceTo(L.latLng(coordinates[i]));
-              const duration = fullTrack[fullTrack.length-1].Time - fullTrack[0].Time;
-              const hours = Math.floor(duration / 3600000), minutes = Math.floor((duration % 3600000) / 60000);
-              const statsEl = document.getElementById(`stats-${track.number}`);
-              if (statsEl) {
-                const d = convertDistance(distance/1000);
-                statsEl.innerHTML = `<strong>Distance:</strong> ${d.value.toFixed(2)} ${d.unit} | <strong>Duration:</strong> ${hours}h ${minutes}m | <strong>Points:</strong> ${coordinates.length}`;
-              }
+          const coordinates = fullTrack
+            .filter(hasValidGPS)
+            .map(pt => [parseFloat(pt.Latitude), parseFloat(pt.Longitude)]);
+
+          if (coordinates.length > 0) {
+            createLeafletMap(`map-${track.number}`, coordinates, fullTrack);
+
+            let distance = 0;
+            for (let i = 1; i < coordinates.length; i++) distance += L.latLng(coordinates[i-1]).distanceTo(L.latLng(coordinates[i]));
+            const duration = fullTrack[fullTrack.length-1].Time - fullTrack[0].Time;
+            const hours = Math.floor(duration / 3600000), minutes = Math.floor((duration % 3600000) / 60000);
+            const statsEl = document.getElementById(`stats-${track.number}`);
+            if (statsEl) {
+              const d = convertDistance(distance/1000);
+              statsEl.innerHTML = `<strong>Distance:</strong> ${d.value.toFixed(2)} ${d.unit} | <strong>Duration:</strong> ${hours}h ${minutes}m | <strong>Points:</strong> ${coordinates.length}`;
             }
           }
 
@@ -902,18 +910,19 @@ <h2>Settings</h2>
 
             if (!filename || !trackid) return;
 
+            const tracks = [{ filename, number: trackid }];
             switch(task) {
               case "delete":
                 await confirmDelete(button, [filename]);
                 break;
               case "downloadkml":
-                await downloadTracks([filename], track => saveKML(track, `Bangle.js Track ${trackid}`));
+                await downloadTracks(tracks, track => saveKML(track, `Bangle.js Track ${trackid}`));
                 break;
               case "downloadgpx":
-                await downloadTracks([filename], track => saveGPX(track, `Bangle.js Track ${trackid}`));
+                await downloadTracks(tracks, track => saveGPX(track, `Bangle.js Track ${trackid}`));
                 break;
               case "downloadcsv":
-                await downloadTracks([filename], track => saveCSV(track, `Bangle.js Track ${trackid}`));
+                await downloadTracks(tracks, track => saveCSV(track, `Bangle.js Track ${trackid}`));
                 break;
             }
           });