From: Aaron Lidman <aaronlidman@gmail.com>
Date: Thu, 14 Nov 2013 01:30:07 +0000 (-0800)
Subject: Disable overlay layers at minZoom and add tooltips
X-Git-Tag: live~4661^2~74
X-Git-Url: https://git.openstreetmap.org/rails.git/commitdiff_plain/439ad373ec5ee364003625e56159b1dce5fb186e?ds=sidebyside

Disable overlay layers at minZoom and add tooltips
---

diff --git a/app/assets/javascripts/leaflet.layers.js b/app/assets/javascripts/leaflet.layers.js
index 2bb4c5c1b..2d28c256c 100644
--- a/app/assets/javascripts/leaflet.layers.js
+++ b/app/assets/javascripts/leaflet.layers.js
@@ -120,8 +120,13 @@ L.OSM.layers = function(options) {
       var list = $('<ul>')
         .appendTo(overlaySection);
 
-      function addOverlay(layer, name) {
+      function addOverlay(layer, name, minZoom) {
+        var refName = name.split(' ').join('_').toLowerCase();
         var item = $('<li>')
+          .attr('class', refName)
+          .tooltip({
+            placement: 'top'
+          })
           .appendTo(list);
 
         var label = $('<label>')
@@ -146,10 +151,18 @@ L.OSM.layers = function(options) {
         map.on('layeradd layerremove', function() {
           input.prop('checked', map.hasLayer(layer));
         });
+
+        map.on('zoomend', function() {
+          var disabled = map.getZoom() < minZoom + 1;
+          $(input).prop('disabled', disabled);
+          disabled ? $(item).attr('class', 'disabled') : $(item).attr('class', '');
+          item.attr('data-original-title', disabled ?
+            'Zoom in to see ' + name.toLowerCase() : '');
+        });
       }
 
-      addOverlay(map.noteLayer, I18n.t('javascripts.map.layers.notes'));
-      addOverlay(map.dataLayer, I18n.t('javascripts.map.layers.data'));
+      addOverlay(map.noteLayer, I18n.t('javascripts.map.layers.notes'), 10);
+      addOverlay(map.dataLayer, I18n.t('javascripts.map.layers.data'), 15);
     }
 
     options.sidebar.addPane($ui);
diff --git a/app/assets/stylesheets/common.css.scss b/app/assets/stylesheets/common.css.scss
index caf9a8bfb..6120101a9 100644
--- a/app/assets/stylesheets/common.css.scss
+++ b/app/assets/stylesheets/common.css.scss
@@ -764,6 +764,7 @@ nav.secondary {
       font-size: 13px;
       margin-bottom: 8px;
     }
+    li.disabled { color: #999; }
   }
 }