From 5540d37c72b70cafe22fcbd13d7051b945b74dea Mon Sep 17 00:00:00 2001
From: Alexander Bocken <alexander@bocken.org>
Date: Fri, 22 May 2026 14:26:44 +0200
Subject: [PATCH] feat(route-builder): clearer map cursors, route click
 tolerance, swisstopo credit
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Pointing-hand cursor over the map (click adds a waypoint); grab/grabbing
  only on the draggable waypoint pins. Fixes the cursor living on the
  Leaflet container element itself (the `.edit-map` div), not a descendant.
- Route polylines render on a canvas renderer with a hit `tolerance`, so a
  click near the line inserts a waypoint without a pixel-perfect hit.
- Hide the on-map attribution control and show the required "Kartendaten ©
  swisstopo" credit in the page footer, matching /hikes.
---
 package.json                                  |  2 +-
 .../hikes/route-builder/EditMap.svelte        | 30 +++++++++++++++++--
 src/routes/hikes/route-builder/+page.svelte   | 29 ++++++++++++++++++
 3 files changed, 58 insertions(+), 3 deletions(-)

diff --git a/package.json b/package.json
index 9fc24fa9..92fd0588 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
 	"name": "homepage",
-	"version": "1.82.0",
+	"version": "1.82.1",
 	"private": true,
 	"type": "module",
 	"scripts": {
diff --git a/src/lib/components/hikes/route-builder/EditMap.svelte b/src/lib/components/hikes/route-builder/EditMap.svelte
index 1d717034..dc7e87a4 100644
--- a/src/lib/components/hikes/route-builder/EditMap.svelte
+++ b/src/lib/components/hikes/route-builder/EditMap.svelte
@@ -94,7 +94,9 @@
 			if (cancelled || !node.isConnected) return;
 
 			const map = L.map(node, {
-				attributionControl: true,
+				// On-map attribution removed for a cleaner frame; the required
+				// swisstopo credit is shown in the page footer instead.
+				attributionControl: false,
 				zoomControl: true,
 				preferCanvas: false
 			}).setView(DEFAULT_CENTER, DEFAULT_ZOOM);
@@ -109,6 +111,11 @@
 			const markerLayer = L.layerGroup().addTo(map);
 			const lineLayer = L.layerGroup().addTo(map);
 
+			// Route polylines render on a canvas with a hit-test `tolerance`, so a
+			// click *near* the (thin) line still inserts a waypoint into the route
+			// — same trick as the /hikes overview map's broadened hover.
+			const routeRenderer = L.canvas({ tolerance: 12 });
+
 			// Map of waypointId → marker, kept in sync by render(). Used by the
 			// focus effect so it can pan/zoom + style the marker for `mapView.focusId`
 			// without forcing a full re-render of every marker.
@@ -204,7 +211,8 @@
 						const poly = L.polyline(latLngs, {
 							color: TRACK_COLOR,
 							weight: 4,
-							opacity: 0.9
+							opacity: 0.9,
+							renderer: routeRenderer
 						}).addTo(lineLayer);
 						// Routed segments index aligns with placed-only pairs; map back
 						// to the full waypoint-array index so inline insertion still
@@ -357,6 +365,24 @@
 		}
 	}
 
+	/* Default cursor is a pointing hand — a click adds a waypoint (on blank map
+	 * or, with the canvas tolerance, near a route). Leaflet turns the
+	 * `.edit-map` div itself into the container, so the grab cursor lives on
+	 * this element (not a descendant) — target it directly. */
+	.edit-map:global(.leaflet-container) {
+		cursor: pointer;
+	}
+
+	/* Waypoint pins are the only draggable thing — show the drag hand on them. */
+	.edit-map :global(.rb-waypoint) {
+		cursor: grab;
+	}
+
+	.edit-map :global(.rb-waypoint:active) {
+		cursor: grabbing;
+	}
+
+	/* Placement mode (dropping an unplaced image) keeps the crosshair. */
 	.edit-map-wrap.placement-mode :global(.leaflet-container) {
 		cursor: crosshair;
 	}
diff --git a/src/routes/hikes/route-builder/+page.svelte b/src/routes/hikes/route-builder/+page.svelte
index b2cc2154..8cac8bb3 100644
--- a/src/routes/hikes/route-builder/+page.svelte
+++ b/src/routes/hikes/route-builder/+page.svelte
@@ -490,6 +490,15 @@
 		Veröffentlichung als Wandereintrag erfordert einen Commit der Dateien unter
 		<code>src/content/hikes/&lt;slug&gt;/</code>.
 	</p>
+
+	<!-- Tiny swisstopo credit (the on-map attribution control is hidden);
+	     their tile licence still requires the credit to appear on the page. -->
+	<footer class="map-credit">
+		Kartendaten &copy;
+		<a href="https://www.swisstopo.admin.ch/" target="_blank" rel="noopener noreferrer">
+			swisstopo
+		</a>
+	</footer>
 </section>
 
 <!-- FAB lives outside .builder so its fixed-positioning doesn't add a
@@ -848,4 +857,24 @@
 		border-radius: var(--radius-sm);
 		font-size: 0.85em;
 	}
+
+	/* Tiny, muted map-licence credit at the bottom of the page. */
+	.map-credit {
+		margin-top: 0.5rem;
+		text-align: center;
+		font-size: 0.72rem;
+		color: var(--color-text-tertiary);
+	}
+
+	.map-credit a {
+		color: inherit;
+		text-decoration: underline;
+		text-decoration-color: color-mix(in oklab, currentColor 35%, transparent);
+		text-underline-offset: 0.18em;
+		transition: color var(--transition-fast);
+	}
+
+	.map-credit a:hover {
+		color: var(--color-primary);
+	}
 </style>