From 74202ea1b9127786834d8bf387efdd0fd8eb1a63 Mon Sep 17 00:00:00 2001
From: Zachary Carter <zack.carter@gmail.com>
Date: Mon, 25 Aug 2014 17:43:18 -0700
Subject: [PATCH] fix(avatars): allow mobile browsers to reposition the image
 during crop

---
 app/scripts/require_config.js               | 4 ++++
 app/scripts/views/settings/avatar_change.js | 4 ++--
 app/scripts/views/settings/avatar_url.js    | 2 +-
 bower.json                                  | 3 ++-
 4 files changed, 9 insertions(+), 4 deletions(-)

diff --git a/app/scripts/require_config.js b/app/scripts/require_config.js
index f84bbd74d7..4b170ddc11 100644
--- a/app/scripts/require_config.js
+++ b/app/scripts/require_config.js
@@ -22,6 +22,10 @@ require.config({
     { name: 'draggable',
       location: '../bower_components/jquery-ui/ui',
       main: 'draggable'
+    },
+    { name: 'touch-punch',
+      location: '../bower_components/jquery-ui-touch-punch',
+      main: 'jquery.ui.touch-punch'
     }
   ],
   shim: {
diff --git a/app/scripts/views/settings/avatar_change.js b/app/scripts/views/settings/avatar_change.js
index 6e65f20c67..4f087a4336 100644
--- a/app/scripts/views/settings/avatar_change.js
+++ b/app/scripts/views/settings/avatar_change.js
@@ -57,7 +57,7 @@ define([
         // skip the file picker if this is an automater browser
         if (this.automatedBrowser) {
           var self = this;
-          require(['draggable'], function (ui) {
+          require(['draggable', 'touch-punch'], function () {
             Session.set('cropImgSrc', pngSrc);
             Session.set('cropImgWidth', 1);
             Session.set('cropImgHeight', 1);
@@ -78,7 +78,7 @@ define([
           // Store the width and height for the cropper view
           Session.set('cropImgWidth', this.width);
           Session.set('cropImgHeight', this.height);
-          require(['draggable'], function () {
+          require(['draggable', 'touch-punch'], function () {
             self.navigate('settings/avatar/crop');
           });
         };
diff --git a/app/scripts/views/settings/avatar_url.js b/app/scripts/views/settings/avatar_url.js
index a35df3cdcd..a4cc651dda 100644
--- a/app/scripts/views/settings/avatar_url.js
+++ b/app/scripts/views/settings/avatar_url.js
@@ -80,7 +80,7 @@ function (_, FormView, Template, Session, OAuthClient, ProfileClient, Assertion,
         // Store the width and height for the cropper view
         Session.set('cropImgWidth', this.width);
         Session.set('cropImgHeight', this.height);
-        require(['draggable'], function () {
+        require(['draggable', 'touch-punch'], function () {
           self.navigate('settings/avatar/crop');
         });
       };
diff --git a/bower.json b/bower.json
index 2d1a2a7e8a..7e63345d1a 100644
--- a/bower.json
+++ b/bower.json
@@ -21,7 +21,8 @@
     "tos-pp": "https://github.com/mozilla/legal-docs.git",
     "underscore": "1.5.2",
     "jquery-ui": "1.11.0",
-    "JavaScript-MD5": "1.1.0"
+    "JavaScript-MD5": "1.1.0",
+    "jquery-ui-touch-punch": "https://github.com/zaach/jquery-ui-touch-punch.git#89e5a9159494de37df1e09cccf9036dda5429830"
   },
   "devDependencies": {}
 }