From ba335331788041616c9d9b3550c57c1d28478fa9 Mon Sep 17 00:00:00 2001
From: Alexander Holland <alexander.holland@live.de>
Date: Tue, 3 Nov 2015 03:34:13 +0100
Subject: [PATCH] tablet touch and s-pen input

---
 src/js/controller/DrawingController.js | 25 ++++++++++++++++++++++++-
 1 file changed, 24 insertions(+), 1 deletion(-)

diff --git a/src/js/controller/DrawingController.js b/src/js/controller/DrawingController.js
index 3e85220a..5b7469ce 100644
--- a/src/js/controller/DrawingController.js
+++ b/src/js/controller/DrawingController.js
@@ -85,7 +85,9 @@
     window.addEventListener('mouseup', this.onMouseup_.bind(this));
     window.addEventListener('mousemove', this.onMousemove_.bind(this));
     window.addEventListener('keyup', this.onKeyup_.bind(this));
-
+    window.addEventListener('touchstart', this.onMousedown_.bind(this));
+    window.addEventListener('touchmove' , this.onMousemove_.bind(this));
+    window.addEventListener('touchend', this.onMouseup_.bind(this));
     // Deactivate right click:
     body.contextmenu(this.onCanvasContextMenu_);
 
@@ -140,6 +142,12 @@
     $.publish(Events.MOUSE_EVENT, [event, this]);
     var frame = this.piskelController.getCurrentFrame();
     var coords = this.getSpriteCoordinates(event.clientX, event.clientY);
+    if (typeof event.targetTouches != 'undefined' &&
+        typeof event.targetTouches[0] != 'undefined' &&
+        typeof event.targetTouches[0].pageX != 'undefined' &&
+        typeof event.targetTouches[0].pageY != 'undefined') {
+      coords = this.getSpriteCoordinates(event.targetTouches[0].pageX, event.targetTouches[0].pageY);
+    }
 
     this.isClicked = true;
 
@@ -164,6 +172,14 @@
   ns.DrawingController.prototype.onMousemove_ = function (event) {
     this._clientX = event.clientX;
     this._clientY = event.clientY;
+    
+    if (typeof event.targetTouches != 'undefined' &&
+        typeof event.targetTouches[0] != 'undefined' &&
+        typeof event.targetTouches[0].pageX != 'undefined' &&
+        typeof event.targetTouches[0].pageY != 'undefined') {
+      this._clientX = event.targetTouches[0].pageX;
+      this._clientY = event.targetTouches[0].pageY;
+    }
 
     var currentTime = new Date().getTime();
     // Throttling of the mousemove event:
@@ -252,6 +268,13 @@
   ns.DrawingController.prototype.onMouseup_ = function (event) {
     var frame = this.piskelController.getCurrentFrame();
     var coords = this.getSpriteCoordinates(event.clientX, event.clientY);
+    if (typeof event.changedTouches != 'undefined' &&
+        typeof event.changedTouches[0] != 'undefined' &&
+        typeof event.changedTouches[0].pageX != 'undefined' &&
+        typeof event.changedTouches[0].pageY != 'undefined') {
+
+      coords = this.getSpriteCoordinates(event.changedTouches[0].pageX, event.changedTouches[0].pageY);
+    }
     if (this.isClicked) {
       // A mouse button was clicked on the drawing canvas before this mouseup event,
       // the user was probably drawing on the canvas.