diff --git a/src/ol.js b/src/ol.js index 0e07878d04..e356047ef1 100644 --- a/src/ol.js +++ b/src/ol.js @@ -6,6 +6,7 @@ goog.require('ol.control.Navigation'); goog.require('ol.control.Zoom'); goog.require('ol.event.Drag'); goog.require('ol.event.Events'); +goog.require('ol.event.Scroll'); goog.require("ol.map"); goog.require("ol.loc"); goog.require("ol.feature"); diff --git a/src/ol/Map.js b/src/ol/Map.js index 6c1b2d7be3..3611cab0f1 100644 --- a/src/ol/Map.js +++ b/src/ol/Map.js @@ -99,7 +99,7 @@ ol.Map = function() { * @type {ol.event.Events} */ this.events_ = new ol.event.Events( - this, undefined, false, ['drag'] + this, undefined, false, ['drag', 'scroll'] ); /** @@ -427,7 +427,7 @@ ol.Map.prototype.getViewportPosition = function(loc) { * @returns {Element} the map overlay element */ ol.Map.prototype.getMapOverlay = function() { - return this.mapOverlay_ + return this.mapOverlay_; }; /** diff --git a/src/ol/control/Navigation.js b/src/ol/control/Navigation.js index e87eb7300c..1abefd4d15 100644 --- a/src/ol/control/Navigation.js +++ b/src/ol/control/Navigation.js @@ -27,7 +27,9 @@ goog.inherits(ol.control.Navigation, ol.control.Control); ol.control.Navigation.prototype.activate = function() { var active = goog.base(this, 'activate'); if (active) { - this.getMap().getEvents().register("drag", this.moveMap, this); + var events = this.getMap().getEvents(); + events.register("drag", this.moveMap, this); + events.register("scroll", this.zoomMap, this); } return active; }; @@ -36,7 +38,9 @@ ol.control.Navigation.prototype.activate = function() { ol.control.Navigation.prototype.deactivate = function() { var inactive = goog.base(this, 'deactivate'); if (inactive) { - this.getMap().getEvents().unregister("drag", this.moveMap, this); + var events = this.getMap().getEvents(); + events.unregister("drag", this.moveMap, this); + events.unregister("scroll", this.zoomMap, this); } return inactive; }; @@ -45,7 +49,21 @@ ol.control.Navigation.prototype.deactivate = function() { * @param {Object} evt */ ol.control.Navigation.prototype.moveMap = function(evt) { - this.getMap().moveByPx(evt.dx, evt.dy); + this.getMap().moveByPx(evt.deltaX, evt.deltaY); + return false; +}; + +/** + * @param {Object} evt + */ +ol.control.Navigation.prototype.zoomMap = function(evt) { + var map = this.getMap(), + delta = ((evt.deltaY / 3) | 0); + if (Math.abs(delta) > 0) { + map.setZoom(map.getZoom() - delta); + console.log(map.getZoom()); + } + evt.preventDefault(); return false; }; diff --git a/src/ol/event/Drag.js b/src/ol/event/Drag.js index 183d3e705d..2f1a8ba552 100644 --- a/src/ol/event/Drag.js +++ b/src/ol/event/Drag.js @@ -8,6 +8,10 @@ goog.require('goog.fx.Dragger.EventType'); /** + * Event sequence that provides a 'dragstart', 'drag' and 'dragend' events. + * Event objects of the 'drag' events have 'deltaX' and 'deltaY' values with + * the relative pixel movement since the previous 'drag' or 'dragstart' event. + * * @constructor * @param {ol.event.Events} target The Events instance that handles events. * @implements {ol.event.ISequence} @@ -34,8 +38,8 @@ ol.event.Drag = function(target) { }); dragger.addEventListener(goog.fx.Dragger.EventType.DRAG, function(evt) { evt.target = element; - evt.dx = evt.clientX - previousX; - evt.dy = evt.clientY - previousY; + evt.deltaX = evt.clientX - previousX; + evt.deltaY = evt.clientY - previousY; previousX = evt.clientX; previousY = evt.clientY; target.triggerEvent(evt.type, evt); diff --git a/src/ol/event/Scroll.js b/src/ol/event/Scroll.js new file mode 100644 index 0000000000..0f499cac0a --- /dev/null +++ b/src/ol/event/Scroll.js @@ -0,0 +1,43 @@ +goog.provide('ol.event.Scroll'); + +goog.require('ol.event.ISequence'); +goog.require('ol.event'); +goog.require('goog.events.MouseWheelHandler'); + + +/** + * Event sequence that provides a 'scroll' event. Event objects have 'deltaX' + * and 'deltaY' values with the scroll delta since the previous 'scroll' event. + * + * @constructor + * @param {ol.event.Events} target The Events instance that handles events. + * @implements {ol.event.ISequence} + * @export + */ +ol.event.Scroll = function(target) { + var element = target.getElement(), + handler = new goog.events.MouseWheelHandler(element); + + /** + * @private + * @type {goog.events.MouseWheelHandler} + */ + this.handler_ = handler; + + goog.events.listen(handler, + goog.events.MouseWheelHandler.EventType.MOUSEWHEEL, + function(evt) { + evt.type = 'scroll'; + evt.target = element; + target.triggerEvent(evt.type, evt); + } + ); +}; + +/** @inheritDoc */ +ol.event.Scroll.prototype.destroy = function() { + this.handler_.dispose(); +}; + + +ol.event.addSequenceProvider('scroll', ol.event.Scroll); \ No newline at end of file