From 00c8a5845ecce5cd16c390fca0d6ff7138c5339f Mon Sep 17 00:00:00 2001 From: Andreas Hocevar Date: Thu, 8 Jun 2017 17:29:19 +0200 Subject: [PATCH] Disable rotation for views with enableRotation: false --- src/ol/constraints.js | 29 -------- src/ol/interaction/dragrotate.js | 6 +- src/ol/interaction/dragrotateandzoom.js | 3 +- src/ol/interaction/pinchrotate.js | 6 +- src/ol/typedefs.js | 10 +++ src/ol/view.js | 16 ++++- .../ol/interaction/dragrotateandzoom.test.js | 69 +++++++++++++++++++ 7 files changed, 104 insertions(+), 35 deletions(-) delete mode 100644 src/ol/constraints.js diff --git a/src/ol/constraints.js b/src/ol/constraints.js deleted file mode 100644 index 75bdb805e5..0000000000 --- a/src/ol/constraints.js +++ /dev/null @@ -1,29 +0,0 @@ -goog.provide('ol.Constraints'); - - -/** - * @constructor - * @param {ol.CenterConstraintType} centerConstraint Center constraint. - * @param {ol.ResolutionConstraintType} resolutionConstraint - * Resolution constraint. - * @param {ol.RotationConstraintType} rotationConstraint - * Rotation constraint. - */ -ol.Constraints = function(centerConstraint, resolutionConstraint, rotationConstraint) { - - /** - * @type {ol.CenterConstraintType} - */ - this.center = centerConstraint; - - /** - * @type {ol.ResolutionConstraintType} - */ - this.resolution = resolutionConstraint; - - /** - * @type {ol.RotationConstraintType} - */ - this.rotation = rotationConstraint; - -}; diff --git a/src/ol/interaction/dragrotate.js b/src/ol/interaction/dragrotate.js index e79beeebd3..c5114e4f59 100644 --- a/src/ol/interaction/dragrotate.js +++ b/src/ol/interaction/dragrotate.js @@ -1,6 +1,7 @@ goog.provide('ol.interaction.DragRotate'); goog.require('ol'); +goog.require('ol.RotationConstraint'); goog.require('ol.ViewHint'); goog.require('ol.events.condition'); goog.require('ol.functions'); @@ -64,13 +65,16 @@ ol.interaction.DragRotate.handleDragEvent_ = function(mapBrowserEvent) { } var map = mapBrowserEvent.map; + var view = map.getView(); + if (view.getConstraints().rotation === ol.RotationConstraint.disable) { + return; + } var size = map.getSize(); var offset = mapBrowserEvent.pixel; var theta = Math.atan2(size[1] / 2 - offset[1], offset[0] - size[0] / 2); if (this.lastAngle_ !== undefined) { var delta = theta - this.lastAngle_; - var view = map.getView(); var rotation = view.getRotation(); ol.interaction.Interaction.rotateWithoutConstraints( view, rotation - delta); diff --git a/src/ol/interaction/dragrotateandzoom.js b/src/ol/interaction/dragrotateandzoom.js index 022855b887..a8c8eb12eb 100644 --- a/src/ol/interaction/dragrotateandzoom.js +++ b/src/ol/interaction/dragrotateandzoom.js @@ -1,6 +1,7 @@ goog.provide('ol.interaction.DragRotateAndZoom'); goog.require('ol'); +goog.require('ol.RotationConstraint'); goog.require('ol.ViewHint'); goog.require('ol.events.condition'); goog.require('ol.interaction.Interaction'); @@ -85,7 +86,7 @@ ol.interaction.DragRotateAndZoom.handleDragEvent_ = function(mapBrowserEvent) { var theta = Math.atan2(deltaY, deltaX); var magnitude = Math.sqrt(deltaX * deltaX + deltaY * deltaY); var view = map.getView(); - if (this.lastAngle_ !== undefined) { + if (view.getConstraints().rotation !== ol.RotationConstraint.disable && this.lastAngle_ !== undefined) { var angleDelta = theta - this.lastAngle_; ol.interaction.Interaction.rotateWithoutConstraints( view, view.getRotation() - angleDelta); diff --git a/src/ol/interaction/pinchrotate.js b/src/ol/interaction/pinchrotate.js index d312e76733..4f41baf5e8 100644 --- a/src/ol/interaction/pinchrotate.js +++ b/src/ol/interaction/pinchrotate.js @@ -5,6 +5,7 @@ goog.require('ol.ViewHint'); goog.require('ol.functions'); goog.require('ol.interaction.Interaction'); goog.require('ol.interaction.Pointer'); +goog.require('ol.RotationConstraint'); /** @@ -95,6 +96,10 @@ ol.interaction.PinchRotate.handleDragEvent_ = function(mapBrowserEvent) { this.lastAngle_ = angle; var map = mapBrowserEvent.map; + var view = map.getView(); + if (view.getConstraints().rotation === ol.RotationConstraint.disable) { + return; + } // rotate anchor point. // FIXME: should be the intersection point between the lines: @@ -107,7 +112,6 @@ ol.interaction.PinchRotate.handleDragEvent_ = function(mapBrowserEvent) { // rotate if (this.rotating_) { - var view = map.getView(); var rotation = view.getRotation(); map.render(); ol.interaction.Interaction.rotateWithoutConstraints(view, diff --git a/src/ol/typedefs.js b/src/ol/typedefs.js index c6bb11c223..65de15bce1 100644 --- a/src/ol/typedefs.js +++ b/src/ol/typedefs.js @@ -130,6 +130,16 @@ ol.Color; ol.ColorLike; +/** + * @typedef {{ + * center: ol.CenterConstraintType, + * resolution: ol.ResolutionConstraintType, + * rotation: ol.RotationConstraintType + * }} + */ +ol.Constraints; + + /** * An array of numbers representing an xy coordinate. Example: `[16, 48]`. * @typedef {Array.} diff --git a/src/ol/view.js b/src/ol/view.js index e88dc759cd..ec8415b3b8 100644 --- a/src/ol/view.js +++ b/src/ol/view.js @@ -2,7 +2,6 @@ goog.provide('ol.View'); goog.require('ol'); goog.require('ol.CenterConstraint'); -goog.require('ol.Constraints'); goog.require('ol.Object'); goog.require('ol.ResolutionConstraint'); goog.require('ol.RotationConstraint'); @@ -169,8 +168,11 @@ ol.View.prototype.applyOptions_ = function(options) { * @private * @type {ol.Constraints} */ - this.constraints_ = new ol.Constraints( - centerConstraint, resolutionConstraint, rotationConstraint); + this.constraints_ = { + center: centerConstraint, + resolution: resolutionConstraint, + rotation: rotationConstraint + }; if (options.resolution !== undefined) { properties[ol.ViewProperty.RESOLUTION] = options.resolution; @@ -528,6 +530,14 @@ ol.View.prototype.getCenter = function() { }; +/** + * @return {ol.Constraints} Constraints. + */ +ol.View.prototype.getConstraints = function() { + return this.constraints_; +}; + + /** * @param {Array.=} opt_hints Destination array. * @return {Array.} Hint. diff --git a/test/spec/ol/interaction/dragrotateandzoom.test.js b/test/spec/ol/interaction/dragrotateandzoom.test.js index a84fb7712b..a21438639b 100644 --- a/test/spec/ol/interaction/dragrotateandzoom.test.js +++ b/test/spec/ol/interaction/dragrotateandzoom.test.js @@ -1,6 +1,12 @@ goog.provide('ol.test.interaction.DragRotateAndZoom'); +goog.require('ol.Map'); +goog.require('ol.MapBrowserPointerEvent'); +goog.require('ol.View'); goog.require('ol.interaction.DragRotateAndZoom'); +goog.require('ol.layer.Vector'); +goog.require('ol.pointer.PointerEvent'); +goog.require('ol.source.Vector'); describe('ol.interaction.DragRotateAndZoom', function() { @@ -13,4 +19,67 @@ describe('ol.interaction.DragRotateAndZoom', function() { }); + describe('#handleDragEvent_()', function() { + + var target, map, interaction; + + var width = 360; + var height = 180; + + beforeEach(function(done) { + target = document.createElement('div'); + var style = target.style; + style.position = 'absolute'; + style.left = '-1000px'; + style.top = '-1000px'; + style.width = width + 'px'; + style.height = height + 'px'; + document.body.appendChild(target); + var source = new ol.source.Vector(); + var layer = new ol.layer.Vector({source: source}); + interaction = new ol.interaction.DragRotateAndZoom(); + map = new ol.Map({ + target: target, + layers: [layer], + interactions: [interaction], + view: new ol.View({ + projection: 'EPSG:4326', + center: [0, 0], + resolution: 1 + }) + }); + map.once('postrender', function() { + done(); + }); + }); + + afterEach(function() { + map.dispose(); + document.body.removeChild(target); + }); + + it('does not rotate when rotation is disabled on the view', function() { + var event = new ol.MapBrowserPointerEvent('pointermove', map, + new ol.pointer.PointerEvent('pointermove', {clientX: 20, clientY: 10}, {pointerType: 'mouse'}), + true); + interaction.lastAngle_ = Math.PI; + var spy = sinon.spy(ol.interaction.Interaction, 'rotateWithoutConstraints'); + interaction.handleDragEvent_(event); + expect(spy.callCount).to.be(1); + expect(interaction.lastAngle_).to.be(-0.8308214428190254); + map.setView(new ol.View({ + projection: 'EPSG:4326', + center: [0, 0], + resolution: 1, + enableRotation: false + })); + event = new ol.MapBrowserPointerEvent('pointermove', map, + new ol.pointer.PointerEvent('pointermove', {clientX: 24, clientY: 16}, {pointerType: 'mouse'}), + true); + interaction.handleDragEvent_(event); + expect(spy.callCount).to.be(1); + ol.interaction.Interaction.rotateWithoutConstraints.restore(); + }); + }); + });