X-Git-Url: https://git.openstreetmap.org./rails.git/blobdiff_plain/a6ac56c5e510395d160cdb7ccc7a88d87403e687..bab796bc7eb0b44eeb15d6fee567440647bc57e0:/app/assets/javascripts/leaflet.layers.js?ds=sidebyside

diff --git a/app/assets/javascripts/leaflet.layers.js b/app/assets/javascripts/leaflet.layers.js
index 2bc538798..57cd53d4d 100644
--- a/app/assets/javascripts/leaflet.layers.js
+++ b/app/assets/javascripts/leaflet.layers.js
@@ -18,9 +18,17 @@ L.OSM.layers = function(options) {
     var $ui = $('<div>')
       .attr('class', 'layers-ui');
 
-    $('<h2>')
-      .text(I18n.t('javascripts.map.layers.header'))
-      .appendTo($ui);
+    $('<section>')
+       .appendTo($ui)
+       .append(
+          $('<a>')
+            .html('&raquo;')
+            .attr('class', 'close-button')
+            .attr('href', '#')
+            .bind('click', toggle))
+       .append(
+        $('<h2>')
+          .text(I18n.t('javascripts.map.layers.header')));
 
     if (OSM.STATUS != 'api_offline' && OSM.STATUS != 'database_offline') {
       var overlaySection = $('<section>')
@@ -89,19 +97,30 @@ L.OSM.layers = function(options) {
 
       map.whenReady(function() {
         var miniMap = L.map(div[0], {attributionControl: false, zoomControl: false})
-          .setView(map.getCenter(), Math.max(map.getZoom() - 2, 0))
-          .addLayer(new layer.constructor);
+          .addLayer(new layer.constructor());
 
         miniMap.dragging.disable();
         miniMap.touchZoom.disable();
         miniMap.doubleClickZoom.disable();
         miniMap.scrollWheelZoom.disable();
 
-        map.on('moveend', function() {
-          miniMap.setView(map.getCenter(), Math.max(map.getZoom() - 2, 0));
-        });
+        $ui
+          .on('show', shown)
+          .on('hide', hide);
+
+        function shown() {
+          miniMap.invalidateSize();
+          setView();
+          map.on('moveend', setView);
+        }
+
+        function hide() {
+          map.off('moveend', setView);
+        }
 
-        div.data('map', miniMap);
+        function setView() {
+          miniMap.setView(map.getCenter(), Math.max(map.getZoom() - 2, 0));
+        }
       });
 
       var label = $('<label>')
@@ -125,15 +144,6 @@ L.OSM.layers = function(options) {
 
     options.sidebar.addPane($ui);
 
-    $ui
-      .on('show', shown);
-
-    function shown() {
-      $ui.find('.base-layers .leaflet-container').each(function() {
-        $(this).data('map').invalidateSize();
-      });
-    }
-
     function toggle(e) {
       e.stopPropagation();
       e.preventDefault();