ashatora/openlayers
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

refactoring pointer interactions

Browse Source
This commit is contained in:
tsauerwein
2014-02-26 13:30:08 +01:00
parent fca9c50a3f
commit 411b7257cf
4 changed files with 42 additions and 39 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
src/ol/interaction/paninteraction.js
View File

@@ -13,8 +13,7 @@ goog.require('ol.interaction.PointerInteraction');
/**
* Allows the user to pan the map by touching and dragging
* on a touch screen.
* Allows the user to pan the map by dragging the map.
* @constructor
* @extends {ol.interaction.PointerInteraction}
* @param {olx.interaction.PanOptions=} opt_options Options.
@@ -64,8 +63,9 @@ goog.inherits(ol.interaction.Pan, ol.interaction.PointerInteraction);
* @inheritDoc
*/
ol.interaction.Pan.prototype.handlePointerDrag = function(mapBrowserEvent) {
goog.asserts.assert(this.targetTouches.length >= 1);
var centroid = ol.interaction.PointerInteraction.centroid(this.targetTouches);
goog.asserts.assert(this.targetPointers.length >= 1);
var centroid =
ol.interaction.PointerInteraction.centroid(this.targetPointers);
if (!goog.isNull(this.lastCentroid)) {
if (this.kinetic_) {
this.kinetic_.update(centroid[0], centroid[1]);
@@ -96,7 +96,7 @@ ol.interaction.Pan.prototype.handlePointerUp =
var map = mapBrowserEvent.map;
var view2D = map.getView().getView2D();
goog.asserts.assertInstanceof(view2D, ol.View2D);
if (this.targetTouches.length === 0) {
if (this.targetPointers.length === 0) {
if (!this.noKinetic_ && this.kinetic_ && this.kinetic_.end()) {
var distance = this.kinetic_.getDistance();
var angle = this.kinetic_.getAngle();
@@ -126,7 +126,7 @@ ol.interaction.Pan.prototype.handlePointerUp =
*/
ol.interaction.Pan.prototype.handlePointerDown =
function(mapBrowserEvent) {
if (this.targetTouches.length > 0 && this.condition_(mapBrowserEvent)) {
if (this.targetPointers.length > 0 && this.condition_(mapBrowserEvent)) {
var map = mapBrowserEvent.map;
var view2D = map.getView().getView2D();
goog.asserts.assertInstanceof(view2D, ol.View2D);
@@ -140,9 +140,9 @@ ol.interaction.Pan.prototype.handlePointerDown =
if (this.kinetic_) {
this.kinetic_.begin();
}
// No kinetic as soon as more than one fingers on the screen is
// No kinetic as soon as more than one pointer on the screen is
// detected. This is to prevent nasty pans after pinch.
this.noKinetic_ = this.targetTouches.length > 1;
this.noKinetic_ = this.targetPointers.length > 1;
return true;
} else {
return false;

39
src/ol/interaction/pointerinteraction.js
View File

@@ -13,7 +13,7 @@ goog.require('ol.interaction.Interaction');
/**
* Base class for touch interactions.
* Base class for pointer interactions.
* @constructor
* @extends {ol.interaction.Interaction}
*/
@@ -28,32 +28,32 @@ ol.interaction.PointerInteraction = function() {
this.handled_ = false;
/**
* @type {Object}
* @type {Object.<number, ol.pointer.PointerEvent>}
* @private
*/
this.trackedTouches_ = {};
this.trackedPointers_ = {};
/**
* @type {Array.<Object>}
* @type {Array.<ol.pointer.PointerEvent>}
* @protected
*/
this.targetTouches = [];
this.targetPointers = [];
};
goog.inherits(ol.interaction.PointerInteraction, ol.interaction.Interaction);
/**
* @param {Array.<Object>} touches TouchEvents.
* @param {Array.<ol.pointer.PointerEvent>} pointerEvents
* @return {ol.Pixel} Centroid pixel.
*/
ol.interaction.PointerInteraction.centroid = function(touches) {
var length = touches.length;
ol.interaction.PointerInteraction.centroid = function(pointerEvents) {
var length = pointerEvents.length;
var clientX = 0;
var clientY = 0;
for (var i = 0; i < length; i++) {
clientX += touches[i].clientX;
clientY += touches[i].clientY;
clientX += pointerEvents[i].clientX;
clientY += pointerEvents[i].clientY;
}
return [clientX / length, clientY / length];
};
@@ -65,7 +65,8 @@ ol.interaction.PointerInteraction.centroid = function(touches) {
* or pointerup event.
* @private
*/
ol.interaction.PointerInteraction.isTouchEvent_ = function(mapBrowserEvent) {
ol.interaction.PointerInteraction.prototype.isPointerDraggingEvent_ =
function(mapBrowserEvent) {
var type = mapBrowserEvent.type;
return (
type === ol.MapBrowserEvent.EventType.POINTERDOWN ||
@@ -78,21 +79,21 @@ ol.interaction.PointerInteraction.isTouchEvent_ = function(mapBrowserEvent) {
* @param {ol.MapBrowserPointerEvent} mapBrowserEvent Event.
* @private
*/
ol.interaction.PointerInteraction.prototype.updateTrackedTouches_ =
ol.interaction.PointerInteraction.prototype.updateTrackedPointers_ =
function(mapBrowserEvent) {
if (ol.interaction.PointerInteraction.isTouchEvent_(mapBrowserEvent)) {
if (this.isPointerDraggingEvent_(mapBrowserEvent)) {
var event = mapBrowserEvent.pointerEvent;
if (mapBrowserEvent.type == ol.MapBrowserEvent.EventType.POINTERUP) {
delete this.trackedTouches_[event.pointerId];
delete this.trackedPointers_[event.pointerId];
} else if (mapBrowserEvent.type ==
ol.MapBrowserEvent.EventType.POINTERDOWN) {
this.trackedTouches_[event.pointerId] = event;
} else if (event.pointerId in this.trackedTouches_) {
this.trackedPointers_[event.pointerId] = event;
} else if (event.pointerId in this.trackedPointers_) {
// update only when there was a pointerdown event for this pointer
this.trackedTouches_[event.pointerId] = event;
this.trackedPointers_[event.pointerId] = event;
}
this.targetTouches = goog.object.getValues(this.trackedTouches_);
this.targetPointers = goog.object.getValues(this.trackedPointers_);
}
};
@@ -133,7 +134,7 @@ ol.interaction.PointerInteraction.prototype.handleMapBrowserEvent =
/** @type {ol.MapBrowserPointerEvent} */ (mapBrowserEvent);
var view = mapBrowserEvent.map.getView();
this.updateTrackedTouches_(mapBrowserPointerEvent);
this.updateTrackedPointers_(mapBrowserPointerEvent);
if (this.handled_) {
if (mapBrowserPointerEvent.type ==
ol.MapBrowserEvent.EventType.POINTERDRAG) {

13
src/ol/interaction/rotateinteraction.js
View File

@@ -69,11 +69,11 @@ goog.inherits(ol.interaction.Rotate, ol.interaction.PointerInteraction);
*/
ol.interaction.Rotate.prototype.handlePointerDrag =
function(mapBrowserEvent) {
goog.asserts.assert(this.targetTouches.length >= 2);
goog.asserts.assert(this.targetPointers.length >= 2);
var rotationDelta = 0.0;
var touch0 = this.targetTouches[0];
var touch1 = this.targetTouches[1];
var touch0 = this.targetPointers[0];
var touch1 = this.targetPointers[1];
// angle between touches
var angle = Math.atan2(
@@ -97,7 +97,8 @@ ol.interaction.Rotate.prototype.handlePointerDrag =
// FIXME: should be the intersection point between the lines:
// touch0,touch1 and previousTouch0,previousTouch1
var viewportPosition = goog.style.getClientPosition(map.getViewport());
var centroid = ol.interaction.PointerInteraction.centroid(this.targetTouches);
var centroid =
ol.interaction.PointerInteraction.centroid(this.targetPointers);
centroid[0] -= viewportPosition.x;
centroid[1] -= viewportPosition.y;
this.anchor_ = map.getCoordinateFromPixel(centroid);
@@ -119,7 +120,7 @@ ol.interaction.Rotate.prototype.handlePointerDrag =
*/
ol.interaction.Rotate.prototype.handlePointerUp =
function(mapBrowserEvent) {
if (this.targetTouches.length < 2) {
if (this.targetPointers.length < 2) {
var map = mapBrowserEvent.map;
// FIXME works for View2D only
var view = map.getView().getView2D();
@@ -141,7 +142,7 @@ ol.interaction.Rotate.prototype.handlePointerUp =
*/
ol.interaction.Rotate.prototype.handlePointerDown =
function(mapBrowserEvent) {
if (this.targetTouches.length >= 2) {
if (this.targetPointers.length >= 2) {
var map = mapBrowserEvent.map;
this.anchor_ = null;
this.lastAngle_ = undefined;

13
src/ol/interaction/zoominteraction.js
View File

@@ -57,11 +57,11 @@ goog.inherits(ol.interaction.Zoom, ol.interaction.PointerInteraction);
*/
ol.interaction.Zoom.prototype.handlePointerDrag =
function(mapBrowserEvent) {
goog.asserts.assert(this.targetTouches.length >= 2);
goog.asserts.assert(this.targetPointers.length >= 2);
var scaleDelta = 1.0;
var touch0 = this.targetTouches[0];
var touch1 = this.targetTouches[1];
var touch0 = this.targetPointers[0];
var touch1 = this.targetPointers[1];
var dx = touch0.clientX - touch1.clientX;
var dy = touch0.clientY - touch1.clientY;
@@ -83,7 +83,8 @@ ol.interaction.Zoom.prototype.handlePointerDrag =
// scale anchor point.
var viewportPosition = goog.style.getClientPosition(map.getViewport());
var centroid = ol.interaction.PointerInteraction.centroid(this.targetTouches);
var centroid =
ol.interaction.PointerInteraction.centroid(this.targetPointers);
centroid[0] -= viewportPosition.x;
centroid[1] -= viewportPosition.y;
this.anchor_ = map.getCoordinateFromPixel(centroid);
@@ -101,7 +102,7 @@ ol.interaction.Zoom.prototype.handlePointerDrag =
*/
ol.interaction.Zoom.prototype.handlePointerUp =
function(mapBrowserEvent) {
if (this.targetTouches.length < 2) {
if (this.targetPointers.length < 2) {
var map = mapBrowserEvent.map;
// FIXME works for View2D only
var view = map.getView().getView2D();
@@ -124,7 +125,7 @@ ol.interaction.Zoom.prototype.handlePointerUp =
*/
ol.interaction.Zoom.prototype.handlePointerDown =
function(mapBrowserEvent) {
if (this.targetTouches.length >= 2) {
if (this.targetPointers.length >= 2) {
var map = mapBrowserEvent.map;
this.anchor_ = null;
this.lastDistance_ = undefined;