From: Anton Khorev <tony29@yandex.ru>
Date: Sun, 5 Jan 2025 14:59:47 +0000 (+0300)
Subject: Use details attribute to render changeset bounding box
X-Git-Tag: live~32^2
X-Git-Url: https://git.openstreetmap.org./rails.git/commitdiff_plain/c887f1d7b29ff6a125ebe70ff15609a005f99fba

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.
---

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),