From 648f0d7db66f9be70c341e3ef6b05024e5f1151f Mon Sep 17 00:00:00 2001
From: Jonathan Puckey <me@jonathanpuckey.com>
Date: Wed, 4 May 2011 18:49:30 +0100
Subject: [PATCH] Tool & Event: support touch events & call onMouseMove (if
present) while dragging when there is no onMouseDrag handler.
---
src/browser/Event.js | 9 +++++++--
src/tool/Tool.js | 36 +++++++++++++++++++++++++++---------
2 files changed, 34 insertions(+), 11 deletions(-)
diff --git a/src/browser/Event.js b/src/browser/Event.js
index 0c6dfb20..db4b5a5d 100644
--- a/src/browser/Event.js
+++ b/src/browser/Event.js
@@ -43,9 +43,14 @@ var Event = {
},
getPoint: function(event) {
+ var pos = event.targetTouches
+ ? event.targetTouches.length
+ ? event.targetTouches[0]
+ : event.changedTouches[0]
+ : event;
return Point.create(
- event.pageX || event.clientX + document.documentElement.scrollLeft,
- event.pageY || event.clientY + document.documentElement.scrollTop
+ pos.pageX || pos.clientX + document.documentElement.scrollLeft,
+ pos.pageY || pos.clientY + document.documentElement.scrollTop
);
},
diff --git a/src/tool/Tool.js b/src/tool/Tool.js
index 27ed50d8..837062b2 100644
--- a/src/tool/Tool.js
+++ b/src/tool/Tool.js
@@ -43,19 +43,24 @@ var Tool = this.Tool = ToolHandler.extend(new function() {
},
mousemove: function(event) {
+ // If the event was triggered by a touch screen device,
+ // prevent the default behaviour, as it will otherwise
+ // scroll the page:
+ if (event.targetTouches)
+ event.preventDefault();
var point = event && viewToArtwork(event, that._document);
- if (dragging) {
+ // If there is only an onMouseMove handler, call it when
+ // the user is dragging
+ var onlyMove = !!(!that.onMouseDrag && that.onMouseMove);
+ if (dragging && !onlyMove) {
curPoint = point || curPoint;
- if (curPoint) {
+ if (curPoint)
that.onHandleEvent('mouse-drag', curPoint, event);
- if (that.onMouseDrag)
- that._document.redraw();
- }
- } else {
+ } else if (!dragging || onlyMove) {
that.onHandleEvent('mouse-move', point, event);
- if (that.onMouseMove)
- that._document.redraw();
}
+ if (that.onMouseMove || that.onMouseDrag)
+ that._document.redraw();
},
mouseup: function(event) {
@@ -69,8 +74,21 @@ var Tool = this.Tool = ToolHandler.extend(new function() {
that._document.redraw();
dragging = false;
}
+ },
+
+ touchmove: function(event) {
+ that.events.mousemove(event);
+ },
+
+ touchstart: function(event) {
+ that.events.mousedown(event);
+ },
+
+ touchend: function(event) {
+ that.events.mouseup(event);
}
- }
+ };
+
if (paper.document)
this.setDocument(paper.document);