Get the correct target element during the dragMove event

Author: Niels Dequeker

source/directives/uiTreeNode.js

@@ -83,11 +83,21 @@
 
               // the node being dragged
               var eventElm = angular.element(e.target),
-                cloneElm = element.clone(),
-                eventElmTagName, tagName,
+                isHandleChild, cloneElm, eventElmTagName, tagName,
                 eventObj, tdElm, hStyle,
-                isTreeNode = UiTreeHelper.elementIsTreeNode(eventElm),
-                isTreeNodeHandle = UiTreeHelper.elementIsTreeNodeHandle(eventElm);
+                isTreeNode,
+                isTreeNodeHandle;
+
+              // if the target element is a child element of a ui-tree-handle,
+              // use the containing handle element as target element
+              isHandleChild = UiTreeHelper.treeNodeHandlerContainerOfElement(eventElm);
+              if (isHandleChild) {
+                eventElm = angular.element(isHandleChild);
+              }
+
+              cloneElm = element.clone();
+              isTreeNode = UiTreeHelper.elementIsTreeNode(eventElm);
+              isTreeNodeHandle = UiTreeHelper.elementIsTreeNodeHandle(eventElm);
 
               if (!isTreeNode && !isTreeNodeHandle) {
                 return;

source/services/helper.js

@@ -335,10 +335,30 @@
           },
           elementContainsTreeNodeHandler: function (element) {
             return element[0].querySelectorAll('[ui-tree-handle]').length >= 1;
+          },
+          treeNodeHandlerContainerOfElement: function (element) {
+            return findFirstParentElementWithAttribute('ui-tree-handle', element[0]);
           }
         };
       }
-
     ]);
 
+  // TODO: optimize this loop
+  function findFirstParentElementWithAttribute(attributeName, childObj) {
+    var testObj = childObj.parentNode;
+    var count = 1;
+    var res = testObj.hasAttribute(attributeName) ? testObj : null;
+    while (!testObj.hasAttribute(attributeName)) {
+      testObj = testObj.parentNode;
+      res = testObj;
+      if (testObj === document.documentElement) {
+        res = null;
+        break;
+      }
+      count++;
+    }
+
+    return res;
+  }
+
 })();