X-Git-Url: https://git.openstreetmap.org/rails.git/blobdiff_plain/19d62168607b8a355156b2c2e089b615ab4c9381..7904b49bb13c23b8c8beb4f5bcf25fa12d8374dd:/app/assets/javascripts/index.js

diff --git a/app/assets/javascripts/index.js b/app/assets/javascripts/index.js
index 40f546009..2bda933a9 100644
--- a/app/assets/javascripts/index.js
+++ b/app/assets/javascripts/index.js
@@ -1,6 +1,8 @@
 //= require_self
 //= require leaflet.sidebar
+//= require leaflet.sidebar-pane
 //= require leaflet.locatecontrol/src/L.Control.Locate
+//= require leaflet.locate
 //= require leaflet.layers
 //= require leaflet.key
 //= require leaflet.note
@@ -97,62 +99,55 @@ $(document).ready(function () {
     }
   });
 
-  var position = $("html").attr("dir") === "rtl" ? "topleft" : "topright";
-
-  L.OSM.zoom({ position: position })
+  var sidebar = L.OSM.sidebar("#map-ui")
     .addTo(map);
 
-  var locate = L.control.locate({
-    position: position,
-    icon: "icon geolocate",
-    iconLoading: "icon geolocate",
-    strings: {
-      title: I18n.t("javascripts.map.locate.title"),
-      popup: function (options) {
-        return I18n.t("javascripts.map.locate." + options.unit + "Popup", { count: options.distance });
-      }
-    }
-  }).addTo(map);
-
-  var locateContainer = locate.getContainer();
+  var position = $("html").attr("dir") === "rtl" ? "topleft" : "topright";
 
-  $(locateContainer)
-    .removeClass("leaflet-control-locate leaflet-bar")
-    .addClass("control-locate")
-    .children("a")
-    .attr("href", "#")
-    .removeClass("leaflet-bar-part leaflet-bar-part-single")
-    .addClass("control-button");
+  function addControlGroup(controls) {
+    controls.forEach(function (control) {
+      control.addTo(map);
+    });
 
-  var sidebar = L.OSM.sidebar("#map-ui")
-    .addTo(map);
+    var lastContainer = controls[controls.length -1].getContainer();
+    $(lastContainer).addClass("leaflet-control-group-end");
+  }
 
-  L.OSM.layers({
-    position: position,
-    layers: map.baseLayers,
-    sidebar: sidebar
-  }).addTo(map);
-
-  L.OSM.key({
-    position: position,
-    sidebar: sidebar
-  }).addTo(map);
-
-  L.OSM.share({
-    "position": position,
-    "sidebar": sidebar,
-    "short": true
-  }).addTo(map);
-
-  L.OSM.note({
-    position: position,
-    sidebar: sidebar
-  }).addTo(map);
-
-  L.OSM.query({
-    position: position,
-    sidebar: sidebar
-  }).addTo(map);
+  addControlGroup([
+    L.OSM.zoom({ position: position }),
+    L.OSM.locate({ position: position })
+  ]);
+
+  addControlGroup([
+    L.OSM.layers({
+      position: position,
+      layers: map.baseLayers,
+      sidebar: sidebar
+    }),
+    L.OSM.key({
+      position: position,
+      sidebar: sidebar
+    }),
+    L.OSM.share({
+      "position": position,
+      "sidebar": sidebar,
+      "short": true
+    })
+  ]);
+
+  addControlGroup([
+    L.OSM.note({
+      position: position,
+      sidebar: sidebar
+    })
+  ]);
+
+  addControlGroup([
+    L.OSM.query({
+      position: position,
+      sidebar: sidebar
+    })
+  ]);
 
   L.control.scale()
     .addTo(map);