1
0
mirror of https://github.com/webslides/WebSlides.git synced 2025-08-17 18:37:00 +02:00

Scrollable container is now defined

This commit is contained in:
Antonio Laguna
2017-02-27 12:44:16 +01:00
parent f6ccd39158
commit 33b1f3ad7a

View File

@@ -1,33 +1,6 @@
import Easings from './easing'; import Easings from './easing';
let SCROLLABLE_CONTAINER = getScrollableContainer(); let SCROLLABLE_CONTAINER = document.getElementById('webslides');
/**
* Returns the correct DOM element to be used for scrolling the
* page, due to Firefox not scrolling on document.body.
* @return {Element} Scrollable Element.
*/
function getScrollableContainer() {
if (SCROLLABLE_CONTAINER) {
return SCROLLABLE_CONTAINER;
}
const documentElement = window.document.documentElement;
let scrollableContainer;
documentElement.scrollTop = 1;
if (documentElement.scrollTop === 1) {
documentElement.scrollTop = 0;
scrollableContainer = documentElement;
} else {
scrollableContainer = document.body;
}
SCROLLABLE_CONTAINER = scrollableContainer;
return scrollableContainer;
}
/** /**
* Smoothly scrolls to a given Y position using Easing.Swing. It'll run a * Smoothly scrolls to a given Y position using Easing.Swing. It'll run a
@@ -36,14 +9,13 @@ function getScrollableContainer() {
* @param {number} duration Duration of the animation. 500ms by default. * @param {number} duration Duration of the animation. 500ms by default.
* @param {function} cb Callback function to call upon completion. * @param {function} cb Callback function to call upon completion.
*/ */
function scrollTo(y, duration = 500, cb = () => {}) { export default function scrollTo(y, duration = 500, cb = () => {}) {
const scrollableContainer = getScrollableContainer(); const delta = y - SCROLLABLE_CONTAINER.scrollTop;
const delta = y - scrollableContainer.scrollTop; const startLocation = SCROLLABLE_CONTAINER.scrollTop;
const startLocation = scrollableContainer.scrollTop;
const increment = 16; const increment = 16;
if (!duration) { if (!duration) {
scrollableContainer.scrollTop = y; SCROLLABLE_CONTAINER.scrollTop = y;
cb(); cb();
return; return;
} }
@@ -58,7 +30,7 @@ function scrollTo(y, duration = 500, cb = () => {}) {
delta, delta,
duration); duration);
scrollableContainer.scrollTop = Math.floor(startLocation + SCROLLABLE_CONTAINER.scrollTop = Math.floor(startLocation +
(easingP * delta)); (easingP * delta));
if (elapsedTime < duration) { if (elapsedTime < duration) {
@@ -70,5 +42,3 @@ function scrollTo(y, duration = 500, cb = () => {}) {
animateScroll(0); animateScroll(0);
} }
export default { getScrollableContainer, scrollTo };