From d6e2c5c09eb9285a763a191bb3652c76c66a3453 Mon Sep 17 00:00:00 2001
From: vivek-yadav <vivekyadav.jit@gmail.com>
Date: Wed, 13 May 2015 21:01:16 +0530
Subject: [PATCH 1/2] Example contains a linkItem Button which also move

A button is added as drag-button, which moves along with the drag-target div.
This is done by adding linkItem option in jquery.gesture2.js
---
 gesture2.html | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/gesture2.html b/gesture2.html
index e2bfdca..d0ccb9e 100644
--- a/gesture2.html
+++ b/gesture2.html
@@ -32,6 +32,7 @@
     Scale<br />
     <input type="checkbox" id="rotatecheckbox" checked="checked" />
     Rotate<br />
+    <button id="drag-button">Click</button>
     <div id="drag-target">
         :-)</div>
     <div>
@@ -169,7 +170,8 @@
 	            drag: function () { return ischecked("#dragcheckbox"); },
 	            scale: function () { return ischecked("#scalecheckbox"); },
 	            rotate: function () { return ischecked("#rotatecheckbox"); },
-	            touchtarget: null
+	            touchtarget: null,
+	            linkItem:$("#drag-button")
 	        }
         );
     </script>

From d5c8b9e87af3da21f0ae4c680ea955b361798a6c Mon Sep 17 00:00:00 2001
From: vivek-yadav <vivekyadav.jit@gmail.com>
Date: Wed, 13 May 2015 21:11:10 +0530
Subject: [PATCH 2/2] Added linkItem option which also moves

Added linkItem option which also moves along with this object.
This allows anything even outside the touch element to also move and transform along with it.
---
 jquery.gesture2.js | 47 +++++++++++++++++++++++++++++++++++++++++++++-
 1 file changed, 46 insertions(+), 1 deletion(-)

diff --git a/jquery.gesture2.js b/jquery.gesture2.js
index a8b7c83..ef25395 100644
--- a/jquery.gesture2.js
+++ b/jquery.gesture2.js
@@ -26,10 +26,18 @@
                 rotate: true,
 
                 // we can make this jQuery object responds to touch on another jQuery
-                touchtarget: null
+                touchtarget: null,
+                // LinkItem which will move and transform along with this
+                linkItem: null
             },
             options);
 
+        var linkItem = options.linkItem ? $(options.linkItem) : null,
+            _linkItem = linkItem,
+            linkItem_original_x = 0,
+            linkItem_original_y = 0,
+            linkItem_original_css = "";
+
         var touchtarget = options.touchtarget ? $(options.touchtarget) : this,
             _this = this,
             in_drag = false,
@@ -49,12 +57,29 @@
                     dy = ((event.touches.length == 0) ? event.pageY : event.touches[0].pageY) - original_y,
                     new_css = "translate(" + dx + "px," + dy + "px) " + original_css;
                 _this.__transform__(new_css);
+                
+                // Transform LinkItem
+                if(_linkItem){
+                    
+                    var linkItem_dx = ((event.touches.length == 0) ? event.pageX : event.touches[0].pageX) - linkItem_original_x,
+                        linkItem_dy = ((event.touches.length == 0) ? event.pageY : event.touches[0].pageY) - linkItem_original_y,
+                        linkItem_new_css = "translate(" + linkItem_dx + "px," + linkItem_dy + "px) " + linkItem_original_css;
+                    _linkItem.__transform__(linkItem_new_css);
+                }
             } else {
                 if (in_drag = event.type == "_gesture2_touch_start") {
                     original_x = event.touches[0].pageX;
                     original_y = event.touches[0].pageY;
                     original_css = _this.__transform__();
                     if (!original_css || original_css == "none") original_css = "";
+                    
+                    // For linkItem
+                    if(_linkItem){
+                        linkItem_original_x = event.touches[0].pageX;
+                        linkItem_original_y = event.touches[0].pageY;
+                        linkItem_original_css = _linkItem.__transform__();
+                        if (!linkItem_original_css || linkItem_original_css == "none") linkItem_original_css = "";
+                    }
                 }
             }
 
@@ -76,12 +101,32 @@
                         "translate(" + (-original_x) + "px," + (-original_y) + "px) " +
                         original_css;
                 _this.__transform__(new_css);
+                
+                // Transform LinkItem
+                if(_linkItem){
+                    var linkItem_dx = event.pageX - linkItem_original_x,
+                        linkItem_dy = event.pageY - linkItem_original_y,
+                        linkItem_new_css = (__getvalue__(options.drag) ? ("translate(" + event.pageX + "px," + event.pageY + "px) ") : ("translate(" + linkItem_original_x + "px," + linkItem_original_y + "px) ")) +
+                            (__getvalue__(options.scale) ? ("scale(" + event.scale + ")") : "") +
+                            (__getvalue__(options.rotate) ? ("rotate(" + event.rotation + "rad) ") : "") +
+                            "translate(" + (-linkItem_original_x) + "px," + (-linkItem_original_y) + "px) " +
+                            linkItem_original_css;
+                    _linkItem.__transform__(linkItem_new_css);
+                }
             } else {
                 in_gesture = true;
                 original_css = _this.__transform__();
                 original_x = event.pageX;
                 original_y = event.pageY;
                 if (!original_css || original_css == "none") original_css = "";
+                
+                // For LinkItem
+                if(_linkItem){
+                    linkItem_original_css = _linkItem.__transform__();
+                    linkItem_original_x = event.pageX;
+                    linkItem_original_y = event.pageY;
+                    if (!linkItem_original_css || linkItem_original_css == "none") linkItem_original_css = "";
+                }
             }
 
             if (event.type == "_gesture2_gesture_end") {