@syncfusion/ej2-base 20.2.38 → 20.2.39

package/dist/es6/ej2-base.es2015.js

@@ -7699,23 +7699,30 @@ let Draggable = Draggable_1 = class Draggable extends Base {
             draEleTop -= this.parentScrollY;
             draEleLeft -= this.parentScrollX;
         }
-        if (this.helperElement.classList.contains('e-treeview')) {
-            let body = document.body;
-            let html = document.documentElement;
-            let tempHeight = Math.max(body.offsetHeight, html.clientHeight, html.scrollHeight, html.offsetHeight);
-            let tempWidth = Math.max(body.offsetWidth, html.clientWidth, html.scrollWidth, html.offsetWidth);
-            if (draEleTop > tempHeight) {
-                draEleTop = tempHeight;
-            }
-            if (draEleLeft > tempWidth) {
-                draEleLeft = tempWidth;
-            }
-        }
         let dragValue = this.getProcessedPositionValue({ top: draEleTop + 'px', left: draEleLeft + 'px' });
         setStyleAttribute(helperElement, this.getDragPosition(dragValue));
-        if (!this.elementInViewport(helperElement) && this.enableAutoScroll) {
+        if (!this.elementInViewport(helperElement) && this.enableAutoScroll && !this.helperElement.classList.contains('e-treeview')) {
             this.helperElement.scrollIntoView();
         }
+        let elements = document.querySelectorAll(':hover');
+        if (this.enableAutoScroll && this.helperElement.classList.contains('e-treeview')) {
+            if (elements.length === 0) {
+                elements = this.getPathElements(evt);
+            }
+            /* tslint:disable no-any */
+            let scrollParent = this.getScrollParent(elements, false);
+            if (this.elementInViewport(this.helperElement)) {
+                this.getScrollPosition(scrollParent, draEleTop);
+            }
+            else if (!this.elementInViewport(this.helperElement)) {
+                elements = [].slice.call(document.querySelectorAll(':hover'));
+                if (elements.length === 0) {
+                    elements = this.getPathElements(evt);
+                }
+                scrollParent = this.getScrollParent(elements, true);
+                this.getScrollPosition(scrollParent, draEleTop);
+            }
+        }
         this.dragProcessStarted = true;
         this.prevLeft = left;
         this.prevTop = top;
@@ -7724,6 +7731,48 @@ let Draggable = Draggable_1 = class Draggable extends Base {
         this.pageX = pagex;
         this.pageY = pagey;
     }
+    /* tslint:disable no-any */
+    getScrollParent(node, reverse) {
+        /* tslint:disable no-any */
+        const nodeEl = reverse ? node.reverse() : node;
+        let hasScroll;
+        for (let i = nodeEl.length - 1; i >= 0; i--) {
+            hasScroll = window.getComputedStyle(nodeEl[i])['overflow-y'];
+            if ((hasScroll === 'auto' || hasScroll === 'scroll')
+                && nodeEl[i].scrollHeight > nodeEl[i].clientHeight) {
+                return nodeEl[i];
+            }
+        }
+        hasScroll = window.getComputedStyle(document.scrollingElement)['overflow-y'];
+        if (hasScroll === 'visible') {
+            document.scrollingElement.style.overflow = 'auto';
+            return document.scrollingElement;
+        }
+    }
+    getScrollPosition(nodeEle, draEleTop) {
+        if (nodeEle && nodeEle === document.scrollingElement) {
+            if ((nodeEle.clientHeight - nodeEle.getBoundingClientRect().top - this.helperElement.clientHeight) < draEleTop
+                && nodeEle.getBoundingClientRect().height > draEleTop) {
+                nodeEle.scrollTop += this.helperElement.clientHeight;
+            }
+            else if (nodeEle.scrollHeight - nodeEle.clientHeight > draEleTop) {
+                nodeEle.scrollTop -= this.helperElement.clientHeight;
+            }
+        }
+        else if (nodeEle && nodeEle !== document.scrollingElement) {
+            if ((nodeEle.clientHeight + nodeEle.getBoundingClientRect().top - this.helperElement.clientHeight) < draEleTop) {
+                nodeEle.scrollTop += this.helperElement.clientHeight;
+            }
+            else if (nodeEle.getBoundingClientRect().top > (draEleTop - this.helperElement.clientHeight)) {
+                nodeEle.scrollTop -= this.helperElement.clientHeight;
+            }
+        }
+    }
+    getPathElements(evt) {
+        const elementTop = evt.clientX > 0 ? evt.clientX : 0;
+        const elementLeft = evt.clientY > 0 ? evt.clientY : 0;
+        return document.elementsFromPoint(elementTop, elementLeft);
+    }
     triggerOutFunction(evt, eleObj) {
         this.hoverObject.instance.intOut(evt, eleObj.target);
         this.hoverObject.instance.dragData[this.scope] = null;