fixes waypoint move after save bug

web/src/lib/components/trail/map_with_elevation_maplibre.svelte

@@ -31,6 +31,9 @@
     export let showFullscreen: boolean = false;
     export let showTerrain: boolean = false;
     export let fitBounds: "animate" | "instant" | "off" = "instant";
+    export let onMarkerDragEnd:
+        | ((marker: M.Marker, wpId?: string) => void)
+        | undefined = undefined;
 
     export let elevationProfileContainer: string | HTMLDivElement | undefined =
         undefined;
@@ -488,7 +491,7 @@
             return;
         }
         for (const waypoint of trails[activeTrail]?.expand.waypoints ?? []) {
-            const marker = createMarkerFromWaypoint(waypoint);
+            const marker = createMarkerFromWaypoint(waypoint, onMarkerDragEnd);
             marker.addTo(map);
             markers.push(marker);
         }

web/src/lib/util/maplibre_util.ts

@@ -23,7 +23,7 @@ export class FontawesomeMarker extends M.Marker {
     }
 }
 
-export function createMarkerFromWaypoint(waypoint: Waypoint, onDragEnd?: (marker: M.Marker) => void): FontawesomeMarker {
+export function createMarkerFromWaypoint(waypoint: Waypoint, onDragEnd?: (marker: M.Marker, wpId?: string) => void): FontawesomeMarker {
     const marker = new FontawesomeMarker({
         icon: `fa fa-${waypoint.icon}`,
     }, {
@@ -44,7 +44,7 @@ export function createMarkerFromWaypoint(waypoint: Waypoint, onDragEnd?: (marker
         .setPopup(popup)
 
     if (onDragEnd) {
-        marker.on("dragend", () => onDragEnd(marker));
+        marker.on("dragend", () => onDragEnd(marker, waypoint.id,));
     }
 
     return marker;
@@ -83,7 +83,7 @@ export function createPopupFromTrail(trail: Trail) {
     const thumbnail = trail.photos.length
         ? getFileURL(trail, trail.photos[trail.thumbnail])
         : "/imgs/default_thumbnail.webp";
-    const popup = new M.Popup({maxWidth: "320px"});
+    const popup = new M.Popup({ maxWidth: "320px" });
     popup.setHTML(
         `<a href="/map/trail/${trail.id}" data-sveltekit-preload-data="off">
     <li class="flex items-center gap-4 cursor-pointer text-content max-w-80">

web/src/routes/trail/edit/[id]/+page.svelte

@@ -387,23 +387,26 @@
             savedWaypoint.id = cryptoRandomString({ length: 15 });
             $form.expand.waypoints = [...$form.expand.waypoints, savedWaypoint];
         }
-        const marker = createMarkerFromWaypoint(savedWaypoint, (event) => {
+        const marker = createMarkerFromWaypoint(savedWaypoint, moveMarker);
-            var marker = event;
-            var position = marker.getLngLat();
-            const editableWaypointIndex = $form.expand.waypoints.findIndex(
-                (w) => w.id == savedWaypoint.id,
-            );
-            const editableWaypoint =
-                $form.expand.waypoints[editableWaypointIndex];
-            editableWaypoint!.lat = position.lat;
-            editableWaypoint!.lon = position.lng;
-            $form.expand.waypoints = [...$form.expand.waypoints];
-        });
 
         marker.addTo(map);
         savedWaypoint.marker = marker;
     }
 
+    function moveMarker(marker: M.Marker, wpId?: string) {
+        const position = marker.getLngLat();
+        const editableWaypointIndex = $form.expand.waypoints.findIndex(
+            (w) => w.id == wpId,
+        );
+        const editableWaypoint = $form.expand.waypoints[editableWaypointIndex];
+        if (!editableWaypoint) {
+            return;
+        }
+        editableWaypoint.lat = position.lat;
+        editableWaypoint.lon = position.lng;
+        $form.expand.waypoints = [...$form.expand.waypoints];
+    }
+
     function beforeSummitLogModalOpen() {
         summitLog.set(new SummitLog(new Date().toISOString().split("T")[0]));
         openSummitLogModal();
@@ -903,6 +906,8 @@
         <MapWithElevationMaplibre
             trails={mapTrail}
             drawing={drawingActive}
+            showTerrain={true}
+            onMarkerDragEnd={moveMarker}
             bind:map
             on:click={(e) => handleMapClick(e.detail)}
         ></MapWithElevationMaplibre>