From bd226ea4ad016c3c53f16fd622a33f6d2a9833da Mon Sep 17 00:00:00 2001
From: Marwin Hochfelsner <50826859+hlfan@users.noreply.github.com>
Date: Sat, 2 Aug 2025 02:20:13 +0200
Subject: [PATCH] Replace links on map with new OSM.router.click() method

---
 .../javascripts/index/history-changesets-layer.js     |  8 ++------
 app/assets/javascripts/index/search.js                |  8 ++------
 app/assets/javascripts/router.js                      | 11 +++++++++++
 3 files changed, 15 insertions(+), 12 deletions(-)

diff --git a/app/assets/javascripts/index/history-changesets-layer.js b/app/assets/javascripts/index/history-changesets-layer.js
index 7f62fde30..1c001f541 100644
--- a/app/assets/javascripts/index/history-changesets-layer.js
+++ b/app/assets/javascripts/index/history-changesets-layer.js
@@ -5,7 +5,6 @@ OSM.HistoryChangesetBboxLayer = L.FeatureGroup.extend({
 
   addChangesetLayer: function (changeset) {
     const style = this._getChangesetStyle(changeset);
-    const anchor = $(L.SVG.create("a")).attr("href", $(`#changeset_${changeset.id} a.changeset_id`).attr("href"));
     const rectangle = L.rectangle(changeset.bounds, {
       ...style,
       contextmenu: true,
@@ -21,11 +20,8 @@ OSM.HistoryChangesetBboxLayer = L.FeatureGroup.extend({
       }]
     });
     rectangle.id = changeset.id;
-    rectangle.on("add", function () {
-      $(this.getElement()).replaceWith(anchor).appendTo(anchor);
-    });
-    rectangle.on("remove", function () {
-      anchor.remove();
+    rectangle.on("click", function (e) {
+      OSM.router.click(e.originalEvent, $(`#changeset_${changeset.id} a.changeset_id`).attr("href"));
     });
     return this.addLayer(rectangle);
   },
diff --git a/app/assets/javascripts/index/search.js b/app/assets/javascripts/index/search.js
index 6fed4cc4f..2d7b17fc5 100644
--- a/app/assets/javascripts/index/search.js
+++ b/app/assets/javascripts/index/search.js
@@ -69,16 +69,12 @@ OSM.Search = function (map) {
     const inverseGoldenAngle = (Math.sqrt(5) - 1) * 180;
     const color = `hwb(${(index * inverseGoldenAngle) % 360}deg 5% 5%)`;
     listItem.css("--marker-color", color);
-    const anchor = $("<a>").attr("href", listItem.find("a.set_position").attr("href"));
     const data = listItem.find("a.set_position").data();
     const marker = L.marker([data.lat, data.lon], { icon: OSM.getMarker({ color, className: "activatable" }) });
     marker.on("mouseover", () => listItem.addClass("bg-body-secondary"));
     marker.on("mouseout", () => listItem.removeClass("bg-body-secondary"));
-    marker.on("add", function () {
-      $(this.getElement()).replaceWith(anchor).appendTo(anchor);
-    });
-    marker.on("remove", function () {
-      anchor.remove();
+    marker.on("click", function (e) {
+      OSM.router.click(e.originalEvent, listItem.find("a.set_position").attr("href"));
     });
     markers.addLayer(marker);
     listItem.on("mouseover", () => $(marker.getElement()).addClass("active"));
diff --git a/app/assets/javascripts/router.js b/app/assets/javascripts/router.js
index cb4d0052d..77def5f4b 100644
--- a/app/assets/javascripts/router.js
+++ b/app/assets/javascripts/router.js
@@ -183,6 +183,17 @@ OSM.Router = function (map, rts) {
     currentRoute = routes.recognize(currentPath);
   };
 
+  router.click = function (event, href) {
+    const eventOptions = {};
+    for (const key in event) eventOptions[key] = event[key];
+    const clickEvent = new (event.constructor)("click", eventOptions);
+    const link = document.createElement("a");
+    link.href = href;
+    document.body.appendChild(link);
+    link.dispatchEvent(clickEvent);
+    document.body.removeChild(link);
+  };
+
   map.on("moveend baselayerchange overlayadd overlayremove", router.updateHash);
   $(window).on("hashchange", router.hashUpdated);
 
-- 
2.39.5