[76] | 1 | /* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for |
---|
| 2 | * full list of contributors). Published under the Clear BSD license. |
---|
| 3 | * See http://svn.openlayers.org/trunk/openlayers/license.txt for the |
---|
| 4 | * full text of the license. */ |
---|
| 5 | |
---|
| 6 | /** |
---|
| 7 | * @requires OpenLayers/Handler.js |
---|
| 8 | */ |
---|
| 9 | |
---|
| 10 | /** |
---|
| 11 | * Class: OpenLayers.Handler.MouseWheel |
---|
| 12 | * Handler for wheel up/down events. |
---|
| 13 | * |
---|
| 14 | * Inherits from: |
---|
| 15 | * - <OpenLayers.Handler> |
---|
| 16 | */ |
---|
| 17 | OpenLayers.Handler.MouseWheel = OpenLayers.Class(OpenLayers.Handler, { |
---|
| 18 | /** |
---|
| 19 | * Property: wheelListener |
---|
| 20 | * {function} |
---|
| 21 | */ |
---|
| 22 | wheelListener: null, |
---|
| 23 | |
---|
| 24 | /** |
---|
| 25 | * Property: mousePosition |
---|
| 26 | * {<OpenLayers.Pixel>} mousePosition is necessary because |
---|
| 27 | * evt.clientX/Y is buggy in Moz on wheel events, so we cache and use the |
---|
| 28 | * value from the last mousemove. |
---|
| 29 | */ |
---|
| 30 | mousePosition: null, |
---|
| 31 | |
---|
| 32 | /** |
---|
| 33 | * Property: interval |
---|
| 34 | * {Integer} In order to increase server performance, an interval (in |
---|
| 35 | * milliseconds) can be set to reduce the number of up/down events |
---|
| 36 | * called. If set, a new up/down event will not be set until the |
---|
| 37 | * interval has passed. |
---|
| 38 | * Defaults to 0, meaning no interval. |
---|
| 39 | */ |
---|
| 40 | interval: 0, |
---|
| 41 | |
---|
| 42 | /** |
---|
| 43 | * Property: delta |
---|
| 44 | * {Integer} When interval is set, delta collects the mousewheel z-deltas |
---|
| 45 | * of the events that occur within the interval. |
---|
| 46 | * See also the cumulative option |
---|
| 47 | */ |
---|
| 48 | delta: 0, |
---|
| 49 | |
---|
| 50 | /** |
---|
| 51 | * Property: cumulative |
---|
| 52 | * {Boolean} When interval is set: true to collect all the mousewheel |
---|
| 53 | * z-deltas, false to only record the delta direction (positive or |
---|
| 54 | * negative) |
---|
| 55 | */ |
---|
| 56 | cumulative: true, |
---|
| 57 | |
---|
| 58 | /** |
---|
| 59 | * Constructor: OpenLayers.Handler.MouseWheel |
---|
| 60 | * |
---|
| 61 | * Parameters: |
---|
| 62 | * control - {<OpenLayers.Control>} |
---|
| 63 | * callbacks - {Object} An object containing a single function to be |
---|
| 64 | * called when the drag operation is finished. |
---|
| 65 | * The callback should expect to recieve a single |
---|
| 66 | * argument, the point geometry. |
---|
| 67 | * options - {Object} |
---|
| 68 | */ |
---|
| 69 | initialize: function(control, callbacks, options) { |
---|
| 70 | OpenLayers.Handler.prototype.initialize.apply(this, arguments); |
---|
| 71 | this.wheelListener = OpenLayers.Function.bindAsEventListener( |
---|
| 72 | this.onWheelEvent, this |
---|
| 73 | ); |
---|
| 74 | }, |
---|
| 75 | |
---|
| 76 | /** |
---|
| 77 | * Method: destroy |
---|
| 78 | */ |
---|
| 79 | destroy: function() { |
---|
| 80 | OpenLayers.Handler.prototype.destroy.apply(this, arguments); |
---|
| 81 | this.wheelListener = null; |
---|
| 82 | }, |
---|
| 83 | |
---|
| 84 | /** |
---|
| 85 | * Mouse ScrollWheel code thanks to http://adomas.org/javascript-mouse-wheel/ |
---|
| 86 | */ |
---|
| 87 | |
---|
| 88 | /** |
---|
| 89 | * Method: onWheelEvent |
---|
| 90 | * Catch the wheel event and handle it xbrowserly |
---|
| 91 | * |
---|
| 92 | * Parameters: |
---|
| 93 | * e - {Event} |
---|
| 94 | */ |
---|
| 95 | onWheelEvent: function(e){ |
---|
| 96 | |
---|
| 97 | // make sure we have a map and check keyboard modifiers |
---|
| 98 | if (!this.map || !this.checkModifiers(e)) { |
---|
| 99 | return; |
---|
| 100 | } |
---|
| 101 | |
---|
| 102 | // Ride up the element's DOM hierarchy to determine if it or any of |
---|
| 103 | // its ancestors was: |
---|
| 104 | // * specifically marked as scrollable |
---|
| 105 | // * one of our layer divs |
---|
| 106 | // * the map div |
---|
| 107 | // |
---|
| 108 | var overScrollableDiv = false; |
---|
| 109 | var overLayerDiv = false; |
---|
| 110 | var overMapDiv = false; |
---|
| 111 | |
---|
| 112 | var elem = OpenLayers.Event.element(e); |
---|
| 113 | while((elem != null) && !overMapDiv && !overScrollableDiv) { |
---|
| 114 | |
---|
| 115 | if (!overScrollableDiv) { |
---|
| 116 | try { |
---|
| 117 | if (elem.currentStyle) { |
---|
| 118 | overflow = elem.currentStyle["overflow"]; |
---|
| 119 | } else { |
---|
| 120 | var style = |
---|
| 121 | document.defaultView.getComputedStyle(elem, null); |
---|
| 122 | var overflow = style.getPropertyValue("overflow"); |
---|
| 123 | } |
---|
| 124 | overScrollableDiv = ( overflow && |
---|
| 125 | (overflow == "auto") || (overflow == "scroll") ); |
---|
| 126 | } catch(err) { |
---|
| 127 | //sometimes when scrolling in a popup, this causes |
---|
| 128 | // obscure browser error |
---|
| 129 | } |
---|
| 130 | } |
---|
| 131 | |
---|
| 132 | if (!overLayerDiv) { |
---|
| 133 | for(var i=0, len=this.map.layers.length; i<len; i++) { |
---|
| 134 | // Are we in the layer div? Note that we have two cases |
---|
| 135 | // here: one is to catch EventPane layers, which have a |
---|
| 136 | // pane above the layer (layer.pane) |
---|
| 137 | if (elem == this.map.layers[i].div |
---|
| 138 | || elem == this.map.layers[i].pane) { |
---|
| 139 | overLayerDiv = true; |
---|
| 140 | break; |
---|
| 141 | } |
---|
| 142 | } |
---|
| 143 | } |
---|
| 144 | overMapDiv = (elem == this.map.div); |
---|
| 145 | |
---|
| 146 | elem = elem.parentNode; |
---|
| 147 | } |
---|
| 148 | |
---|
| 149 | // Logic below is the following: |
---|
| 150 | // |
---|
| 151 | // If we are over a scrollable div or not over the map div: |
---|
| 152 | // * do nothing (let the browser handle scrolling) |
---|
| 153 | // |
---|
| 154 | // otherwise |
---|
| 155 | // |
---|
| 156 | // If we are over the layer div: |
---|
| 157 | // * zoom/in out |
---|
| 158 | // then |
---|
| 159 | // * kill event (so as not to also scroll the page after zooming) |
---|
| 160 | // |
---|
| 161 | // otherwise |
---|
| 162 | // |
---|
| 163 | // Kill the event (dont scroll the page if we wheel over the |
---|
| 164 | // layerswitcher or the pan/zoom control) |
---|
| 165 | // |
---|
| 166 | if (!overScrollableDiv && overMapDiv) { |
---|
| 167 | if (overLayerDiv) { |
---|
| 168 | var delta = 0; |
---|
| 169 | if (!e) { |
---|
| 170 | e = window.event; |
---|
| 171 | } |
---|
| 172 | if (e.wheelDelta) { |
---|
| 173 | delta = e.wheelDelta/120; |
---|
| 174 | if (window.opera && window.opera.version() < 9.2) { |
---|
| 175 | delta = -delta; |
---|
| 176 | } |
---|
| 177 | } else if (e.detail) { |
---|
| 178 | delta = -e.detail / 3; |
---|
| 179 | } |
---|
| 180 | this.delta = this.delta + delta; |
---|
| 181 | |
---|
| 182 | if(this.interval) { |
---|
| 183 | window.clearTimeout(this._timeoutId); |
---|
| 184 | this._timeoutId = window.setTimeout( |
---|
| 185 | OpenLayers.Function.bind(function(){ |
---|
| 186 | this.wheelZoom(e); |
---|
| 187 | }, this), |
---|
| 188 | this.interval |
---|
| 189 | ); |
---|
| 190 | } else { |
---|
| 191 | this.wheelZoom(e); |
---|
| 192 | } |
---|
| 193 | } |
---|
| 194 | OpenLayers.Event.stop(e); |
---|
| 195 | } |
---|
| 196 | }, |
---|
| 197 | |
---|
| 198 | /** |
---|
| 199 | * Method: wheelZoom |
---|
| 200 | * Given the wheel event, we carry out the appropriate zooming in or out, |
---|
| 201 | * based on the 'wheelDelta' or 'detail' property of the event. |
---|
| 202 | * |
---|
| 203 | * Parameters: |
---|
| 204 | * e - {Event} |
---|
| 205 | */ |
---|
| 206 | wheelZoom: function(e) { |
---|
| 207 | var delta = this.delta; |
---|
| 208 | this.delta = 0; |
---|
| 209 | |
---|
| 210 | if (delta) { |
---|
| 211 | // add the mouse position to the event because mozilla has |
---|
| 212 | // a bug with clientX and clientY (see |
---|
| 213 | // https://bugzilla.mozilla.org/show_bug.cgi?id=352179) |
---|
| 214 | // getLonLatFromViewPortPx(e) returns wrong values |
---|
| 215 | if (this.mousePosition) { |
---|
| 216 | e.xy = this.mousePosition; |
---|
| 217 | } |
---|
| 218 | if (!e.xy) { |
---|
| 219 | // If the mouse hasn't moved over the map yet, then |
---|
| 220 | // we don't have a mouse position (in FF), so we just |
---|
| 221 | // act as if the mouse was at the center of the map. |
---|
| 222 | // Note that we can tell we are in the map -- and |
---|
| 223 | // this.map is ensured to be true above. |
---|
| 224 | e.xy = this.map.getPixelFromLonLat( |
---|
| 225 | this.map.getCenter() |
---|
| 226 | ); |
---|
| 227 | } |
---|
| 228 | if (delta < 0) { |
---|
| 229 | this.callback("down", [e, this.cumulative ? delta : -1]); |
---|
| 230 | } else { |
---|
| 231 | this.callback("up", [e, this.cumulative ? delta : 1]); |
---|
| 232 | } |
---|
| 233 | } |
---|
| 234 | }, |
---|
| 235 | |
---|
| 236 | /** |
---|
| 237 | * Method: mousemove |
---|
| 238 | * Update the stored mousePosition on every move. |
---|
| 239 | * |
---|
| 240 | * Parameters: |
---|
| 241 | * evt - {Event} The browser event |
---|
| 242 | * |
---|
| 243 | * Returns: |
---|
| 244 | * {Boolean} Allow event propagation |
---|
| 245 | */ |
---|
| 246 | mousemove: function (evt) { |
---|
| 247 | this.mousePosition = evt.xy; |
---|
| 248 | }, |
---|
| 249 | |
---|
| 250 | /** |
---|
| 251 | * Method: activate |
---|
| 252 | */ |
---|
| 253 | activate: function (evt) { |
---|
| 254 | if (OpenLayers.Handler.prototype.activate.apply(this, arguments)) { |
---|
| 255 | //register mousewheel events specifically on the window and document |
---|
| 256 | var wheelListener = this.wheelListener; |
---|
| 257 | OpenLayers.Event.observe(window, "DOMMouseScroll", wheelListener); |
---|
| 258 | OpenLayers.Event.observe(window, "mousewheel", wheelListener); |
---|
| 259 | OpenLayers.Event.observe(document, "mousewheel", wheelListener); |
---|
| 260 | return true; |
---|
| 261 | } else { |
---|
| 262 | return false; |
---|
| 263 | } |
---|
| 264 | }, |
---|
| 265 | |
---|
| 266 | /** |
---|
| 267 | * Method: deactivate |
---|
| 268 | */ |
---|
| 269 | deactivate: function (evt) { |
---|
| 270 | if (OpenLayers.Handler.prototype.deactivate.apply(this, arguments)) { |
---|
| 271 | // unregister mousewheel events specifically on the window and document |
---|
| 272 | var wheelListener = this.wheelListener; |
---|
| 273 | OpenLayers.Event.stopObserving(window, "DOMMouseScroll", wheelListener); |
---|
| 274 | OpenLayers.Event.stopObserving(window, "mousewheel", wheelListener); |
---|
| 275 | OpenLayers.Event.stopObserving(document, "mousewheel", wheelListener); |
---|
| 276 | return true; |
---|
| 277 | } else { |
---|
| 278 | return false; |
---|
| 279 | } |
---|
| 280 | }, |
---|
| 281 | |
---|
| 282 | CLASS_NAME: "OpenLayers.Handler.MouseWheel" |
---|
| 283 | }); |
---|