67 lines
2.2 KiB
JavaScript
67 lines
2.2 KiB
JavaScript
|
// Extensions
|
||
|
|
import { Service } from '../service'; // Utilities
|
||
|
|
|
||
|
|
import * as easingPatterns from './easing-patterns';
|
||
|
|
import { getContainer, getOffset } from './util';
|
||
|
|
export default function goTo(_target, _settings = {}) {
|
||
|
|
const settings = {
|
||
|
|
container: document.scrollingElement || document.body || document.documentElement,
|
||
|
|
duration: 500,
|
||
|
|
offset: 0,
|
||
|
|
easing: 'easeInOutCubic',
|
||
|
|
appOffset: true,
|
||
|
|
..._settings
|
||
|
|
};
|
||
|
|
const container = getContainer(settings.container);
|
||
|
|
/* istanbul ignore else */
|
||
|
|
|
||
|
|
if (settings.appOffset && goTo.framework.application) {
|
||
|
|
const isDrawer = container.classList.contains('v-navigation-drawer');
|
||
|
|
const isClipped = container.classList.contains('v-navigation-drawer--clipped');
|
||
|
|
const {
|
||
|
|
bar,
|
||
|
|
top
|
||
|
|
} = goTo.framework.application;
|
||
|
|
settings.offset += bar;
|
||
|
|
/* istanbul ignore else */
|
||
|
|
|
||
|
|
if (!isDrawer || isClipped) settings.offset += top;
|
||
|
|
}
|
||
|
|
|
||
|
|
const startTime = performance.now();
|
||
|
|
const targetLocation = getOffset(_target) - settings.offset;
|
||
|
|
const startLocation = container.scrollTop;
|
||
|
|
if (targetLocation === startLocation) return Promise.resolve(targetLocation);
|
||
|
|
const ease = typeof settings.easing === 'function' ? settings.easing : easingPatterns[settings.easing];
|
||
|
|
/* istanbul ignore else */
|
||
|
|
|
||
|
|
if (!ease) throw new TypeError(`Easing function "${settings.easing}" not found.`); // Cannot be tested properly in jsdom
|
||
|
|
// tslint:disable-next-line:promise-must-complete
|
||
|
|
|
||
|
|
/* istanbul ignore next */
|
||
|
|
|
||
|
|
return new Promise(resolve => requestAnimationFrame(function step(currentTime) {
|
||
|
|
const timeElapsed = currentTime - startTime;
|
||
|
|
const progress = Math.abs(settings.duration ? Math.min(timeElapsed / settings.duration, 1) : 1);
|
||
|
|
container.scrollTop = Math.floor(startLocation + (targetLocation - startLocation) * ease(progress));
|
||
|
|
|
||
|
|
if (progress === 1 || container.clientHeight + container.scrollTop === container.scrollHeight) {
|
||
|
|
return resolve(targetLocation);
|
||
|
|
}
|
||
|
|
|
||
|
|
requestAnimationFrame(step);
|
||
|
|
}));
|
||
|
|
}
|
||
|
|
goTo.framework = {};
|
||
|
|
|
||
|
|
goTo.init = () => {};
|
||
|
|
|
||
|
|
export class Goto extends Service {
|
||
|
|
constructor() {
|
||
|
|
super();
|
||
|
|
return goTo;
|
||
|
|
}
|
||
|
|
|
||
|
|
}
|
||
|
|
Goto.property = 'goTo';
|
||
|
|
//# sourceMappingURL=index.js.map
|