vevet 2.17.0 → 3.0.0-beta.0

package/build/cjs/utils/math/clamp.js

@@ -1,16 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-/**
- * Clamp the value between two points
- */
-function clamp(val, scope) {
-    if (scope === void 0) { scope = [0, 1]; }
-    if (val < scope[0]) {
-        return scope[0];
-    }
-    if (val > scope[1]) {
-        return scope[1];
-    }
-    return val;
-}
-exports.default = clamp;

package/build/cjs/utils/math/clampScope.js

@@ -1,16 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var scoped_1 = __importDefault(require("./scoped"));
-var clamp_1 = __importDefault(require("./clamp"));
-/**
- * Get progress relatively to the scope and clamp it within two points
- */
-function clampScoped(val, scope, clampScope) {
-    if (scope === void 0) { scope = [0, 1]; }
-    if (clampScope === void 0) { clampScope = [0, 1]; }
-    return (0, clamp_1.default)((0, scoped_1.default)(val, scope), clampScope);
-}
-exports.default = clampScoped;

package/build/cjs/utils/math/easing.js

@@ -1,11 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var easing_progress_1 = __importDefault(require("easing-progress"));
-/**
- * Easing progress
- */
-var easing = easing_progress_1.default;
-exports.default = easing;

package/build/cjs/utils/math/inScope.js

@@ -1,10 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-/**
- * Check if the value is within the scope
- */
-function inScope(val, scopeValue) {
-    if (scopeValue === void 0) { scopeValue = [0, 1]; }
-    return val >= scopeValue[0] && val <= scopeValue[1];
-}
-exports.default = inScope;

package/build/cjs/utils/math/index.js

@@ -1,22 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.easing = exports.wrap = exports.clampScope = exports.inScope = exports.spreadScope = exports.scoped = exports.lerp = exports.clamp = void 0;
-var clamp_1 = __importDefault(require("./clamp"));
-exports.clamp = clamp_1.default;
-var lerp_1 = __importDefault(require("./lerp"));
-exports.lerp = lerp_1.default;
-var scoped_1 = __importDefault(require("./scoped"));
-exports.scoped = scoped_1.default;
-var spreadScope_1 = __importDefault(require("./spreadScope"));
-exports.spreadScope = spreadScope_1.default;
-var inScope_1 = __importDefault(require("./inScope"));
-exports.inScope = inScope_1.default;
-var clampScope_1 = __importDefault(require("./clampScope"));
-exports.clampScope = clampScope_1.default;
-var wrap_1 = __importDefault(require("./wrap"));
-exports.wrap = wrap_1.default;
-var easing_1 = __importDefault(require("./easing"));
-exports.easing = easing_1.default;

package/build/cjs/utils/math/lerp.js

@@ -1,15 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-/**
- * Linear interpolation
- */
-function lerp(current, target, ease, approximationLeft) {
-    if (approximationLeft === void 0) { approximationLeft = 0.001; }
-    var val = current * (1 - ease) + target * ease;
-    var diff = Math.abs(target - val);
-    if (diff <= approximationLeft) {
-        return target;
-    }
-    return val;
-}
-exports.default = lerp;

package/build/cjs/utils/math/scoped.js

@@ -1,18 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-/**
- * Get progress relatively to the scope.
- *
- * @example
- *
- * scope(.35, [0, 1]);
- * // => .5
- * scope(.35, [.25, 1]);
- * // => .133
- */
-function scoped(val, scopeValue) {
-    if (scopeValue === void 0) { scopeValue = [0, 1]; }
-    var result = (val - scopeValue[0]) / (scopeValue[1] - scopeValue[0]);
-    return result;
-}
-exports.default = scoped;

package/build/cjs/utils/math/spreadScope.js

@@ -1,18 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-/**
- * Distribute scope progress among a certain quantity of timelines.
- */
-function spreadScope(quantity, shift) {
-    var timelines = [];
-    // duration for each element
-    var duration = 1 / (quantity - shift * (quantity - 1));
-    // calculate timelines
-    for (var index = 0; index < quantity; index += 1) {
-        var start = (duration * (1 - shift)) * index;
-        var end = start + duration;
-        timelines.push([start, end]);
-    }
-    return timelines;
-}
-exports.default = spreadScope;

package/build/cjs/utils/math/wrap.js

@@ -1,13 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-/**
- * Wrap values
- */
-function wrap(min, max, value) {
-    var range = max - min;
-    return conditionalReturn(value, function (val) { return ((range + ((val - min) % range)) % range) + min; });
-}
-exports.default = wrap;
-function conditionalReturn(value, func) {
-    return value || value === 0 ? func(value) : func;
-}

package/build/cjs/utils/scroll/getScrollValues.js

@@ -1,20 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-/**
- * Get scroll values of a certain element
- */
-function getScrollValues(selector) {
-    if (selector === void 0) { selector = window; }
-    if (selector) {
-        var scrollTop = selector instanceof Window
-            ? selector.pageYOffset : selector.scrollTop;
-        var scrollLeft = selector instanceof Window
-            ? selector.pageXOffset : selector.scrollLeft;
-        return {
-            scrollTop: scrollTop,
-            scrollLeft: scrollLeft,
-        };
-    }
-    return undefined;
-}
-exports.default = getScrollValues;

package/build/cjs/utils/scroll/index.js

@@ -1,12 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.toElement = exports.to = exports.getValues = void 0;
-var getScrollValues_1 = __importDefault(require("./getScrollValues"));
-exports.getValues = getScrollValues_1.default;
-var scrollTo_1 = __importDefault(require("./scrollTo"));
-exports.to = scrollTo_1.default;
-var scrollToElement_1 = __importDefault(require("./scrollToElement"));
-exports.toElement = scrollToElement_1.default;

package/build/cjs/utils/scroll/scrollTo.js

@@ -1,41 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var Timeline_1 = require("../../components/timeline/Timeline");
-var getScrollValues_1 = __importDefault(require("./getScrollValues"));
-/**
- * Scroll to coordinates
- */
-function scrollTo(_a) {
-    var _b = _a.container, container = _b === void 0 ? window : _b, _c = _a.top, top = _c === void 0 ? 0 : _c, _d = _a.left, left = _d === void 0 ? 0 : _d, _e = _a.duration, duration = _e === void 0 ? 250 : _e;
-    return new Promise(function (resolve, reject) {
-        // save start values
-        var startValues = (0, getScrollValues_1.default)(container);
-        if (startValues) {
-            // create animation
-            var timeline = new Timeline_1.Timeline({
-                duration: duration,
-            });
-            timeline.addCallback('progress', function (data) {
-                if (container) {
-                    container.scrollTo({
-                        top: startValues.scrollTop
-                            + (top - startValues.scrollTop) * data.easing,
-                        left: startValues.scrollLeft
-                            + (left - startValues.scrollLeft) * data.easing,
-                        behavior: 'auto',
-                    });
-                }
-            });
-            timeline.addCallback('end', function () {
-                resolve();
-            });
-            timeline.play();
-            return;
-        }
-        reject();
-    });
-}
-exports.default = scrollTo;

package/build/cjs/utils/scroll/scrollToElement.js

@@ -1,39 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var vevet_dom_1 = require("vevet-dom");
-var getScrollValues_1 = __importDefault(require("./getScrollValues"));
-var clamp_1 = __importDefault(require("../math/clamp"));
-var scrollTo_1 = __importDefault(require("./scrollTo"));
-/**
- * Scroll to element
- */
-function scrollToElement(_a) {
-    var _b = _a.container, container = _b === void 0 ? window : _b, el = _a.el, _c = _a.top, top = _c === void 0 ? 0 : _c, _d = _a.left, left = _d === void 0 ? 0 : _d, _e = _a.duration, duration = _e === void 0 ? 250 : _e;
-    return new Promise(function (resolve, reject) {
-        var startValues = (0, getScrollValues_1.default)(container);
-        if (startValues) {
-            var element = (0, vevet_dom_1.selectOne)(el);
-            if (element) {
-                var bounding = element.getBoundingClientRect();
-                var toTop = (0, clamp_1.default)(bounding.top + startValues.scrollTop - top, [0, Infinity]);
-                var toLeft = (0, clamp_1.default)(bounding.left + startValues.scrollLeft - left, [0, Infinity]);
-                (0, scrollTo_1.default)({
-                    container: container,
-                    top: toTop,
-                    left: toLeft,
-                    duration: duration,
-                }).then(function () {
-                    resolve();
-                }).catch(function () {
-                    reject();
-                });
-            }
-            return;
-        }
-        reject();
-    });
-}
-exports.default = scrollToElement;

package/build/cjs/utils/types/general.js

@@ -1,2 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });

package/build/cjs/utils/types/utility.js

@@ -1,2 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });

package/build/cjs/version.js

@@ -1,4 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-var version = '2.17.0';
-exports.default = version;

package/build/es/app/Application.js

@@ -1,236 +0,0 @@
-import isMobileJs from 'ismobilejs';
-import { detect } from 'detect-browser';
-import PCancelable from 'p-cancelable';
-import { Viewport } from './events/Viewport';
-import { PageLoad } from './events/PageLoad';
-import version from '../version';
-/**
- * Vevet Application
- */
-export class Application {
-    /**
-     * @example
-     * const app = Application({
-     *     page: 'home'
-     * });
-     */
-    constructor(data = {}) {
-        /**
-         * Pages (instances)
-         */
-        this._pages = [];
-        /**
-         * Current Page (instance).
-         */
-        this._page = false;
-        // check if the application already exists
-        if (window.vevetApp) {
-            throw new Error('Vevet Application already exists!');
-        }
-        // set defaults
-        this._prop = Object.assign(Object.assign({}, this.defaultProp), data);
-        this._prefix = this.prop.prefix;
-        // initialize the application
-        // Define that you're using Vevet
-        this._sayHi();
-        // add the application to the window
-        window.vevetApp = this;
-        // get type of device
-        const ifmobile = isMobileJs();
-        this._isPhone = ifmobile.phone;
-        this.html.classList.toggle(`${this.prefix}phone`, this._isPhone);
-        this._isTablet = ifmobile.tablet;
-        this.html.classList.toggle(`${this.prefix}tablet`, this._isTablet);
-        this._isMobile = ifmobile.phone || ifmobile.tablet;
-        this.html.classList.toggle(`${this.prefix}mobile`, this._isMobile);
-        this._isDesktop = !this._isMobile;
-        this.html.classList.toggle(`${this.prefix}desktop`, this._isDesktop);
-        // get browser info
-        const browserData = detect();
-        // get OS name
-        if (browserData === null || browserData === void 0 ? void 0 : browserData.os) {
-            const osName = browserData.os.split(' ')[0].toLowerCase();
-            this.html.classList.add(`${this.prefix}os-${osName}`);
-            this._osName = osName;
-        }
-        else {
-            this._osName = '';
-        }
-        // get browser name
-        if (browserData === null || browserData === void 0 ? void 0 : browserData.name) {
-            const browserName = browserData.name.toLowerCase();
-            this.html.classList.add(`${this.prefix}browser-${browserName}`);
-            this._browserName = browserName;
-        }
-        else {
-            this._browserName = '';
-        }
-        // browserData
-        // create default helpers
-        this._pageLoad = new PageLoad();
-        this._viewport = new Viewport();
-        // check webp support
-        if (this.prop.webpSupport) {
-            const testWebP = new Image();
-            testWebP.onload = () => {
-                this._supportsWebp = testWebP.width === 1;
-            };
-            testWebP.onerror = () => {
-                this._supportsWebp = false;
-            };
-            testWebP.src = 'data:image/webp;base64,UklGRiQAAABXRUJQVlA4IBgAAAAwAQCdASoBAAEAAwA0JaQAA3AA/vuUAAA=';
-        }
-        else {
-            this._supportsWebp = false;
-        }
-    }
-    get version() {
-        return version;
-    }
-    /**
-     * Application properties.
-     */
-    get prop() {
-        return this._prop;
-    }
-    /**
-     * Default properties.
-     */
-    get defaultProp() {
-        return {
-            sayHi: true,
-            tablet: 1199,
-            phone: 899,
-            prefix: 'v-',
-            easing: [0.25, 0.1, 0.25, 1],
-            viewportResizeTimeout: 0,
-            webpSupport: false,
-        };
-    }
-    get prefix() {
-        return this._prefix;
-    }
-    get isPhone() {
-        return this._isPhone;
-    }
-    get isTablet() {
-        return this._isTablet;
-    }
-    get isMobile() {
-        return this._isMobile;
-    }
-    get isDesktop() {
-        return this._isDesktop;
-    }
-    get osName() {
-        return this._osName;
-    }
-    get browserName() {
-        return this._browserName;
-    }
-    get supportsWebp() {
-        return this._supportsWebp;
-    }
-    /**
-     * Get document element.
-     */
-    get doc() {
-        return document;
-    }
-    /**
-     * Get HTML element
-     */
-    get html() {
-        return document.documentElement;
-    }
-    /**
-     * Get body element.
-     */
-    get body() {
-        return document.body;
-    }
-    /**
-     * Get an array of existing pages.
-     * A new element is added to the array when {@linkcode Vevet.Page.create} is called.
-     */
-    get pages() {
-        return this._pages;
-    }
-    /**
-     * Get the current page instance.
-     */
-    get page() {
-        return this._page;
-    }
-    /**
-     * Set the current page instance.
-     */
-    set page(val) {
-        this._page = val;
-    }
-    /**
-     * Action on page created
-     */
-    onPageCreated() {
-        return new PCancelable((resolve) => {
-            if (this._page) {
-                this._page.onCreate().then(() => {
-                    resolve(this.page);
-                });
-                return;
-            }
-            setTimeout(() => {
-                this.onPageCreated().then(() => {
-                    resolve(this.page);
-                });
-            }, 30);
-        });
-    }
-    /**
-     * Action on page shown
-     */
-    onPageShown() {
-        return new PCancelable((resolve) => {
-            this.onPageCreated().then(() => {
-                if (this._page) {
-                    this._page.onShow().then(() => {
-                        resolve(this.page);
-                    });
-                }
-            });
-        });
-    }
-    get pageLoad() {
-        return this._pageLoad;
-    }
-    /**
-     * Action on page laoded
-     */
-    onPageLoaded() {
-        return new PCancelable((resolve) => {
-            this._pageLoad.onLoaded(() => {
-                resolve();
-            });
-        });
-    }
-    get viewport() {
-        return this._viewport;
-    }
-    /**
-     * Defines that you're using Vevet.
-     */
-    _sayHi() {
-        if (!this.prop.sayHi) {
-            return;
-        }
-        const msg = `Vevet ${this.version}`;
-        const style = [
-            'padding: 1rem 1.5rem;',
-            'background: #5F2580;',
-            'font: 1rem/1 Arial;',
-            'color: #ffffff;',
-        ].join('');
-        // eslint-disable-next-line no-console
-        console.log('%c%s', style, msg);
-    }
-}

package/build/es/app/events/PageLoad.js

@@ -1,47 +0,0 @@
-import { Callbacks } from '../../base/Callbacks';
-/**
- * Callbacks on page loaded.
- */
-export class PageLoad extends Callbacks {
-    constructor() {
-        super(false);
-        this._loaded = false;
-        this._init();
-    }
-    get loaded() {
-        return this._loaded;
-    }
-    _setEvents() {
-        if (document.readyState === 'complete') {
-            this._handleLoaded();
-        }
-        else {
-            window.addEventListener('load', () => {
-                this._handleLoaded();
-            });
-        }
-    }
-    /**
-     * When the page is loaded.
-     */
-    _handleLoaded() {
-        const app = this._app;
-        const { prefix } = app;
-        this._loaded = true;
-        app.html.classList.remove(`${prefix}loading`);
-        app.body.classList.remove(`${prefix}loading`);
-        app.html.classList.add(`${prefix}loaded`);
-        this.tbt('', false);
-    }
-    /**
-     * Add a callback on page load.
-     * If the page is already loaded, the callback will be immediately triggered.
-     */
-    onLoaded(callback) {
-        if (this.loaded) {
-            callback();
-            return undefined;
-        }
-        return this.add('', callback.bind(this));
-    }
-}