From 17759134766835ffe4ff1a1952a8d6bd884fbd65 Mon Sep 17 00:00:00 2001
From: Eric Rowell <erowell83@gmail.com>
Date: Tue, 29 Jan 2013 10:12:24 -0800
Subject: [PATCH] mouseup and click events now work correctly after dragging
 and dropping a shape

---
 src/DragAndDrop.js              |  7 +++++--
 tests/html/functionalTests.html |  2 +-
 tests/js/functionalTests.js     | 12 +++++++++---
 3 files changed, 15 insertions(+), 6 deletions(-)

diff --git a/src/DragAndDrop.js b/src/DragAndDrop.js
index 08b5d287..b6e62f75 100644
--- a/src/DragAndDrop.js
+++ b/src/DragAndDrop.js
@@ -238,7 +238,10 @@
      * @methodOf Kinetic.Node.prototype
      */
 
+    // listen for capturing phase so that the _endDrag method is
+    // called before the stage mouseup event is triggered in order
+    // to render the hit graph just in time to pick up the event
     var html = document.getElementsByTagName('html')[0];
-    html.addEventListener('mouseup', Kinetic.DD._endDrag);
-    html.addEventListener('touchend', Kinetic.DD._endDrag);
+    html.addEventListener('mouseup', Kinetic.DD._endDrag, true);
+    html.addEventListener('touchend', Kinetic.DD._endDrag, true);
 })();
diff --git a/tests/html/functionalTests.html b/tests/html/functionalTests.html
index 5f3d4e50..83df4def 100644
--- a/tests/html/functionalTests.html
+++ b/tests/html/functionalTests.html
@@ -16,7 +16,7 @@
                 test.run();
 
                 document.getElementsByTagName('body')[0].addEventListener('mousemove', function(evt) {
-                    console.log(evt.clientX + ',' + evt.clientY);
+                    //console.log(evt.clientX + ',' + evt.clientY);
                 }, false);
             };
 
diff --git a/tests/js/functionalTests.js b/tests/js/functionalTests.js
index d601501e..42dbc10c 100644
--- a/tests/js/functionalTests.js
+++ b/tests/js/functionalTests.js
@@ -46,7 +46,7 @@ Test.Modules.DD = {
         // which can't be simulated.  call _endDrag manually
         Kinetic.DD._endDrag();
     },
-    'test dragstart, dragmove, dragend': function(containerId) {
+    '*test dragstart, dragmove, dragend': function(containerId) {
         var stage = new Kinetic.Stage({
             container: containerId,
             width: 578,
@@ -73,6 +73,7 @@ Test.Modules.DD = {
         var dragStart = false;
         var dragMove = false;
         var dragEnd = false;
+        var mouseup = false;
 
         circle.on('dragstart', function() {
             dragStart = true;
@@ -85,8 +86,13 @@ Test.Modules.DD = {
         circle.on('dragend', function() {
             dragEnd = true;
             // test set draggable false after drag end
-            this.setDraggable(false);
+            //this.setDraggable(false);
         });
+        
+        circle.on('mouseup', function() {
+            console.log('mousup')
+        });
+        
         warn(layer.toDataURL() === dataUrls['drag circle before'], 'start data url is incorrect');
         /*
         * simulate drag and drop
@@ -121,7 +127,7 @@ Test.Modules.DD = {
         test(dragStart, 'dragstart event was not triggered');
         test(dragMove, 'dragmove event was not triggered');
         test(dragEnd, 'dragend event was not triggered');
-        test(!circle.getDraggable(), 'circle should no longer be draggable');
+        //test(!circle.getDraggable(), 'circle should no longer be draggable');
 
         warn(layer.toDataURL() === dataUrls['drag circle after'], 'end data url is incorrect');
     },