]> git.openstreetmap.org Git - rails.git/commitdiff
Update the leaflet zoom slider plugin to fix IE8
authorTom Hughes <tom@compton.nu>
Fri, 23 Nov 2012 13:12:51 +0000 (13:12 +0000)
committerTom Hughes <tom@compton.nu>
Fri, 23 Nov 2012 13:12:51 +0000 (13:12 +0000)
vendor/assets/leaflet/leaflet.zoom.js

index de634040da50ec28a7ac508a8303ca92cbacb490..6ce96757cefa5654c2ace0d0ff01804948a87ee6 100644 (file)
@@ -7,28 +7,42 @@ L.Control.Zoomslider = L.Control.extend({
 \r
        onAdd: function (map) {\r
                var className = 'leaflet-control-zoomslider',\r
-                       container = L.DomUtil.create('div', className);\r
+                               container = L.DomUtil.create('div', className);\r
+\r
+               L.DomEvent\r
+                       .on(container, 'click', L.DomEvent.stopPropagation)\r
+                       .on(container, 'mousedown', L.DomEvent.stopPropagation)\r
+                       .on(container, 'dblclick', L.DomEvent.stopPropagation);\r
                \r
-        this._map = map;\r
+               this._map = map;\r
 \r
-               this._createButton('Zoom in', className + '-in'\r
-                                                  , container, this._zoomIn , this);\r
+               this._zoomInButton = this._createButton('+', 'Zoom in', className + '-in'\r
+                                                                                               , container, this._zoomIn , this);\r
                this._createSlider(className + '-slider', container, map);\r
-               this._createButton('Zoom out', className + '-out'\r
-                                                  , container, this._zoomOut, this);\r
-\r
+               this._zoomOutButton = this._createButton('-', 'Zoom out', className + '-out'\r
+                                                                                                , container, this._zoomOut, this);\r
                \r
-               \r
-               this._map.on('zoomend', this._snapToSliderValue, this);\r
+               map.on('layeradd layerremove', this._refresh, this);\r
+\r
+               map.whenReady(function(){\r
+                       this._snapToSliderValue();\r
+                       map.on('zoomend', this._snapToSliderValue, this);\r
+               }, this);\r
 \r
-               this._snapToSliderValue();\r
                return container;\r
        },\r
 \r
        onRemove: function(map){\r
                map.off('zoomend', this._snapToSliderValue);\r
+               map.off('layeradd layerremove', this._refresh);\r
        },\r
-       \r
+\r
+       _refresh: function(){\r
+               this._map\r
+                       .removeControl(this)\r
+                       .addControl(this);\r
+       },\r
+\r
        _createSlider: function (className, container, map) {\r
                var zoomLevels = map.getMaxZoom() - map.getMinZoom();\r
                this._sliderHeight = this.options.stepHeight * zoomLevels;\r
@@ -40,11 +54,8 @@ L.Control.Zoomslider = L.Control.extend({
 \r
                this._draggable = this._createDraggable();\r
                this._draggable.enable();\r
-               \r
-               L.DomEvent\r
-                       .on(slider, 'click', L.DomEvent.stopPropagation)\r
-                       .on(slider, 'click', L.DomEvent.preventDefault)\r
-                       .on(slider, 'click', this._onSliderClick, this);\r
+\r
+               L.DomEvent.on(slider, 'click', this._onSliderClick, this);\r
 \r
                return slider;\r
        },\r
@@ -57,16 +68,16 @@ L.Control.Zoomslider = L.Control.extend({
            this._map.zoomOut(e.shiftKey ? 3 : 1);\r
        },\r
 \r
-       _createButton: function (title, className, container, fn, context) {\r
+       _createButton: function (html, title, className, container, fn, context) {\r
                var link = L.DomUtil.create('a', className, container);\r
+               link.innerHTML = html;\r
                link.href = '#';\r
                link.title = title;\r
 \r
                L.DomEvent\r
-                       .on(link, 'click', L.DomEvent.stopPropagation)\r
-                       .on(link, 'click', L.DomEvent.preventDefault)\r
-                       .on(link, 'click', fn, context);\r
-               \r
+                   .on(link, 'click', L.DomEvent.preventDefault)\r
+                   .on(link, 'click', fn, context);\r
+\r
                return link;\r
        },\r
 \r
@@ -79,15 +90,15 @@ L.Control.Zoomslider = L.Control.extend({
                        .on(this._knob, 'click', L.DomEvent.stopPropagation);\r
 \r
                var bounds = new L.Bounds(\r
-                       new L.Point(0, 0), \r
+                       new L.Point(0, 0),\r
                        new L.Point(0, this._sliderHeight)\r
                );\r
-               var draggable = new L.BoundedDraggable(this._knob, \r
-                                                                                          this._knob, \r
+               var draggable = new L.BoundedDraggable(this._knob,\r
+                                                                                          this._knob,\r
                                                                                           bounds)\r
                        .on('drag', this._snap, this)\r
                        .on('dragend', this._setZoom, this);\r
-               \r
+\r
                return draggable;\r
        },\r
 \r
@@ -100,9 +111,9 @@ L.Control.Zoomslider = L.Control.extend({
 \r
        _onSliderClick: function(e){\r
                var first = (e.touches && e.touches.length === 1 ? e.touches[0] : e);\r
-           var offset = first.offsetY \r
+           var offset = first.offsetY\r
                        ? first.offsetY\r
-                       : L.DomEvent.getMousePosition(first).y \r
+                       : L.DomEvent.getMousePosition(first).y\r
                        - L.DomUtil.getViewportOffset(this._knob).y;\r
                var value = this._posToSliderValue(offset - this._knob.offsetHeight / 2);\r
                this._snapToSliderValue(value);\r
@@ -110,18 +121,19 @@ L.Control.Zoomslider = L.Control.extend({
        },\r
 \r
        _posToSliderValue: function(pos) {\r
-               pos = isNaN(pos) \r
+               pos = isNaN(pos)\r
                        ? L.DomUtil.getPosition(this._knob).y\r
-                       : pos\r
+                       : pos;\r
                return Math.round( (this._sliderHeight - pos) / this.options.stepHeight);\r
        },\r
 \r
        _snapToSliderValue: function(sliderValue) {\r
+               this._updateDisabled();\r
                if(this._knob) {\r
-                       sliderValue = isNaN(sliderValue) \r
+                       sliderValue = isNaN(sliderValue)\r
                                ? this._getSliderValue()\r
                                : sliderValue;\r
-                       var y = this._sliderHeight \r
+                       var y = this._sliderHeight\r
                                - (sliderValue * this.options.stepHeight);\r
                        L.DomUtil.setPosition(this._knob, new L.Point(0, y));\r
                }\r
@@ -134,6 +146,21 @@ L.Control.Zoomslider = L.Control.extend({
        },\r
        _getSliderValue: function(){\r
                return this._toSliderValue(this._map.getZoom());\r
+       },\r
+\r
+       _updateDisabled: function () {\r
+               var map = this._map,\r
+                       className = 'leaflet-control-zoomslider-disabled';\r
+\r
+               L.DomUtil.removeClass(this._zoomInButton, className);\r
+               L.DomUtil.removeClass(this._zoomOutButton, className);\r
+\r
+               if (map.getZoom() === map.getMinZoom()) {\r
+                       L.DomUtil.addClass(this._zoomOutButton, className);\r
+               }\r
+               if (map.getZoom() === map.getMaxZoom()) {\r
+                       L.DomUtil.addClass(this._zoomInButton, className);\r
+               }\r
        }\r
 });\r
 \r
@@ -144,8 +171,7 @@ L.Map.mergeOptions({
 \r
 L.Map.addInitHook(function () {\r
     if (this.options.zoomsliderControl) {\r
-               this.zoomsliderControl = new L.Control.Zoomslider();\r
-               this.addControl(this.zoomsliderControl);\r
+               L.control.zoomslider().addTo(this);\r
        }\r
 });\r
 \r
@@ -163,7 +189,7 @@ L.BoundedDraggable = L.Draggable.extend({
                                this._newPos = this._fitPoint(this._newPos);\r
                        }\r
                }, this);\r
-       }, \r
+       },\r
        _fitPoint: function(point){\r
                var closest = new L.Point(\r
                        Math.min(point.x, this._bounds.max.x),\r