From c887f1d7b29ff6a125ebe70ff15609a005f99fba Mon Sep 17 00:00:00 2001
From: Anton Khorev <tony29@yandex.ru>
Date: Sun, 5 Jan 2025 17:59:47 +0300
Subject: [PATCH] Use details attribute to render changeset bounding box

Do this instead of using L.OSM.DataLayer. DataLayer makes an extra request just to get the bbox. Also it expects bbox to always exist, which is not true for some changesets.
---
 app/assets/javascripts/index/changeset.js | 21 ++++++++----------
 app/assets/javascripts/leaflet.map.js     | 27 +++++++++++++++--------
 2 files changed, 27 insertions(+), 21 deletions(-)

diff --git a/app/assets/javascripts/index/changeset.js b/app/assets/javascripts/index/changeset.js
index 257dad5bc..caf40f6b6 100644
--- a/app/assets/javascripts/index/changeset.js
+++ b/app/assets/javascripts/index/changeset.js
@@ -1,29 +1,26 @@
 OSM.Changeset = function (map) {
   var page = {},
-      content = $("#sidebar_content"),
-      currentChangesetId;
+      content = $("#sidebar_content");
 
-  page.pushstate = page.popstate = function (path, id) {
+  page.pushstate = page.popstate = function (path) {
     OSM.loadSidebarContent(path, function () {
-      page.load(path, id);
+      page.load();
     });
   };
 
-  page.load = function (path, id) {
-    if (id) currentChangesetId = id;
-    initialize();
-    addChangeset(currentChangesetId);
-  };
+  page.load = function () {
+    const changesetData = content.find("[data-changeset]").data("changeset");
+    changesetData.type = "changeset";
 
-  function addChangeset(id) {
-    map.addObject({ type: "changeset", id: parseInt(id, 10) }, function (bounds) {
+    initialize();
+    map.addObject(changesetData, function (bounds) {
       if (!window.location.hash && bounds.isValid()) {
         OSM.router.withoutMoveListener(function () {
           map.fitBounds(bounds);
         });
       }
     });
-  }
+  };
 
   function updateChangeset(method, url, include_data) {
     var data;
diff --git a/app/assets/javascripts/leaflet.map.js b/app/assets/javascripts/leaflet.map.js
index 6537b0b23..5e6112fc0 100644
--- a/app/assets/javascripts/leaflet.map.js
+++ b/app/assets/javascripts/leaflet.map.js
@@ -267,7 +267,7 @@ L.OSM.Map = L.Map.extend({
 
     this.removeObject();
 
-    if (object.type === "note") {
+    if (object.type === "note" || object.type === "changeset") {
       this._objectLoader = {
         abort: function () {}
       };
@@ -275,18 +275,27 @@ L.OSM.Map = L.Map.extend({
       this._object = object;
       this._objectLayer = L.featureGroup().addTo(this);
 
-      L.circleMarker(object.latLng, haloStyle).addTo(this._objectLayer);
+      if (object.type === "note") {
+        L.circleMarker(object.latLng, haloStyle).addTo(this._objectLayer);
 
-      if (object.icon) {
-        L.marker(object.latLng, {
-          icon: object.icon,
-          opacity: 1,
-          interactive: true
-        }).addTo(this._objectLayer);
+        if (object.icon) {
+          L.marker(object.latLng, {
+            icon: object.icon,
+            opacity: 1,
+            interactive: true
+          }).addTo(this._objectLayer);
+        }
+      } else if (object.type === "changeset") {
+        if (object.bbox) {
+          L.rectangle([
+            [object.bbox.minlat, object.bbox.minlon],
+            [object.bbox.maxlat, object.bbox.maxlon]
+          ], changesetStyle).addTo(this._objectLayer);
+        }
       }
 
       if (callback) callback(this._objectLayer.getBounds());
-    } else { // element or changeset handled by L.OSM.DataLayer
+    } else { // element handled by L.OSM.DataLayer
       var map = this;
       this._objectLoader = $.ajax({
         url: OSM.apiUrl(object),
-- 
2.39.5