mirror of
https://github.com/jellyfin/jellyfin-web
synced 2025-03-30 19:56:21 +00:00
Merge pull request #1774 from MrTimscampi/another-es6
Migrate navdrawer and scroller to ES6
This commit is contained in:
commit
016ac959ed
6 changed files with 1162 additions and 1198 deletions
|
@ -2,4 +2,3 @@ node_modules
|
|||
dist
|
||||
.idea
|
||||
.vscode
|
||||
src/libraries
|
||||
|
|
|
@ -275,6 +275,8 @@
|
|||
"src/elements/emby-tabs/emby-tabs.js",
|
||||
"src/elements/emby-textarea/emby-textarea.js",
|
||||
"src/elements/emby-toggle/emby-toggle.js",
|
||||
"src/libraries/navdrawer/navdrawer.js",
|
||||
"src/libraries/scroller.js",
|
||||
"src/plugins/backdropScreensaver/plugin.js",
|
||||
"src/plugins/bookPlayer/plugin.js",
|
||||
"src/plugins/bookPlayer/tableOfContents.js",
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
define(['globalize', 'listView', 'layoutManager', 'userSettings', 'focusManager', 'cardBuilder', 'loading', 'connectionManager', 'alphaNumericShortcuts', 'scroller', 'playbackManager', 'alphaPicker', 'emby-itemscontainer', 'emby-scroller'], function (globalize, listView, layoutManager, userSettings, focusManager, cardBuilder, loading, connectionManager, AlphaNumericShortcuts, scroller, playbackManager, AlphaPicker) {
|
||||
define(['globalize', 'listView', 'layoutManager', 'userSettings', 'focusManager', 'cardBuilder', 'loading', 'connectionManager', 'alphaNumericShortcuts', 'playbackManager', 'alphaPicker', 'emby-itemscontainer', 'emby-scroller'], function (globalize, listView, layoutManager, userSettings, focusManager, cardBuilder, loading, connectionManager, AlphaNumericShortcuts, playbackManager, AlphaPicker) {
|
||||
'use strict';
|
||||
|
||||
playbackManager = playbackManager.default || playbackManager;
|
||||
|
|
|
@ -1,15 +1,19 @@
|
|||
define(["browser", "dom", "css!./navdrawer", "scrollStyles"], function (browser, dom) {
|
||||
"use strict";
|
||||
/* Cleaning this file properly is not neecessary, since it's an outdated library
|
||||
* and will be replaced soon by a Vue component.
|
||||
*/
|
||||
|
||||
browser = browser.default || browser;
|
||||
import browser from 'browser';
|
||||
import dom from 'dom';
|
||||
import 'css!./navdrawer';
|
||||
import 'scrollStyles';
|
||||
|
||||
return function (options) {
|
||||
export default function (options) {
|
||||
function getTouches(e) {
|
||||
return e.changedTouches || e.targetTouches || e.touches;
|
||||
}
|
||||
|
||||
function onMenuTouchStart(e) {
|
||||
options.target.classList.remove("transition");
|
||||
options.target.classList.remove('transition');
|
||||
var touches = getTouches(e);
|
||||
var touch = touches[0] || {};
|
||||
menuTouchStartX = touch.clientX;
|
||||
|
@ -32,27 +36,27 @@ define(["browser", "dom", "css!./navdrawer", "scrollStyles"], function (browser,
|
|||
var deltaY = endY - (menuTouchStartY || 0);
|
||||
setVelocity(deltaX);
|
||||
|
||||
if (isOpen && 1 !== dragMode && deltaX > 0) {
|
||||
if (isOpen && dragMode !== 1 && deltaX > 0) {
|
||||
dragMode = 2;
|
||||
}
|
||||
|
||||
if (0 === dragMode && (!isOpen || Math.abs(deltaX) >= 10) && Math.abs(deltaY) < 5) {
|
||||
if (dragMode === 0 && (!isOpen || Math.abs(deltaX) >= 10) && Math.abs(deltaY) < 5) {
|
||||
dragMode = 1;
|
||||
scrollContainer.addEventListener("scroll", disableEvent);
|
||||
scrollContainer.addEventListener('scroll', disableEvent);
|
||||
self.showMask();
|
||||
} else if (0 === dragMode && Math.abs(deltaY) >= 5) {
|
||||
} else if (dragMode === 0 && Math.abs(deltaY) >= 5) {
|
||||
dragMode = 2;
|
||||
}
|
||||
|
||||
if (1 === dragMode) {
|
||||
if (dragMode === 1) {
|
||||
newPos = currentPos + deltaX;
|
||||
self.changeMenuPos();
|
||||
}
|
||||
}
|
||||
|
||||
function onMenuTouchEnd(e) {
|
||||
options.target.classList.add("transition");
|
||||
scrollContainer.removeEventListener("scroll", disableEvent);
|
||||
options.target.classList.add('transition');
|
||||
scrollContainer.removeEventListener('scroll', disableEvent);
|
||||
dragMode = 0;
|
||||
var touches = getTouches(e);
|
||||
var touch = touches[0] || {};
|
||||
|
@ -71,9 +75,9 @@ define(["browser", "dom", "css!./navdrawer", "scrollStyles"], function (browser,
|
|||
if (((getTouches(e)[0] || {}).clientX || 0) <= options.handleSize) {
|
||||
isPeeking = true;
|
||||
|
||||
if (e.type === "touchstart") {
|
||||
dom.removeEventListener(edgeContainer, "touchmove", onEdgeTouchMove, {});
|
||||
dom.addEventListener(edgeContainer, "touchmove", onEdgeTouchMove, {});
|
||||
if (e.type === 'touchstart') {
|
||||
dom.removeEventListener(edgeContainer, 'touchmove', onEdgeTouchMove, {});
|
||||
dom.addEventListener(edgeContainer, 'touchmove', onEdgeTouchMove, {});
|
||||
}
|
||||
|
||||
onMenuTouchStart(e);
|
||||
|
@ -90,7 +94,7 @@ define(["browser", "dom", "css!./navdrawer", "scrollStyles"], function (browser,
|
|||
function onEdgeTouchEnd(e) {
|
||||
if (isPeeking) {
|
||||
isPeeking = false;
|
||||
dom.removeEventListener(edgeContainer, "touchmove", onEdgeTouchMove, {});
|
||||
dom.removeEventListener(edgeContainer, 'touchmove', onEdgeTouchMove, {});
|
||||
onMenuTouchEnd(e);
|
||||
}
|
||||
}
|
||||
|
@ -144,8 +148,8 @@ define(["browser", "dom", "css!./navdrawer", "scrollStyles"], function (browser,
|
|||
function onMaskTransitionEnd() {
|
||||
var classList = mask.classList;
|
||||
|
||||
if (!classList.contains("backdrop")) {
|
||||
classList.add("hide");
|
||||
if (!classList.contains('backdrop')) {
|
||||
classList.add('hide');
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -157,10 +161,10 @@ define(["browser", "dom", "css!./navdrawer", "scrollStyles"], function (browser,
|
|||
var startPoint = 0;
|
||||
var countStart = 0;
|
||||
var velocity = 0;
|
||||
options.target.classList.add("transition");
|
||||
options.target.classList.add('transition');
|
||||
var dragMode = 0;
|
||||
var scrollContainer = options.target.querySelector(".mainDrawer-scrollContainer");
|
||||
scrollContainer.classList.add("scrollY");
|
||||
var scrollContainer = options.target.querySelector('.mainDrawer-scrollContainer');
|
||||
scrollContainer.classList.add('scrollY');
|
||||
|
||||
var TouchMenuLA = function () {
|
||||
self = this;
|
||||
|
@ -175,13 +179,13 @@ define(["browser", "dom", "css!./navdrawer", "scrollStyles"], function (browser,
|
|||
};
|
||||
|
||||
TouchMenuLA.prototype.initElements = function () {
|
||||
options.target.classList.add("touch-menu-la");
|
||||
options.target.style.width = options.width + "px";
|
||||
options.target.style.left = -options.width + "px";
|
||||
options.target.classList.add('touch-menu-la');
|
||||
options.target.style.width = options.width + 'px';
|
||||
options.target.style.left = -options.width + 'px';
|
||||
|
||||
if (!options.disableMask) {
|
||||
mask = document.createElement("div");
|
||||
mask.className = "tmla-mask hide";
|
||||
mask = document.createElement('div');
|
||||
mask.className = 'tmla-mask hide';
|
||||
document.body.appendChild(mask);
|
||||
dom.addEventListener(mask, dom.whichTransitionEvent(), onMaskTransitionEnd, {
|
||||
passive: true
|
||||
|
@ -192,12 +196,12 @@ define(["browser", "dom", "css!./navdrawer", "scrollStyles"], function (browser,
|
|||
var menuTouchStartX;
|
||||
var menuTouchStartY;
|
||||
var menuTouchStartTime;
|
||||
var edgeContainer = document.querySelector(".mainDrawerHandle");
|
||||
var edgeContainer = document.querySelector('.mainDrawerHandle');
|
||||
var isPeeking = false;
|
||||
|
||||
TouchMenuLA.prototype.animateToPosition = function (pos) {
|
||||
requestAnimationFrame(function () {
|
||||
options.target.style.transform = pos ? "translateX(" + pos + "px)" : "none";
|
||||
options.target.style.transform = pos ? 'translateX(' + pos + 'px)' : 'none';
|
||||
});
|
||||
};
|
||||
|
||||
|
@ -208,7 +212,7 @@ define(["browser", "dom", "css!./navdrawer", "scrollStyles"], function (browser,
|
|||
};
|
||||
|
||||
TouchMenuLA.prototype.clickMaskClose = function () {
|
||||
mask.addEventListener("click", function () {
|
||||
mask.addEventListener('click', function () {
|
||||
self.close();
|
||||
});
|
||||
};
|
||||
|
@ -235,7 +239,7 @@ define(["browser", "dom", "css!./navdrawer", "scrollStyles"], function (browser,
|
|||
this.animateToPosition(options.width);
|
||||
currentPos = options.width;
|
||||
this.isVisible = true;
|
||||
options.target.classList.add("drawer-open");
|
||||
options.target.classList.add('drawer-open');
|
||||
self.showMask();
|
||||
self.invoke(options.onChange);
|
||||
};
|
||||
|
@ -244,7 +248,7 @@ define(["browser", "dom", "css!./navdrawer", "scrollStyles"], function (browser,
|
|||
this.animateToPosition(0);
|
||||
currentPos = 0;
|
||||
self.isVisible = false;
|
||||
options.target.classList.remove("drawer-open");
|
||||
options.target.classList.remove('drawer-open');
|
||||
self.hideMask();
|
||||
self.invoke(options.onChange);
|
||||
};
|
||||
|
@ -261,13 +265,13 @@ define(["browser", "dom", "css!./navdrawer", "scrollStyles"], function (browser,
|
|||
var backgroundTouchStartTime;
|
||||
|
||||
TouchMenuLA.prototype.showMask = function () {
|
||||
mask.classList.remove("hide");
|
||||
mask.classList.add("backdrop");
|
||||
mask.classList.remove('hide');
|
||||
mask.classList.add('backdrop');
|
||||
};
|
||||
|
||||
TouchMenuLA.prototype.hideMask = function () {
|
||||
mask.classList.add("hide");
|
||||
mask.classList.remove("backdrop");
|
||||
mask.classList.add('hide');
|
||||
mask.classList.remove('backdrop');
|
||||
};
|
||||
|
||||
TouchMenuLA.prototype.invoke = function (fn) {
|
||||
|
@ -284,26 +288,26 @@ define(["browser", "dom", "css!./navdrawer", "scrollStyles"], function (browser,
|
|||
if (enabled) {
|
||||
if (!_edgeSwipeEnabled) {
|
||||
_edgeSwipeEnabled = true;
|
||||
dom.addEventListener(edgeContainer, "touchstart", onEdgeTouchStart, {
|
||||
dom.addEventListener(edgeContainer, 'touchstart', onEdgeTouchStart, {
|
||||
passive: true
|
||||
});
|
||||
dom.addEventListener(edgeContainer, "touchend", onEdgeTouchEnd, {
|
||||
dom.addEventListener(edgeContainer, 'touchend', onEdgeTouchEnd, {
|
||||
passive: true
|
||||
});
|
||||
dom.addEventListener(edgeContainer, "touchcancel", onEdgeTouchEnd, {
|
||||
dom.addEventListener(edgeContainer, 'touchcancel', onEdgeTouchEnd, {
|
||||
passive: true
|
||||
});
|
||||
}
|
||||
} else {
|
||||
if (_edgeSwipeEnabled) {
|
||||
_edgeSwipeEnabled = false;
|
||||
dom.removeEventListener(edgeContainer, "touchstart", onEdgeTouchStart, {
|
||||
dom.removeEventListener(edgeContainer, 'touchstart', onEdgeTouchStart, {
|
||||
passive: true
|
||||
});
|
||||
dom.removeEventListener(edgeContainer, "touchend", onEdgeTouchEnd, {
|
||||
dom.removeEventListener(edgeContainer, 'touchend', onEdgeTouchEnd, {
|
||||
passive: true
|
||||
});
|
||||
dom.removeEventListener(edgeContainer, "touchcancel", onEdgeTouchEnd, {
|
||||
dom.removeEventListener(edgeContainer, 'touchcancel', onEdgeTouchEnd, {
|
||||
passive: true
|
||||
});
|
||||
}
|
||||
|
@ -322,26 +326,26 @@ define(["browser", "dom", "css!./navdrawer", "scrollStyles"], function (browser,
|
|||
self.initElements();
|
||||
|
||||
if (browser.touch) {
|
||||
dom.addEventListener(options.target, "touchstart", onMenuTouchStart, {
|
||||
dom.addEventListener(options.target, 'touchstart', onMenuTouchStart, {
|
||||
passive: true
|
||||
});
|
||||
dom.addEventListener(options.target, "touchmove", onMenuTouchMove, {
|
||||
dom.addEventListener(options.target, 'touchmove', onMenuTouchMove, {
|
||||
passive: true
|
||||
});
|
||||
dom.addEventListener(options.target, "touchend", onMenuTouchEnd, {
|
||||
dom.addEventListener(options.target, 'touchend', onMenuTouchEnd, {
|
||||
passive: true
|
||||
});
|
||||
dom.addEventListener(options.target, "touchcancel", onMenuTouchEnd, {
|
||||
dom.addEventListener(options.target, 'touchcancel', onMenuTouchEnd, {
|
||||
passive: true
|
||||
});
|
||||
dom.addEventListener(mask, "touchstart", onBackgroundTouchStart, {
|
||||
dom.addEventListener(mask, 'touchstart', onBackgroundTouchStart, {
|
||||
passive: true
|
||||
});
|
||||
dom.addEventListener(mask, "touchmove", onBackgroundTouchMove, {});
|
||||
dom.addEventListener(mask, "touchend", onBackgroundTouchEnd, {
|
||||
dom.addEventListener(mask, 'touchmove', onBackgroundTouchMove, {});
|
||||
dom.addEventListener(mask, 'touchend', onBackgroundTouchEnd, {
|
||||
passive: true
|
||||
});
|
||||
dom.addEventListener(mask, "touchcancel", onBackgroundTouchEnd, {
|
||||
dom.addEventListener(mask, 'touchcancel', onBackgroundTouchEnd, {
|
||||
passive: true
|
||||
});
|
||||
}
|
||||
|
@ -350,5 +354,4 @@ define(["browser", "dom", "css!./navdrawer", "scrollStyles"], function (browser,
|
|||
};
|
||||
|
||||
return new TouchMenuLA();
|
||||
};
|
||||
});
|
||||
}
|
||||
|
|
|
@ -1,8 +1,13 @@
|
|||
define(['browser', 'layoutManager', 'dom', 'focusManager', 'ResizeObserver', 'scrollStyles'], function (browser, layoutManager, dom, focusManager, ResizeObserver) {
|
||||
'use strict';
|
||||
/* Cleaning this file properly is not neecessary, since it's an outdated library
|
||||
* and will be replaced soon by a Vue component.
|
||||
*/
|
||||
|
||||
browser = browser.default || browser;
|
||||
focusManager = focusManager.default || focusManager;
|
||||
import browser from 'browser';
|
||||
import layoutManager from 'layoutManager';
|
||||
import dom from 'dom';
|
||||
import focusManager from 'focusManager';
|
||||
import ResizeObserver from 'ResizeObserver';
|
||||
import 'scrollStyles';
|
||||
|
||||
/**
|
||||
* Return type of the value.
|
||||
|
@ -55,19 +60,8 @@ define(['browser', 'layoutManager', 'dom', 'focusManager', 'ResizeObserver', 'sc
|
|||
var dragTouchEvents = ['touchmove', 'touchend'];
|
||||
var wheelEvent = (document.implementation.hasFeature('Event.wheel', '3.0') ? 'wheel' : 'mousewheel');
|
||||
var interactiveElements = ['INPUT', 'SELECT', 'TEXTAREA'];
|
||||
var tmpArray = [];
|
||||
var time;
|
||||
|
||||
// Math shorthands
|
||||
var abs = Math.abs;
|
||||
var sqrt = Math.sqrt;
|
||||
var pow = Math.pow;
|
||||
var round = Math.round;
|
||||
var max = Math.max;
|
||||
var min = Math.min;
|
||||
|
||||
var scrollerFactory = function (frame, options) {
|
||||
|
||||
// Extend options
|
||||
var o = Object.assign({}, {
|
||||
slidee: null, // Selector, DOM element, or jQuery object with DOM element representing SLIDEE.
|
||||
|
@ -100,11 +94,9 @@ define(['browser', 'layoutManager', 'dom', 'focusManager', 'ResizeObserver', 'sc
|
|||
// native smooth scroll
|
||||
options.enableNativeScroll = true;
|
||||
} else if (options.requireAnimation && (browser.animate || browser.supportsCssAnimation())) {
|
||||
|
||||
// transform is the only way to guarantee animation
|
||||
options.enableNativeScroll = false;
|
||||
} else if (!layoutManager.tv || !browser.animate) {
|
||||
|
||||
options.enableNativeScroll = true;
|
||||
}
|
||||
|
||||
|
@ -165,9 +157,7 @@ define(['browser', 'layoutManager', 'dom', 'focusManager', 'ResizeObserver', 'sc
|
|||
var frameSize = 0;
|
||||
var slideeSize = 0;
|
||||
function ensureSizeInfo() {
|
||||
|
||||
if (requiresReflow) {
|
||||
|
||||
requiresReflow = false;
|
||||
|
||||
// Reset global variables
|
||||
|
@ -176,7 +166,7 @@ define(['browser', 'layoutManager', 'dom', 'focusManager', 'ResizeObserver', 'sc
|
|||
slideeSize = o.scrollWidth || Math.max(slideeElement[o.horizontal ? 'offsetWidth' : 'offsetHeight'], slideeElement[o.horizontal ? 'scrollWidth' : 'scrollHeight']);
|
||||
|
||||
// Set position limits & relativess
|
||||
self._pos.end = max(slideeSize - frameSize, 0);
|
||||
self._pos.end = Math.max(slideeSize - frameSize, 0);
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -189,11 +179,9 @@ define(['browser', 'layoutManager', 'dom', 'focusManager', 'ResizeObserver', 'sc
|
|||
* @return {Void}
|
||||
*/
|
||||
function load(isInit) {
|
||||
|
||||
requiresReflow = true;
|
||||
|
||||
if (!isInit) {
|
||||
|
||||
ensureSizeInfo();
|
||||
|
||||
// Fix possible overflowing
|
||||
|
@ -203,7 +191,6 @@ define(['browser', 'layoutManager', 'dom', 'focusManager', 'ResizeObserver', 'sc
|
|||
}
|
||||
|
||||
function initFrameResizeObserver() {
|
||||
|
||||
var observerOptions = {};
|
||||
|
||||
self.frameResizeObserver = new ResizeObserver(onResize, observerOptions);
|
||||
|
@ -228,16 +215,13 @@ define(['browser', 'layoutManager', 'dom', 'focusManager', 'ResizeObserver', 'sc
|
|||
};
|
||||
|
||||
function nativeScrollTo(container, pos, immediate) {
|
||||
|
||||
if (container.scroll) {
|
||||
if (o.horizontal) {
|
||||
|
||||
container.scroll({
|
||||
left: pos,
|
||||
behavior: immediate ? 'instant' : 'smooth'
|
||||
});
|
||||
} else {
|
||||
|
||||
container.scroll({
|
||||
top: pos,
|
||||
behavior: immediate ? 'instant' : 'smooth'
|
||||
|
@ -269,14 +253,12 @@ define(['browser', 'layoutManager', 'dom', 'focusManager', 'ResizeObserver', 'sc
|
|||
* @return {Void}
|
||||
*/
|
||||
self.slideTo = function (newPos, immediate, fullItemPos) {
|
||||
|
||||
ensureSizeInfo();
|
||||
var pos = self._pos;
|
||||
|
||||
newPos = within(newPos, pos.start, pos.end);
|
||||
|
||||
if (!transform) {
|
||||
|
||||
nativeScrollTo(nativeScrollElement, newPos, immediate);
|
||||
return;
|
||||
}
|
||||
|
@ -294,7 +276,6 @@ define(['browser', 'layoutManager', 'dom', 'focusManager', 'ResizeObserver', 'sc
|
|||
}
|
||||
|
||||
if (!immediate && o.skipSlideToWhenVisible && fullItemPos && fullItemPos.isVisible) {
|
||||
|
||||
return;
|
||||
}
|
||||
|
||||
|
@ -306,7 +287,6 @@ define(['browser', 'layoutManager', 'dom', 'focusManager', 'ResizeObserver', 'sc
|
|||
};
|
||||
|
||||
function setStyleProperty(elem, name, value, speed, resetTransition) {
|
||||
|
||||
var style = elem.style;
|
||||
|
||||
if (resetTransition || browser.edge) {
|
||||
|
@ -328,7 +308,6 @@ define(['browser', 'layoutManager', 'dom', 'focusManager', 'ResizeObserver', 'sc
|
|||
}
|
||||
|
||||
function renderAnimateWithTransform(fromPosition, toPosition, immediate) {
|
||||
|
||||
var speed = o.speed;
|
||||
|
||||
if (immediate) {
|
||||
|
@ -336,9 +315,9 @@ define(['browser', 'layoutManager', 'dom', 'focusManager', 'ResizeObserver', 'sc
|
|||
}
|
||||
|
||||
if (o.horizontal) {
|
||||
setStyleProperty(slideeElement, 'transform', 'translateX(' + (-round(toPosition)) + 'px)', speed);
|
||||
setStyleProperty(slideeElement, 'transform', 'translateX(' + (-Math.round(toPosition)) + 'px)', speed);
|
||||
} else {
|
||||
setStyleProperty(slideeElement, 'transform', 'translateY(' + (-round(toPosition)) + 'px)', speed);
|
||||
setStyleProperty(slideeElement, 'transform', 'translateY(' + (-Math.round(toPosition)) + 'px)', speed);
|
||||
}
|
||||
self._pos.cur = toPosition;
|
||||
|
||||
|
@ -346,7 +325,6 @@ define(['browser', 'layoutManager', 'dom', 'focusManager', 'ResizeObserver', 'sc
|
|||
}
|
||||
|
||||
function getBoundingClientRect(elem) {
|
||||
|
||||
// Support: BlackBerry 5, iOS 3 (original iPhone)
|
||||
// If we don't have gBCR, just use 0,0 rather than error
|
||||
if (elem.getBoundingClientRect) {
|
||||
|
@ -364,14 +342,10 @@ define(['browser', 'layoutManager', 'dom', 'focusManager', 'ResizeObserver', 'sc
|
|||
* @return {Object}
|
||||
*/
|
||||
self.getPos = function (item) {
|
||||
|
||||
var scrollElement = transform ? slideeElement : nativeScrollElement;
|
||||
var slideeOffset = getBoundingClientRect(scrollElement);
|
||||
var itemOffset = getBoundingClientRect(item);
|
||||
|
||||
var slideeStartPos = o.horizontal ? slideeOffset.left : slideeOffset.top;
|
||||
var slideeEndPos = o.horizontal ? slideeOffset.right : slideeOffset.bottom;
|
||||
|
||||
var offset = o.horizontal ? itemOffset.left - slideeOffset.left : itemOffset.top - slideeOffset.top;
|
||||
|
||||
var size = o.horizontal ? itemOffset.width : itemOffset.height;
|
||||
|
@ -408,7 +382,6 @@ define(['browser', 'layoutManager', 'dom', 'focusManager', 'ResizeObserver', 'sc
|
|||
};
|
||||
|
||||
self.getCenterPosition = function (item) {
|
||||
|
||||
ensureSizeInfo();
|
||||
|
||||
var pos = self.getPos(item);
|
||||
|
@ -453,7 +426,6 @@ define(['browser', 'layoutManager', 'dom', 'focusManager', 'ResizeObserver', 'sc
|
|||
|
||||
// Bind dragging events
|
||||
if (transform) {
|
||||
|
||||
if (isTouch) {
|
||||
dragTouchEvents.forEach(function (eventName) {
|
||||
dom.addEventListener(document, eventName, dragHandler, {
|
||||
|
@ -482,7 +454,7 @@ define(['browser', 'layoutManager', 'dom', 'focusManager', 'ResizeObserver', 'sc
|
|||
var pointer = dragging.touch ? event[dragging.released ? 'changedTouches' : 'touches'][0] : event;
|
||||
dragging.pathX = pointer.pageX - dragging.initX;
|
||||
dragging.pathY = pointer.pageY - dragging.initY;
|
||||
dragging.path = sqrt(pow(dragging.pathX, 2) + pow(dragging.pathY, 2));
|
||||
dragging.path = Math.sqrt(Math.pow(dragging.pathX, 2) + Math.pow(dragging.pathY, 2));
|
||||
dragging.delta = o.horizontal ? dragging.pathX : dragging.pathY;
|
||||
|
||||
if (!dragging.released && dragging.path < 1) {
|
||||
|
@ -499,7 +471,7 @@ define(['browser', 'layoutManager', 'dom', 'focusManager', 'ResizeObserver', 'sc
|
|||
} else {
|
||||
// If dragging path is sufficiently long we can confidently start a drag
|
||||
// if drag is in different direction than scroll, ignore it
|
||||
if (o.horizontal ? abs(dragging.pathX) > abs(dragging.pathY) : abs(dragging.pathX) < abs(dragging.pathY)) {
|
||||
if (o.horizontal ? Math.abs(dragging.pathX) > Math.abs(dragging.pathY) : Math.abs(dragging.pathX) < Math.abs(dragging.pathY)) {
|
||||
dragging.init = 1;
|
||||
} else {
|
||||
return dragEnd();
|
||||
|
@ -520,7 +492,7 @@ define(['browser', 'layoutManager', 'dom', 'focusManager', 'ResizeObserver', 'sc
|
|||
dragEnd();
|
||||
}
|
||||
|
||||
self.slideTo(round(dragging.initPos - dragging.delta));
|
||||
self.slideTo(Math.round(dragging.initPos - dragging.delta));
|
||||
}
|
||||
|
||||
/**
|
||||
|
@ -557,9 +529,7 @@ define(['browser', 'layoutManager', 'dom', 'focusManager', 'ResizeObserver', 'sc
|
|||
* @return {Boolean}
|
||||
*/
|
||||
function isInteractive(element) {
|
||||
|
||||
while (element) {
|
||||
|
||||
if (interactiveElements.indexOf(element.tagName) !== -1) {
|
||||
return true;
|
||||
}
|
||||
|
@ -595,7 +565,6 @@ define(['browser', 'layoutManager', 'dom', 'focusManager', 'ResizeObserver', 'sc
|
|||
* @return {Void}
|
||||
*/
|
||||
function scrollHandler(event) {
|
||||
|
||||
ensureSizeInfo();
|
||||
var pos = self._pos;
|
||||
// Ignore if there is no scrolling to be done
|
||||
|
@ -612,7 +581,6 @@ define(['browser', 'layoutManager', 'dom', 'focusManager', 'ResizeObserver', 'sc
|
|||
|
||||
self.slideBy(o.scrollBy * delta);
|
||||
} else {
|
||||
|
||||
if (isSmoothScrollSupported) {
|
||||
delta *= 12;
|
||||
}
|
||||
|
@ -631,7 +599,6 @@ define(['browser', 'layoutManager', 'dom', 'focusManager', 'ResizeObserver', 'sc
|
|||
* @return {Void}
|
||||
*/
|
||||
self.destroy = function () {
|
||||
|
||||
if (self.frameResizeObserver) {
|
||||
self.frameResizeObserver.disconnect();
|
||||
self.frameResizeObserver = null;
|
||||
|
@ -667,11 +634,9 @@ define(['browser', 'layoutManager', 'dom', 'focusManager', 'ResizeObserver', 'sc
|
|||
var contentRect = {};
|
||||
|
||||
function onResize(entries) {
|
||||
|
||||
var entry = entries[0];
|
||||
|
||||
if (entry) {
|
||||
|
||||
var newRect = entry.contentRect;
|
||||
|
||||
// handle element being hidden
|
||||
|
@ -680,7 +645,6 @@ define(['browser', 'layoutManager', 'dom', 'focusManager', 'ResizeObserver', 'sc
|
|||
}
|
||||
|
||||
if (newRect.width !== contentRect.width || newRect.height !== contentRect.height) {
|
||||
|
||||
contentRect = newRect;
|
||||
|
||||
load(false);
|
||||
|
@ -706,7 +670,6 @@ define(['browser', 'layoutManager', 'dom', 'focusManager', 'ResizeObserver', 'sc
|
|||
}
|
||||
|
||||
self.getScrollPosition = function () {
|
||||
|
||||
if (transform) {
|
||||
return self._pos.cur;
|
||||
}
|
||||
|
@ -719,7 +682,6 @@ define(['browser', 'layoutManager', 'dom', 'focusManager', 'ResizeObserver', 'sc
|
|||
};
|
||||
|
||||
self.getScrollSize = function () {
|
||||
|
||||
if (transform) {
|
||||
return slideeSize;
|
||||
}
|
||||
|
@ -795,7 +757,6 @@ define(['browser', 'layoutManager', 'dom', 'focusManager', 'ResizeObserver', 'sc
|
|||
initFrameResizeObserver();
|
||||
|
||||
if (transform) {
|
||||
|
||||
dom.addEventListener(dragSourceElement, 'touchstart', dragInitSlidee, {
|
||||
passive: true
|
||||
});
|
||||
|
@ -812,9 +773,7 @@ define(['browser', 'layoutManager', 'dom', 'focusManager', 'ResizeObserver', 'sc
|
|||
passive: true
|
||||
});
|
||||
}
|
||||
|
||||
} else if (o.horizontal) {
|
||||
|
||||
// Don't bind to mouse events with vertical scroll since the mouse wheel can handle this natively
|
||||
|
||||
if (o.mouseWheel) {
|
||||
|
@ -924,5 +883,4 @@ define(['browser', 'layoutManager', 'dom', 'focusManager', 'ResizeObserver', 'sc
|
|||
return Promise.resolve(instance);
|
||||
};
|
||||
|
||||
return scrollerFactory;
|
||||
});
|
||||
export default scrollerFactory;
|
||||
|
|
|
@ -806,6 +806,8 @@ define(['dom', 'layoutManager', 'inputManager', 'connectionManager', 'events', '
|
|||
navDrawerScrollContainer.addEventListener('click', onMainDrawerClick);
|
||||
return new Promise(function (resolve, reject) {
|
||||
require(['navdrawer'], function (navdrawer) {
|
||||
navdrawer = navdrawer.default || navdrawer;
|
||||
|
||||
navDrawerInstance = new navdrawer(getNavDrawerOptions());
|
||||
|
||||
if (!layoutManager.tv) {
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue