app/assets/javascripts/leaflet.customzoom.js

   1 /*
   2  * L.Control.CustomZoom is used for the default zoom buttons on the map.
   3  */
   4
   5 L.Control.CustomZoom = L.Control.extend({
   6         options: {
   7                 position: 'topleft'
   8         },
   9
  10         onAdd: function (map) {
  11                 var zoomName = 'zoom',
  12                     container = L.DomUtil.create('div', zoomName);
  13
  14                 this._map = map;
  15
  16                 this._zoomInButton  = this._createButton(
  17                         '', 'Zoom in',  zoomName + 'in',  container, this._zoomIn,  this);
  18                 this._zoomOutButton = this._createButton(
  19                         '', 'Zoom out', zoomName + 'out', container, this._zoomOut, this);
  20
  21                 map.on('zoomend zoomlevelschange', this._updateDisabled, this);
  22
  23                 return container;
  24         },
  25
  26         onRemove: function (map) {
  27                 map.off('zoomend zoomlevelschange', this._updateDisabled, this);
  28         },
  29
  30         _zoomIn: function (e) {
  31                 this._map.zoomIn(e.shiftKey ? 3 : 1);
  32         },
  33
  34         _zoomOut: function (e) {
  35                 this._map.zoomOut(e.shiftKey ? 3 : 1);
  36         },
  37
  38         _createButton: function (html, title, className, container, fn, context) {
  39                 var link = L.DomUtil.create('a', 'control-button ' + className, container);
  40                 link.innerHTML = html;
  41                 link.href = '#';
  42                 link.title = title;
  43
  44                 var sprite = L.DomUtil.create('span', 'icon ' + className, link);
  45
  46                 var stop = L.DomEvent.stopPropagation;
  47
  48                 L.DomEvent
  49                     .on(link, 'click', stop)
  50                     .on(link, 'mousedown', stop)
  51                     .on(link, 'dblclick', stop)
  52                     .on(link, 'click', L.DomEvent.preventDefault)
  53                     .on(link, 'click', fn, context);
  54
  55                 return link;
  56         },
  57
  58         _updateDisabled: function () {
  59                 var map = this._map,
  60                         className = 'leaflet-disabled';
  61
  62                 L.DomUtil.removeClass(this._zoomInButton, className);
  63                 L.DomUtil.removeClass(this._zoomOutButton, className);
  64
  65                 if (map._zoom === map.getMinZoom()) {
  66                         L.DomUtil.addClass(this._zoomOutButton, className);
  67                 }
  68                 if (map._zoom === map.getMaxZoom()) {
  69                         L.DomUtil.addClass(this._zoomInButton, className);
  70                 }
  71         }
  72 });
  73
  74 L.control.customZoom = function (options) {
  75         return new L.Control.CustomZoom(options);
  76 };