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 | }); |
---|