vendor/assets/leaflet/leaflet.zoom.js

   1 L.Control.Zoomslider = L.Control.extend({\r
   2         options: {\r
   3                 position: 'topleft',\r
   4                 // height in px of zoom-slider.png\r
   5                 stepHeight: 9\r
   6         },\r
   7 \r
   8         onAdd: function (map) {\r
   9                 var className = 'leaflet-control-zoomslider',\r
  10                         container = L.DomUtil.create('div', className);\r
  11 \r
  12                 L.DomEvent.disableClickPropagation(container);\r
  13 \r
  14                 this._map = map;\r
  15 \r
  16                 this._zoomInButton = this._createButton('Zoom in', className + '-in'\r
  17                                                                                                 , container, this._zoomIn , this);\r
  18                 this._createSlider(className + '-slider', container, map);\r
  19                 this._zoomOutButton = this._createButton('Zoom out', className + '-out'\r
  20                                                                                                  , container, this._zoomOut, this);\r
  21 \r
  22                 map.on('layeradd layerremove', this._refresh, this);\r
  23 \r
  24                 map.whenReady(function(){\r
  25                         this._snapToSliderValue();\r
  26                         map.on('zoomend', this._snapToSliderValue, this);\r
  27                 }, this);\r
  28 \r
  29                 return container;\r
  30         },\r
  31 \r
  32         onRemove: function(map){\r
  33                 map.off('zoomend', this._snapToSliderValue);\r
  34                 map.off('layeradd layerremove', this._refresh);\r
  35         },\r
  36 \r
  37         _refresh: function(){\r
  38                 this._map\r
  39                         .removeControl(this)\r
  40                         .addControl(this);\r
  41         },\r
  42 \r
  43         _createSlider: function (className, container, map) {\r
  44                 var zoomLevels = map.getMaxZoom() - map.getMinZoom();\r
  45                 // This means we have no tilelayers (or that they are setup in a strange way).\r
  46                 // Either way we don't want to add a slider here.\r
  47                 if(zoomLevels == Infinity){\r
  48                         return undefined;\r
  49                 }\r
  50                 this._sliderHeight = this.options.stepHeight * zoomLevels;\r
  51 \r
  52                 var wrapper =  L.DomUtil.create('div', className + '-wrap', container);\r
  53                 wrapper.style.height = (this._sliderHeight + 5) + "px";\r
  54                 var slider = L.DomUtil.create('div', className, wrapper);\r
  55                 this._knob = L.DomUtil.create('div', className + '-knob', slider);\r
  56 \r
  57                 this._draggable = this._createDraggable();\r
  58                 this._draggable.enable();\r
  59 \r
  60                 L.DomEvent.on(slider, 'click', this._onSliderClick, this);\r
  61 \r
  62                 return slider;\r
  63         },\r
  64 \r
  65         _zoomIn: function (e) {\r
  66             this._map.zoomIn(e.shiftKey ? 3 : 1);\r
  67         },\r
  68 \r
  69         _zoomOut: function (e) {\r
  70             this._map.zoomOut(e.shiftKey ? 3 : 1);\r
  71         },\r
  72 \r
  73         _createButton: function (title, className, container, fn, context) {\r
  74                 var link = L.DomUtil.create('a', className, container);\r
  75                 link.href = '#';\r
  76                 link.title = title;\r
  77 \r
  78                 L.DomEvent\r
  79                     .on(link, 'click', L.DomEvent.preventDefault)\r
  80                     .on(link, 'click', fn, context);\r
  81 \r
  82                 return link;\r
  83         },\r
  84 \r
  85         _createDraggable: function() {\r
  86                 L.DomUtil.setPosition(this._knob, L.point(0, 0));\r
  87                 L.DomEvent.disableClickPropagation(this._knob);\r
  88 \r
  89                 var bounds = new L.Bounds(\r
  90                         L.point(0, 0),\r
  91                         L.point(0, this._sliderHeight)\r
  92                 );\r
  93                 var draggable = new L.BoundedDraggable(this._knob,\r
  94                                                                                            this._knob,\r
  95                                                                                            bounds)\r
  96                         .on('drag', this._snap, this)\r
  97                         .on('dragend', this._setZoom, this);\r
  98 \r
  99                 return draggable;\r
 100         },\r
 101 \r
 102         _snap : function(){\r
 103                 this._snapToSliderValue(this._posToSliderValue());\r
 104         },\r
 105         _setZoom: function() {\r
 106                 this._map.setZoom(this._toZoomLevel(this._posToSliderValue()));\r
 107         },\r
 108 \r
 109         _onSliderClick: function(e){\r
 110                 var first = (e.touches && e.touches.length === 1 ? e.touches[0] : e);\r
 111             var offset = first.offsetY\r
 112                         ? first.offsetY\r
 113                         : L.DomEvent.getMousePosition(first).y\r
 114                         - L.DomUtil.getViewportOffset(this._knob).y;\r
 115                 var value = this._posToSliderValue(offset - this._knob.offsetHeight / 2);\r
 116                 this._snapToSliderValue(value);\r
 117                 this._map.setZoom(this._toZoomLevel(value));\r
 118         },\r
 119 \r
 120         _posToSliderValue: function(pos) {\r
 121                 pos = isNaN(pos)\r
 122                         ? L.DomUtil.getPosition(this._knob).y\r
 123                         : pos;\r
 124                 return Math.round( (this._sliderHeight - pos) / this.options.stepHeight);\r
 125         },\r
 126 \r
 127         _snapToSliderValue: function(sliderValue) {\r
 128                 this._updateDisabled();\r
 129                 if(this._knob) {\r
 130                         sliderValue = isNaN(sliderValue)\r
 131                                 ? this._getSliderValue()\r
 132                                 : sliderValue;\r
 133                         var y = this._sliderHeight\r
 134                                 - (sliderValue * this.options.stepHeight);\r
 135                         L.DomUtil.setPosition(this._knob, L.point(0, y));\r
 136                 }\r
 137         },\r
 138         _toZoomLevel: function(sliderValue) {\r
 139                 return sliderValue + this._map.getMinZoom();\r
 140         },\r
 141         _toSliderValue: function(zoomLevel) {\r
 142                 return zoomLevel - this._map.getMinZoom();\r
 143         },\r
 144         _getSliderValue: function(){\r
 145                 return this._toSliderValue(this._map.getZoom());\r
 146         },\r
 147 \r
 148         _updateDisabled: function () {\r
 149                 var map = this._map,\r
 150                         className = 'leaflet-control-zoomslider-disabled';\r
 151 \r
 152                 L.DomUtil.removeClass(this._zoomInButton, className);\r
 153                 L.DomUtil.removeClass(this._zoomOutButton, className);\r
 154 \r
 155                 if (map.getZoom() === map.getMinZoom()) {\r
 156                         L.DomUtil.addClass(this._zoomOutButton, className);\r
 157                 }\r
 158                 if (map.getZoom() === map.getMaxZoom()) {\r
 159                         L.DomUtil.addClass(this._zoomInButton, className);\r
 160                 }\r
 161         }\r
 162 });\r
 163 \r
 164 L.Map.mergeOptions({\r
 165     zoomControl: false,\r
 166     zoomsliderControl: true\r
 167 });\r
 168 \r
 169 L.Map.addInitHook(function () {\r
 170     if (this.options.zoomsliderControl) {\r
 171                 L.control.zoomslider().addTo(this);\r
 172         }\r
 173 });\r
 174 \r
 175 L.control.zoomslider = function (options) {\r
 176     return new L.Control.Zoomslider(options);\r
 177 };\r
 178 \r
 179 \r
 180 L.BoundedDraggable = L.Draggable.extend({\r
 181         initialize: function(element, dragStartTarget, bounds) {\r
 182                 L.Draggable.prototype.initialize.call(this, element, dragStartTarget);\r
 183                 this._bounds = bounds;\r
 184                 this.on('predrag', function() {\r
 185                         if(!this._bounds.contains(this._newPos)){\r
 186                                 this._newPos = this._fitPoint(this._newPos);\r
 187                         }\r
 188                 }, this);\r
 189         },\r
 190         _fitPoint: function(point){\r
 191                 var closest = L.point(\r
 192                         Math.min(point.x, this._bounds.max.x),\r
 193                         Math.min(point.y, this._bounds.max.y)\r
 194                 );\r
 195                 closest.x = Math.max(closest.x, this._bounds.min.x);\r
 196                 closest.y = Math.max(closest.y, this._bounds.min.y);\r
 197                 return closest;\r
 198         }\r
 199 });\r