From 0fd122a1ed8bd3d0cdbf2404cf62a17b0c131544 Mon Sep 17 00:00:00 2001 From: Tom Payne Date: Sat, 4 Aug 2012 15:27:23 +0200 Subject: [PATCH] Add and use ol.Constraints --- src/ol/base/createmap.js | 20 ++++--- src/ol/control/constraints.js | 28 +++++++++ src/ol/control/control.js | 76 +++++++++++++++++++++++- src/ol/control/dblclickzoom.js | 28 +++------ src/ol/control/drag.js | 6 +- src/ol/control/dragpan.js | 22 ++----- src/ol/control/keyboardpan.js | 23 ++----- src/ol/control/keyboardzoom.js | 18 ++---- src/ol/control/mousewheelzoom.js | 27 +++------ src/ol/control/resolutionconstraint.js | 7 +-- src/ol/control/shiftdragrotate.js | 5 +- src/ol/control/shiftdragrotateandzoom.js | 24 ++------ src/ol/control/shiftdragzoom.js | 26 ++------ 13 files changed, 163 insertions(+), 147 deletions(-) create mode 100644 src/ol/control/constraints.js diff --git a/src/ol/base/createmap.js b/src/ol/base/createmap.js index 51a82fc814..d1e1cdddcd 100644 --- a/src/ol/base/createmap.js +++ b/src/ol/base/createmap.js @@ -7,6 +7,7 @@ goog.require('ol.Map'); goog.require('ol.MapProperty'); goog.require('ol.Projection'); goog.require('ol.control.CenterConstraint'); +goog.require('ol.control.Constraints'); goog.require('ol.control.DblClickZoom'); goog.require('ol.control.DragPan'); goog.require('ol.control.KeyboardPan'); @@ -77,21 +78,22 @@ ol.createMap = function(target, opt_values, opt_rendererHints) { goog.object.extend(values, opt_values); } - var centerConstraint = ol.control.CenterConstraint.snapToPixel; - // FIXME this should be a configuration option + var centerConstraint = ol.control.CenterConstraint.snapToPixel; var resolutionConstraint = ol.control.ResolutionConstraint.createSnapToPower( 2, ol.Projection.EPSG_3857_HALF_SIZE / 128); + var constraints = new ol.control.Constraints( + centerConstraint, resolutionConstraint); if (!goog.object.containsKey(values, ol.MapProperty.CONTROLS)) { var controls = new ol.Collection(); - controls.push(new ol.control.DblClickZoom(resolutionConstraint)); - controls.push(new ol.control.DragPan(centerConstraint)); - controls.push(new ol.control.KeyboardPan(centerConstraint)); - controls.push(new ol.control.KeyboardZoom(resolutionConstraint)); - controls.push(new ol.control.MouseWheelZoom(resolutionConstraint)); - controls.push(new ol.control.ShiftDragRotateAndZoom(resolutionConstraint)); - controls.push(new ol.control.ShiftDragZoom(resolutionConstraint)); + controls.push(new ol.control.DblClickZoom(constraints)); + controls.push(new ol.control.DragPan(constraints)); + controls.push(new ol.control.KeyboardPan(constraints)); + controls.push(new ol.control.KeyboardZoom(constraints)); + controls.push(new ol.control.MouseWheelZoom(constraints)); + controls.push(new ol.control.ShiftDragRotateAndZoom(constraints)); + controls.push(new ol.control.ShiftDragZoom(constraints)); values[ol.MapProperty.CONTROLS] = controls; } diff --git a/src/ol/control/constraints.js b/src/ol/control/constraints.js new file mode 100644 index 0000000000..df47aca5fe --- /dev/null +++ b/src/ol/control/constraints.js @@ -0,0 +1,28 @@ +// FIXME add rotation constraint + +goog.provide('ol.control.Constraints'); + +goog.require('ol.control.CenterConstraintType'); +goog.require('ol.control.ResolutionConstraintType'); + + + +/** + * @constructor + * @param {ol.control.CenterConstraintType} centerConstraint Center constraint. + * @param {ol.control.ResolutionConstraintType} resolutionConstraint + * Resolution constraint. + */ +ol.control.Constraints = function(centerConstraint, resolutionConstraint) { + + /** + * @type {ol.control.CenterConstraintType} + */ + this.center = centerConstraint; + + /** + * @type {ol.control.ResolutionConstraintType} + */ + this.resolution = resolutionConstraint; + +}; diff --git a/src/ol/control/control.js b/src/ol/control/control.js index c5a9a7b0e4..3488557d84 100644 --- a/src/ol/control/control.js +++ b/src/ol/control/control.js @@ -3,13 +3,22 @@ goog.provide('ol.Control'); goog.require('ol.MapBrowserEvent'); +goog.require('ol.control.Constraints'); /** * @constructor + * @param {ol.control.Constraints} constraints Constraints. */ -ol.Control = function() { +ol.Control = function(constraints) { + + /** + * @protected + * @type {ol.control.Constraints} + */ + this.constraints = constraints; + }; @@ -17,3 +26,68 @@ ol.Control = function() { * @param {ol.MapBrowserEvent} mapBrowserEvent Map browser event. */ ol.Control.prototype.handleMapBrowserEvent = goog.abstractMethod; + + +/** + * @param {ol.Map} map Map. + * @param {ol.Extent} extent Extent. + */ +ol.Control.prototype.fitExtent = function(map, extent) { + var resolution = map.getResolutionForExtent(extent); + resolution = this.constraints.resolution(resolution, 0); + var center = extent.getCenter(); + center = this.constraints.center(center, resolution, ol.Coordinate.ZERO); + map.withFrozenRendering(function() { + map.setCenter(center); + map.setResolution(resolution); + }); +}; + + +/** + * @param {ol.Map} map Map. + * @param {ol.Coordinate} delta Delta. + * @param {ol.Coordinate=} opt_anchor Anchor. + */ +ol.Control.prototype.pan = function(map, delta, opt_anchor) { + var center = opt_anchor ? opt_anchor : map.getCenter(); + var resolution = map.getResolution(); + center = this.constraints.center(center, resolution, delta); + map.setCenter(center); +}; + + +/** + * @param {ol.Map} map Map. + * @param {number|undefined} resolution Resolution. + */ +ol.Control.prototype.setResolution = function(map, resolution) { + resolution = this.constraints.resolution(resolution, 0); + map.setResolution(resolution); +}; + + +/** + * @param {ol.Map} map Map. + * @param {number} rotation Rotation. + */ +ol.Control.prototype.setRotation = function(map, rotation) { + // FIXME use a constraint + map.setRotation(rotation); +}; + + +/** + * @param {ol.Map} map Map. + * @param {number} delta Delta. + * @param {ol.Coordinate=} opt_anchor Anchor. + */ +ol.Control.prototype.zoom = function(map, delta, opt_anchor) { + //if (false && goog.isDef(opt_anchor)) { + // FIXME + //} else { + var resolution = map.getResolution(); + resolution = this.constraints.resolution(resolution, delta); + map.setResolution(resolution); + //} +}; diff --git a/src/ol/control/dblclickzoom.js b/src/ol/control/dblclickzoom.js index d7dce9767c..1ffef392f7 100644 --- a/src/ol/control/dblclickzoom.js +++ b/src/ol/control/dblclickzoom.js @@ -3,26 +3,17 @@ goog.provide('ol.control.DblClickZoom'); goog.require('goog.events.EventType'); goog.require('ol.Control'); goog.require('ol.MapBrowserEvent'); -goog.require('ol.control.ResolutionConstraintType'); +goog.require('ol.control.Constraints'); /** * @constructor * @extends {ol.Control} - * @param {ol.control.ResolutionConstraintType} resolutionConstraint - * Resolution constraint. + * @param {ol.control.Constraints} constraints Constraints. */ -ol.control.DblClickZoom = function(resolutionConstraint) { - - goog.base(this); - - /** - * @private - * @type {ol.control.ResolutionConstraintType} - */ - this.resolutionConstraint_ = resolutionConstraint; - +ol.control.DblClickZoom = function(constraints) { + goog.base(this, constraints); }; goog.inherits(ol.control.DblClickZoom, ol.Control); @@ -34,14 +25,9 @@ ol.control.DblClickZoom.prototype.handleMapBrowserEvent = function(mapBrowserEvent) { if (mapBrowserEvent.type == goog.events.EventType.DBLCLICK) { var map = mapBrowserEvent.map; - map.withFrozenRendering(function() { - // FIXME compute correct center for zoom - map.setCenter(mapBrowserEvent.getCoordinate()); - var browserEvent = mapBrowserEvent.browserEvent; - var delta = browserEvent.shiftKey ? -1 : 1; - var resolution = this.resolutionConstraint_(map.getResolution(), delta); - map.setResolution(resolution); - }, this); + var delta = mapBrowserEvent.browserEvent.shiftKey ? -1 : 1; + var anchor = mapBrowserEvent.getCoordinate(); + this.zoom(map, delta, anchor); mapBrowserEvent.preventDefault(); } }; diff --git a/src/ol/control/drag.js b/src/ol/control/drag.js index be8272c15b..da2f8eb05c 100644 --- a/src/ol/control/drag.js +++ b/src/ol/control/drag.js @@ -7,16 +7,18 @@ goog.require('goog.functions'); goog.require('ol.Control'); goog.require('ol.Coordinate'); goog.require('ol.MapBrowserEvent'); +goog.require('ol.control.Constraints'); /** * @constructor * @extends {ol.Control} + * @param {ol.control.Constraints} constraints Constraints. */ -ol.control.Drag = function() { +ol.control.Drag = function(constraints) { - goog.base(this); + goog.base(this, constraints); /** * @private diff --git a/src/ol/control/dragpan.js b/src/ol/control/dragpan.js index 7d4f7608d8..e30fb1fba2 100644 --- a/src/ol/control/dragpan.js +++ b/src/ol/control/dragpan.js @@ -4,8 +4,7 @@ goog.provide('ol.control.DragPan'); goog.require('ol.Coordinate'); goog.require('ol.MapBrowserEvent'); -goog.require('ol.control.CenterConstraint'); -goog.require('ol.control.CenterConstraintType'); +goog.require('ol.control.Constraints'); goog.require('ol.control.Drag'); @@ -13,20 +12,10 @@ goog.require('ol.control.Drag'); /** * @constructor * @extends {ol.control.Drag} - * @param {ol.control.CenterConstraintType=} opt_centerConstraint - * Center constraint. + * @param {ol.control.Constraints} constraints Constraints. */ -ol.control.DragPan = function(opt_centerConstraint) { - - goog.base(this); - - /** - * @private - * @type {ol.control.CenterConstraintType|undefined} - */ - this.centerConstraint_ = - opt_centerConstraint || ol.control.CenterConstraint.none; - +ol.control.DragPan = function(constraints) { + goog.base(this, constraints); }; goog.inherits(ol.control.DragPan, ol.control.Drag); @@ -39,8 +28,7 @@ ol.control.DragPan.prototype.handleDrag = function(mapBrowserEvent) { var resolution = map.getResolution(); var delta = new ol.Coordinate(-resolution * this.deltaX, resolution * this.deltaY); - var center = this.centerConstraint_(this.startCenter, resolution, delta); - map.setCenter(center); + this.pan(map, delta, this.startCenter); }; diff --git a/src/ol/control/keyboardpan.js b/src/ol/control/keyboardpan.js index cf8b507146..469a71eda7 100644 --- a/src/ol/control/keyboardpan.js +++ b/src/ol/control/keyboardpan.js @@ -3,28 +3,17 @@ goog.provide('ol.control.KeyboardPan'); goog.require('goog.events.KeyCodes'); goog.require('goog.events.KeyHandler.EventType'); goog.require('ol.Control'); -goog.require('ol.control.CenterConstraint'); -goog.require('ol.control.CenterConstraintType'); +goog.require('ol.control.Constraints'); /** * @constructor * @extends {ol.Control} - * @param {ol.control.CenterConstraintType=} opt_centerConstraint - * Center constraint. + * @param {ol.control.Constraints} constraints Constraints. */ -ol.control.KeyboardPan = function(opt_centerConstraint) { - - goog.base(this); - - /** - * @private - * @type {ol.control.CenterConstraintType} - */ - this.centerConstraint_ = opt_centerConstraint || - ol.control.CenterConstraint.none; - +ol.control.KeyboardPan = function(constraints) { + goog.base(this, constraints); }; goog.inherits(ol.control.KeyboardPan, ol.Control); @@ -43,7 +32,6 @@ ol.control.KeyboardPan.prototype.handleMapBrowserEvent = keyCode == goog.events.KeyCodes.RIGHT || keyCode == goog.events.KeyCodes.UP) { var map = mapBrowserEvent.map; - var center = map.getCenter().clone(); var resolution = map.getResolution(); var delta; if (keyCode == goog.events.KeyCodes.DOWN) { @@ -56,8 +44,7 @@ ol.control.KeyboardPan.prototype.handleMapBrowserEvent = goog.asserts.assert(keyCode == goog.events.KeyCodes.UP); delta = new ol.Coordinate(0, 16 * resolution); } - center = this.centerConstraint_(center, resolution, delta); - map.setCenter(center); + this.pan(map, delta); keyEvent.preventDefault(); mapBrowserEvent.preventDefault(); } diff --git a/src/ol/control/keyboardzoom.js b/src/ol/control/keyboardzoom.js index f944dcd6e8..c6cb3e2076 100644 --- a/src/ol/control/keyboardzoom.js +++ b/src/ol/control/keyboardzoom.js @@ -10,19 +10,10 @@ goog.require('ol.control.ResolutionConstraintType'); /** * @constructor * @extends {ol.Control} - * @param {ol.control.ResolutionConstraintType} resolutionConstraint - * Resolution constraint. + * @param {ol.control.Constraints} constraints Constraints. */ -ol.control.KeyboardZoom = function(resolutionConstraint) { - - goog.base(this); - - /** - * @private - * @type {ol.control.ResolutionConstraintType} - */ - this.resolutionConstraint_ = resolutionConstraint; - +ol.control.KeyboardZoom = function(constraints) { + goog.base(this, constraints); }; goog.inherits(ol.control.KeyboardZoom, ol.Control); @@ -39,8 +30,7 @@ ol.control.KeyboardZoom.prototype.handleMapBrowserEvent = if (charCode == '+'.charCodeAt(0) || charCode == '-'.charCodeAt(0)) { var map = mapBrowserEvent.map; var delta = charCode == '+'.charCodeAt(0) ? 1 : -1; - var resolution = this.resolutionConstraint_(map.getResolution(), delta); - map.setResolution(resolution); + this.zoom(map, delta); keyEvent.preventDefault(); mapBrowserEvent.preventDefault(); } diff --git a/src/ol/control/mousewheelzoom.js b/src/ol/control/mousewheelzoom.js index 4ca9102355..849a633cb4 100644 --- a/src/ol/control/mousewheelzoom.js +++ b/src/ol/control/mousewheelzoom.js @@ -3,26 +3,17 @@ goog.provide('ol.control.MouseWheelZoom'); goog.require('goog.events.MouseWheelEvent'); goog.require('goog.events.MouseWheelHandler.EventType'); goog.require('ol.MapBrowserEvent'); -goog.require('ol.control.ResolutionConstraintType'); +goog.require('ol.control.Constraints'); /** * @constructor * @extends {ol.Control} - * @param {ol.control.ResolutionConstraintType} resolutionConstraint - * Resolution constraint. + * @param {ol.control.Constraints} constraints Constraints. */ -ol.control.MouseWheelZoom = function(resolutionConstraint) { - - goog.base(this); - - /** - * @private - * @type {ol.control.ResolutionConstraintType} - */ - this.resolutionConstraint_ = resolutionConstraint; - +ol.control.MouseWheelZoom = function(constraints) { + goog.base(this, constraints); }; goog.inherits(ol.control.MouseWheelZoom, ol.Control); @@ -39,13 +30,9 @@ ol.control.MouseWheelZoom.prototype.handleMapBrowserEvent = mapBrowserEvent.browserEvent; goog.asserts.assert(mouseWheelEvent instanceof goog.events.MouseWheelEvent); if (mouseWheelEvent.deltaY !== 0) { - map.withFrozenRendering(function() { - // FIXME compute correct center for zoom - map.setCenter(mapBrowserEvent.getCoordinate()); - var delta = mouseWheelEvent.deltaY < 0 ? 1 : -1; - var resolution = this.resolutionConstraint_(map.getResolution(), delta); - map.setResolution(resolution); - }, this); + var delta = mouseWheelEvent.deltaY < 0 ? 1 : -1; + var anchor = mapBrowserEvent.getCoordinate(); + this.zoom(map, delta, anchor); mapBrowserEvent.preventDefault(); mouseWheelEvent.preventDefault(); } diff --git a/src/ol/control/resolutionconstraint.js b/src/ol/control/resolutionconstraint.js index 3373601d20..9959848733 100644 --- a/src/ol/control/resolutionconstraint.js +++ b/src/ol/control/resolutionconstraint.js @@ -19,10 +19,9 @@ ol.control.ResolutionConstraint.createSnapToResolutions = function(resolutions) { return function(resolution, delta) { if (goog.isDef(resolution)) { - var oldLevel = ol.array.linearFindNearest(resolutions, resolution); - var newLevel = goog.math.clamp( - oldLevel + delta, 0, resolutions.length - 1); - return resolutions[newLevel]; + var z = ol.array.linearFindNearest(resolutions, resolution); + z = goog.math.clamp(z + delta, 0, resolutions.length - 1); + return resolutions[z]; } else { return undefined; } diff --git a/src/ol/control/shiftdragrotate.js b/src/ol/control/shiftdragrotate.js index ec013a6b96..2faa029c84 100644 --- a/src/ol/control/shiftdragrotate.js +++ b/src/ol/control/shiftdragrotate.js @@ -8,9 +8,10 @@ goog.require('ol.control.Drag'); /** * @constructor * @extends {ol.control.Drag} + * @param {ol.control.Constraints} constraints Constraints. */ -ol.control.ShiftDragRotate = function() { - goog.base(this); +ol.control.ShiftDragRotate = function(constraints) { + goog.base(this, constraints); }; goog.inherits(ol.control.ShiftDragRotate, ol.control.Drag); diff --git a/src/ol/control/shiftdragrotateandzoom.js b/src/ol/control/shiftdragrotateandzoom.js index 21fcb9ab5f..5f3ebcc9b0 100644 --- a/src/ol/control/shiftdragrotateandzoom.js +++ b/src/ol/control/shiftdragrotateandzoom.js @@ -2,27 +2,18 @@ goog.provide('ol.control.ShiftDragRotateAndZoom'); goog.require('goog.math.Vec2'); goog.require('ol.MapBrowserEvent'); +goog.require('ol.control.Constraints'); goog.require('ol.control.Drag'); -goog.require('ol.control.ResolutionConstraintType'); /** * @constructor * @extends {ol.control.Drag} - * @param {ol.control.ResolutionConstraintType=} opt_resolutionConstraint - * Resolution constraint. + * @param {ol.control.Constraints} constraints Constraints. */ -ol.control.ShiftDragRotateAndZoom = function(opt_resolutionConstraint) { - - goog.base(this); - - /** - * @private - * @type {ol.control.ResolutionConstraintType|undefined} - */ - this.resolutionConstraint_ = opt_resolutionConstraint; - +ol.control.ShiftDragRotateAndZoom = function(constraints) { + goog.base(this, constraints); }; goog.inherits(ol.control.ShiftDragRotateAndZoom, ol.control.Drag); @@ -54,12 +45,9 @@ ol.control.ShiftDragRotateAndZoom.prototype.handleDrag = size.height / 2 - browserEvent.offsetY); var theta = Math.atan2(delta.y, delta.x); // FIXME this should use map.withFrozenRendering but an assertion fails :-( - map.setRotation(this.startRotation_ - theta); + this.setRotation(map, this.startRotation_ - theta); var resolution = this.startRatio_ * delta.magnitude(); - if (goog.isDef(this.resolutionConstraint_)) { - resolution = this.resolutionConstraint_(resolution, 0); - } - map.setResolution(resolution); + this.setResolution(map, resolution); }; diff --git a/src/ol/control/shiftdragzoom.js b/src/ol/control/shiftdragzoom.js index 1a6e931a03..71a04fd680 100644 --- a/src/ol/control/shiftdragzoom.js +++ b/src/ol/control/shiftdragzoom.js @@ -4,8 +4,8 @@ goog.provide('ol.control.ShiftDragZoom'); goog.require('ol.Extent'); goog.require('ol.MapBrowserEvent'); +goog.require('ol.control.Constraints'); goog.require('ol.control.Drag'); -goog.require('ol.control.ResolutionConstraintType'); /** @@ -25,19 +25,10 @@ ol.SHIFT_DRAG_ZOOM_HYSTERESIS_PIXELS_SQUARED = /** * @constructor * @extends {ol.control.Drag} - * @param {ol.control.ResolutionConstraintType=} opt_resolutionConstraint - * Resolution constraint. + * @param {ol.control.Constraints} constraints Constraints. */ -ol.control.ShiftDragZoom = function(opt_resolutionConstraint) { - - goog.base(this); - - /** - * @private - * @type {ol.control.ResolutionConstraintType|undefined} - */ - this.resolutionConstraint_ = opt_resolutionConstraint; - +ol.control.ShiftDragZoom = function(constraints) { + goog.base(this, constraints); }; goog.inherits(ol.control.ShiftDragZoom, ol.control.Drag); @@ -52,14 +43,7 @@ ol.control.ShiftDragZoom.prototype.handleDragEnd = function(mapBrowserEvent) { var extent = ol.Extent.boundingExtent( this.startCoordinate, mapBrowserEvent.getCoordinate()); - var resolution = map.getResolutionForExtent(extent); - if (goog.isDef(this.resolutionConstraint_)) { - resolution = this.resolutionConstraint_(resolution, 0); - } - map.withFrozenRendering(function() { - map.setCenter(extent.getCenter()); - map.setResolution(resolution); - }); + this.fitExtent(map, extent); } };