From 390f48d2886d09990c9765eec24828ea7741f5b7 Mon Sep 17 00:00:00 2001
From: Ed Mackey <elm19087@gmail.com>
Date: Sun, 24 Feb 2013 13:17:06 -0500
Subject: [PATCH] Touch controls for animation widget.

---
 Source/Widgets/Animation/Animation.js | 25 ++++++++++++++++++++-----
 1 file changed, 20 insertions(+), 5 deletions(-)

diff --git a/Source/Widgets/Animation/Animation.js b/Source/Widgets/Animation/Animation.js
index bedbc6fbef46..5d42988ddecf 100644
--- a/Source/Widgets/Animation/Animation.js
+++ b/Source/Widgets/Animation/Animation.js
@@ -145,7 +145,7 @@ define(['../../Core/destroyObject',
         return svgFromObject(button);
     }
 
-    function setShuttleRingFromMouse(widget, e) {
+    function setShuttleRingFromMouseOrTouch(widget, e) {
         var viewModel = widget.viewModel;
         var shuttleRingDragging = viewModel.shuttleRingDragging();
 
@@ -153,13 +153,22 @@ define(['../../Core/destroyObject',
             return;
         }
 
-        if (e.type === 'mousedown' || (shuttleRingDragging && e.type === 'mousemove')) {
+        if (e.type === 'mousedown' || (shuttleRingDragging && e.type === 'mousemove') ||
+                (e.type === 'touchstart' && e.touches.length === 1) ||
+                (shuttleRingDragging && e.type === 'touchmove' && e.touches.length === 1)) {
             var centerX = widget._centerX;
             var centerY = widget._centerY;
             var svg = widget._svgNode;
             var rect = svg.getBoundingClientRect();
-            var clientX = e.clientX;
-            var clientY = e.clientY;
+            var clientX;
+            var clientY;
+            if (e.type === 'touchstart' || e.type === 'touchmove') {
+                clientX = e.touches[0].clientX;
+                clientY = e.touches[0].clientY;
+            } else {
+                clientX = e.clientX;
+                clientY = e.clientY;
+            }
 
             if (!shuttleRingDragging &&
                 (clientX > rect.right ||
@@ -542,14 +551,20 @@ define(['../../Core/destroyObject',
         }, true);
 
         var callBack = function(e) {
-            setShuttleRingFromMouse(that, e);
+            setShuttleRingFromMouseOrTouch(that, e);
         };
         shuttleRingBackPanel.addEventListener('mousedown', callBack, true);
+        shuttleRingBackPanel.addEventListener('touchstart', callBack, true);
         shuttleRingSwooshG.addEventListener('mousedown', callBack, true);
+        shuttleRingSwooshG.addEventListener('touchstart', callBack, true);
         document.addEventListener('mousemove', callBack, true);
+        document.addEventListener('touchmove', callBack, true);
         document.addEventListener('mouseup', callBack, true);
+        document.addEventListener('touchend', callBack, true);
         this._shuttleRingPointer.addEventListener('mousedown', callBack, true);
+        this._shuttleRingPointer.addEventListener('touchstart', callBack, true);
         this._knobOuter.addEventListener('mousedown', callBack, true);
+        this._knobOuter.addEventListener('touchstart', callBack, true);
 
         //TODO: Since the animation widget uses SVG and has no HTML backing,
         //we need to wire everything up manually.  Knockout can supposedly