| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270 | import {	on,	off,	css,	throttle,	cancelThrottle,	scrollBy,	getParentAutoScrollElement,	expando,	getRect,	getWindowScrollingElement} from '../../src/utils.js';import Sortable from '../../src/Sortable.js';import { Edge, IE11OrLess, Safari } from '../../src/BrowserInfo.js';let autoScrolls = [],	scrollEl,	scrollRootEl,	scrolling = false,	lastAutoScrollX,	lastAutoScrollY,	touchEvt,	pointerElemChangedInterval;function AutoScrollPlugin() {	function AutoScroll() {		this.defaults = {			scroll: true,			scrollSensitivity: 30,			scrollSpeed: 10,			bubbleScroll: true		};		// Bind all private methods		for (let fn in this) {			if (fn.charAt(0) === '_' && typeof this[fn] === 'function') {				this[fn] = this[fn].bind(this);			}		}	}	AutoScroll.prototype = {		dragStarted({ originalEvent }) {			if (this.sortable.nativeDraggable) {				on(document, 'dragover', this._handleAutoScroll);			} else {				if (this.options.supportPointer) {					on(document, 'pointermove', this._handleFallbackAutoScroll);				} else if (originalEvent.touches) {					on(document, 'touchmove', this._handleFallbackAutoScroll);				} else {					on(document, 'mousemove', this._handleFallbackAutoScroll);				}			}		},		dragOverCompleted({ originalEvent }) {			// For when bubbling is canceled and using fallback (fallback 'touchmove' always reached)			if (!this.options.dragOverBubble && !originalEvent.rootEl) {				this._handleAutoScroll(originalEvent);			}		},		drop() {			if (this.sortable.nativeDraggable) {				off(document, 'dragover', this._handleAutoScroll);			} else {				off(document, 'pointermove', this._handleFallbackAutoScroll);				off(document, 'touchmove', this._handleFallbackAutoScroll);				off(document, 'mousemove', this._handleFallbackAutoScroll);			}			clearPointerElemChangedInterval();			clearAutoScrolls();			cancelThrottle();		},		nulling() {			touchEvt =			scrollRootEl =			scrollEl =			scrolling =			pointerElemChangedInterval =			lastAutoScrollX =			lastAutoScrollY = null;			autoScrolls.length = 0;		},		_handleFallbackAutoScroll(evt) {			this._handleAutoScroll(evt, true);		},		_handleAutoScroll(evt, fallback) {			const x = (evt.touches ? evt.touches[0] : evt).clientX,				y = (evt.touches ? evt.touches[0] : evt).clientY,				elem = document.elementFromPoint(x, y);			touchEvt = evt;			// IE does not seem to have native autoscroll,			// Edge's autoscroll seems too conditional,			// MACOS Safari does not have autoscroll,			// Firefox and Chrome are good			if (fallback || Edge || IE11OrLess || Safari) {				autoScroll(evt, this.options, elem, fallback);				// Listener for pointer element change				let ogElemScroller = getParentAutoScrollElement(elem, true);				if (					scrolling &&					(						!pointerElemChangedInterval ||						x !== lastAutoScrollX ||						y !== lastAutoScrollY					)				) {					pointerElemChangedInterval && clearPointerElemChangedInterval();					// Detect for pointer elem change, emulating native DnD behaviour					pointerElemChangedInterval = setInterval(() => {						let newElem = getParentAutoScrollElement(document.elementFromPoint(x, y), true);						if (newElem !== ogElemScroller) {							ogElemScroller = newElem;							clearAutoScrolls();						}						autoScroll(evt, this.options, newElem, fallback);					}, 10);					lastAutoScrollX = x;					lastAutoScrollY = y;				}			} else {				// if DnD is enabled (and browser has good autoscrolling), first autoscroll will already scroll, so get parent autoscroll of first autoscroll				if (!this.options.bubbleScroll || getParentAutoScrollElement(elem, true) === getWindowScrollingElement()) {					clearAutoScrolls();					return;				}				autoScroll(evt, this.options, getParentAutoScrollElement(elem, false), false);			}		}	};	return Object.assign(AutoScroll, {		pluginName: 'scroll',		initializeByDefault: true	});}function clearAutoScrolls() {	autoScrolls.forEach(function(autoScroll) {		clearInterval(autoScroll.pid);	});	autoScrolls = [];}function clearPointerElemChangedInterval() {	clearInterval(pointerElemChangedInterval);}const autoScroll = throttle(function(evt, options, rootEl, isFallback) {	// Bug: https://bugzilla.mozilla.org/show_bug.cgi?id=505521	if (!options.scroll) return;	const x = (evt.touches ? evt.touches[0] : evt).clientX,		y = (evt.touches ? evt.touches[0] : evt).clientY,		sens = options.scrollSensitivity,		speed = options.scrollSpeed,		winScroller = getWindowScrollingElement();	let scrollThisInstance = false,		scrollCustomFn;	// New scroll root, set scrollEl	if (scrollRootEl !== rootEl) {		scrollRootEl = rootEl;		clearAutoScrolls();		scrollEl = options.scroll;		scrollCustomFn = options.scrollFn;		if (scrollEl === true) {			scrollEl = getParentAutoScrollElement(rootEl, true);		}	}	let layersOut = 0;	let currentParent = scrollEl;	do {		let	el = currentParent,			rect = getRect(el),			top = rect.top,			bottom = rect.bottom,			left = rect.left,			right = rect.right,			width = rect.width,			height = rect.height,			canScrollX,			canScrollY,			scrollWidth = el.scrollWidth,			scrollHeight = el.scrollHeight,			elCSS = css(el),			scrollPosX = el.scrollLeft,			scrollPosY = el.scrollTop;		if (el === winScroller) {			canScrollX = width < scrollWidth && (elCSS.overflowX === 'auto' || elCSS.overflowX === 'scroll' || elCSS.overflowX === 'visible');			canScrollY = height < scrollHeight && (elCSS.overflowY === 'auto' || elCSS.overflowY === 'scroll' || elCSS.overflowY === 'visible');		} else {			canScrollX = width < scrollWidth && (elCSS.overflowX === 'auto' || elCSS.overflowX === 'scroll');			canScrollY = height < scrollHeight && (elCSS.overflowY === 'auto' || elCSS.overflowY === 'scroll');		}		let vx = canScrollX && (Math.abs(right - x) <= sens && (scrollPosX + width) < scrollWidth) - (Math.abs(left - x) <= sens && !!scrollPosX);		let vy = canScrollY && (Math.abs(bottom - y) <= sens && (scrollPosY + height) < scrollHeight) - (Math.abs(top - y) <= sens && !!scrollPosY);		if (!autoScrolls[layersOut]) {			for (let i = 0; i <= layersOut; i++) {				if (!autoScrolls[i]) {					autoScrolls[i] = {};				}			}		}		if (autoScrolls[layersOut].vx != vx || autoScrolls[layersOut].vy != vy || autoScrolls[layersOut].el !== el) {			autoScrolls[layersOut].el = el;			autoScrolls[layersOut].vx = vx;			autoScrolls[layersOut].vy = vy;			clearInterval(autoScrolls[layersOut].pid);			if (vx != 0 || vy != 0) {				scrollThisInstance = true;				/* jshint loopfunc:true */				autoScrolls[layersOut].pid = setInterval((function () {					// emulate drag over during autoscroll (fallback), emulating native DnD behaviour					if (isFallback && this.layer === 0) {						Sortable.active._onTouchMove(touchEvt); // To move ghost if it is positioned absolutely					}					let scrollOffsetY = autoScrolls[this.layer].vy ? autoScrolls[this.layer].vy * speed : 0;					let scrollOffsetX = autoScrolls[this.layer].vx ? autoScrolls[this.layer].vx * speed : 0;					if (typeof(scrollCustomFn) === 'function') {						if (scrollCustomFn.call(Sortable.dragged.parentNode[expando], scrollOffsetX, scrollOffsetY, evt, touchEvt, autoScrolls[this.layer].el) !== 'continue') {							return;						}					}					scrollBy(autoScrolls[this.layer].el, scrollOffsetX, scrollOffsetY);				}).bind({layer: layersOut}), 24);			}		}		layersOut++;	} while (options.bubbleScroll && currentParent !== winScroller && (currentParent = getParentAutoScrollElement(currentParent, false)));	scrolling = scrollThisInstance; // in case another function catches scrolling as false in between when it is not}, 30);export default AutoScrollPlugin;
 |