From abd5036d088598a3b8dc62e45071844dc719920d Mon Sep 17 00:00:00 2001
From: Fabio Caseri <fabio.caseri@gmail.com>
Date: Fri, 29 Nov 2013 18:34:09 +0100
Subject: [PATCH 1/2] Add touch events support

---
 src/farbtastic.js | 89 +++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 89 insertions(+)

diff --git a/src/farbtastic.js b/src/farbtastic.js
index 10802c6..5c9c499 100644
--- a/src/farbtastic.js
+++ b/src/farbtastic.js
@@ -489,6 +489,87 @@ $._farbtastic = function (container, options) {
     return [h, s, l];
   };
 
+  /* START TOUCH SUPPORT */
+  // Touch support
+  $.extend($.support, {
+    touch: 'ontouchend' in document
+  });
+
+  /**
+   * Helper for returning coordinates relative to the center with touch event
+   */
+  fb.widgetCoordsTouch = function(event) {
+    return {
+      x: event.targetTouches[0].pageX - fb.offset.left - fb.mid,    
+      y: event.targetTouches[0].pageY - fb.offset.top - fb.mid
+    };    
+  }
+  
+  /**
+   * Handle the touchstart events
+   */
+  fb.touchHandleStart = function(event) {
+    // Ignore the event if another is already being handled
+    if (fb.touchHandled) {
+      return;
+    }
+
+    // Set the flag to prevent others from inheriting the touch event
+    fb.touchHandled = true;
+
+    // Track movement to determine if interaction was a click
+    fb._touchMoved = false;
+
+    // Update the stored offset for the widget.
+    fb.offset = $(container).offset();
+
+    // Check which area is being dragged
+    var pos = fb.widgetCoordsTouch(event);
+    fb.circleDrag = Math.max(Math.abs(pos.x), Math.abs(pos.y)) > (fb.square + 2);
+  }
+  
+  /**
+   * Handle the touchstart events
+   */
+  fb.touchHandleMove = function(event) {
+    // Ignore event if not handled
+    if (!fb.touchHandled) {
+      return;
+    }
+    event.preventDefault();
+
+    // Interaction was not a click
+    fb._touchMoved = true;
+
+    // Get coordinates relative to color picker center
+    var pos = fb.widgetCoordsTouch(event);
+
+    // Set new HSL parameters
+    if (fb.circleDrag) {
+      var hue = Math.atan2(pos.x, -pos.y) / 6.28;
+      fb.setHSL([(hue + 1) % 1, fb.hsl[1], fb.hsl[2]]);
+    } else {
+      var sat = Math.max(0, Math.min(1, -(pos.x / fb.square / 2) + .5));
+      var lum = Math.max(0, Math.min(1, -(pos.y / fb.square / 2) + .5));
+      fb.setHSL([fb.hsl[0], sat, lum]);
+    }
+
+  }
+  
+  /**
+   * Handle the touchstart events
+   */
+  fb.touchHandleEnd = function(event) {
+    // Ignore event if not handled
+    if (!fb.touchHandled) {
+      return;
+    }
+
+    // Unset the flag to allow other widgets to inherit the touch event
+    fb.touchHandled = false;
+  }
+  /* END TOUCH SUPPORT */
+
   // Parse options.
   if (!options.callback) {
     options = { callback: options };
@@ -505,6 +586,14 @@ $._farbtastic = function (container, options) {
   // Install mousedown handler (the others are set on the document on-demand)
   $('canvas.farbtastic-overlay', container).mousedown(fb.mousedown);
 
+  // Install touch handlers
+  if ($.support.touch) {
+    $('canvas.farbtastic-overlay', container).bind('touchstart', fb.touchHandleStart)
+                                             .bind('touchmove', fb.touchHandleMove)
+                                             .bind('touchend', fb.touchHandleEnd);
+    $(document).bind('touchcancel', fb.touchHandleEnd);
+  }
+
   // Set linked elements/callback
   if (options.callback) {
     fb.linkTo(options.callback);

From 4aae74ede22b1f867774bf3f711e836e4fd7e17c Mon Sep 17 00:00:00 2001
From: Fabio Caseri <fabio.caseri@gmail.com>
Date: Thu, 13 Feb 2014 19:04:26 +0100
Subject: [PATCH 2/2] jQuery has its custom implementation of event, we need
 the original one

---
 src/farbtastic.js | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/farbtastic.js b/src/farbtastic.js
index 5c9c499..90b6f5c 100644
--- a/src/farbtastic.js
+++ b/src/farbtastic.js
@@ -499,6 +499,7 @@ $._farbtastic = function (container, options) {
    * Helper for returning coordinates relative to the center with touch event
    */
   fb.widgetCoordsTouch = function(event) {
+    event = event.originalEvent || event;
     return {
       x: event.targetTouches[0].pageX - fb.offset.left - fb.mid,    
       y: event.targetTouches[0].pageY - fb.offset.top - fb.mid