From 579a2616125d7e55f5cde6ffcec2079bd41053eb Mon Sep 17 00:00:00 2001
From: Elian Doran <contact@eliandoran.me>
Date: Sun, 6 Jul 2025 12:19:04 +0300
Subject: [PATCH] chore(views/geomap): reintroduce display of tracks

---
 .../src/widgets/type_widgets/geo_map.ts       | 37 -------------------
 .../widgets/view_widgets/geo_view/index.ts    |  5 ++-
 .../widgets/view_widgets/geo_view/markers.ts  | 33 +++++++++++++++++
 3 files changed, 36 insertions(+), 39 deletions(-)

diff --git a/apps/client/src/widgets/type_widgets/geo_map.ts b/apps/client/src/widgets/type_widgets/geo_map.ts
index ad7d98529..06056bfab 100644
--- a/apps/client/src/widgets/type_widgets/geo_map.ts
+++ b/apps/client/src/widgets/type_widgets/geo_map.ts
@@ -40,7 +40,6 @@ export default class GeoMapTypeWidget extends TypeWidget {
     private geoMapWidget: GeoMapWidget;
     private _state: State;
     private L!: Leaflet;
-    private gpxLoaded?: boolean;
     private ignoreNextZoomEvent?: boolean;
 
     static getType() {
@@ -86,42 +85,6 @@ export default class GeoMapTypeWidget extends TypeWidget {
         // }
     }
 
-
-
-    // async #processNoteWithGpxTrack(note: FNote) {
-    //     if (!this.L || !this.geoMapWidget.map) {
-    //         return;
-    //     }
-
-    //     if (!this.gpxLoaded) {
-    //         await import("leaflet-gpx");
-    //         this.gpxLoaded = true;
-    //     }
-
-    //     const xmlResponse = await server.get<string | Uint8Array>(`notes/${note.noteId}/open`, undefined, true);
-    //     let stringResponse: string;
-    //     if (xmlResponse instanceof Uint8Array) {
-    //         stringResponse = new TextDecoder().decode(xmlResponse);
-    //     } else {
-    //         stringResponse = xmlResponse;
-    //     }
-
-    //     const track = new this.L.GPX(stringResponse, {
-    //         markers: {
-    //             startIcon: this.#buildIcon(note.getIcon(), note.getColorClass(), note.title),
-    //             endIcon: this.#buildIcon("bxs-flag-checkered"),
-    //             wptIcons: {
-    //                 "": this.#buildIcon("bx bx-pin")
-    //             }
-    //         },
-    //         polyline_options: {
-    //             color: note.getLabelValue("color") ?? "blue"
-    //         }
-    //     });
-    //     track.addTo(this.geoMapWidget.map);
-    //     this.currentTrackData[note.noteId] = track;
-    // }
-
     #changeState(newState: State) {
         this._state = newState;
         this.geoMapWidget.$container.toggleClass("placing-note", newState === State.NewNote);
diff --git a/apps/client/src/widgets/view_widgets/geo_view/index.ts b/apps/client/src/widgets/view_widgets/geo_view/index.ts
index 6eb75c4ad..6df005375 100644
--- a/apps/client/src/widgets/view_widgets/geo_view/index.ts
+++ b/apps/client/src/widgets/view_widgets/geo_view/index.ts
@@ -3,7 +3,7 @@ import L from "leaflet";
 import type { GPX, LatLng, Map, Marker } from "leaflet";
 import SpacedUpdate from "../../../services/spaced_update.js";
 import { t } from "../../../services/i18n.js";
-import processNoteWithMarker from "./markers.js";
+import processNoteWithMarker, { processNoteWithGpxTrack } from "./markers.js";
 import froca from "../../../services/froca.js";
 
 const TPL = /*html*/`
@@ -202,7 +202,8 @@ export default class GeoView extends ViewMode<MapData> {
             }
 
             if (childNote.mime === "application/gpx+xml") {
-                // this.#processNoteWithGpxTrack(childNote);
+                const track = await processNoteWithGpxTrack(this.map, childNote);
+                this.currentTrackData[childNote.noteId] = track;
                 continue;
             }
 
diff --git a/apps/client/src/widgets/view_widgets/geo_view/markers.ts b/apps/client/src/widgets/view_widgets/geo_view/markers.ts
index d25234650..d7258610f 100644
--- a/apps/client/src/widgets/view_widgets/geo_view/markers.ts
+++ b/apps/client/src/widgets/view_widgets/geo_view/markers.ts
@@ -4,6 +4,9 @@ import { marker, latLng, divIcon, Map } from "leaflet";
 import type FNote from "../../../entities/fnote.js";
 import note_tooltip from "../../../services/note_tooltip.js";
 import openContextMenu from "../../type_widgets/geo_map_context_menu.js";
+import server from "../../../services/server.js";
+
+let gpxLoaded = false;
 
 export default function processNoteWithMarker(map: Map, note: FNote, location: string) {
     const [lat, lng] = location.split(",", 2).map((el) => parseFloat(el));
@@ -42,6 +45,36 @@ export default function processNoteWithMarker(map: Map, note: FNote, location: s
     return newMarker;
 }
 
+export async function processNoteWithGpxTrack(map: Map, note: FNote) {
+    if (!gpxLoaded) {
+        await import("leaflet-gpx");
+        gpxLoaded = true;
+    }
+
+    const xmlResponse = await server.get<string | Uint8Array>(`notes/${note.noteId}/open`, undefined, true);
+    let stringResponse: string;
+    if (xmlResponse instanceof Uint8Array) {
+        stringResponse = new TextDecoder().decode(xmlResponse);
+    } else {
+        stringResponse = xmlResponse;
+    }
+
+    const track = new L.GPX(stringResponse, {
+        markers: {
+            startIcon: buildIcon(note.getIcon(), note.getColorClass(), note.title),
+            endIcon: buildIcon("bxs-flag-checkered"),
+            wptIcons: {
+                "": buildIcon("bx bx-pin")
+            }
+        },
+        polyline_options: {
+            color: note.getLabelValue("color") ?? "blue"
+        }
+    });
+    track.addTo(map);
+    return track;
+}
+
 function buildIcon(bxIconClass: string, colorClass?: string, title?: string) {
     return divIcon({
         html: /*html*/`\