/*! Shifty 2.20.4 - https://github.com/jeremyckahn/shifty */
(function webpackUniversalModuleDefinition(root, factory) {
if(typeof exports === 'object' && typeof module === 'object')
module.exports = factory();
else if(typeof define === 'function' && define.amd)
define("shifty", [], factory);
else if(typeof exports === 'object')
exports["shifty"] = factory();
else
root["shifty"] = factory();
})(global, function() {
return /******/ (() => { // webpackBootstrap
/******/ "use strict";
/******/ var __webpack_modules__ = ({
/***/ 720:
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
// ESM COMPAT FLAG
__webpack_require__.r(__webpack_exports__);
// EXPORTS
__webpack_require__.d(__webpack_exports__, {
"Scene": () => /* reexport */ Scene,
"Tweenable": () => /* reexport */ Tweenable,
"interpolate": () => /* reexport */ interpolate,
"processTweens": () => /* reexport */ processTweens,
"setBezierFunction": () => /* reexport */ setBezierFunction,
"shouldScheduleUpdate": () => /* reexport */ shouldScheduleUpdate,
"tween": () => /* reexport */ tween,
"unsetBezierFunction": () => /* reexport */ unsetBezierFunction
});
// NAMESPACE OBJECT: ./src/easing-functions.js
var easing_functions_namespaceObject = {};
__webpack_require__.r(easing_functions_namespaceObject);
__webpack_require__.d(easing_functions_namespaceObject, {
"bounce": () => bounce,
"bouncePast": () => bouncePast,
"easeFrom": () => easeFrom,
"easeFromTo": () => easeFromTo,
"easeInBack": () => easeInBack,
"easeInCirc": () => easeInCirc,
"easeInCubic": () => easeInCubic,
"easeInExpo": () => easeInExpo,
"easeInOutBack": () => easeInOutBack,
"easeInOutCirc": () => easeInOutCirc,
"easeInOutCubic": () => easeInOutCubic,
"easeInOutExpo": () => easeInOutExpo,
"easeInOutQuad": () => easeInOutQuad,
"easeInOutQuart": () => easeInOutQuart,
"easeInOutQuint": () => easeInOutQuint,
"easeInOutSine": () => easeInOutSine,
"easeInQuad": () => easeInQuad,
"easeInQuart": () => easeInQuart,
"easeInQuint": () => easeInQuint,
"easeInSine": () => easeInSine,
"easeOutBack": () => easeOutBack,
"easeOutBounce": () => easeOutBounce,
"easeOutCirc": () => easeOutCirc,
"easeOutCubic": () => easeOutCubic,
"easeOutExpo": () => easeOutExpo,
"easeOutQuad": () => easeOutQuad,
"easeOutQuart": () => easeOutQuart,
"easeOutQuint": () => easeOutQuint,
"easeOutSine": () => easeOutSine,
"easeTo": () => easeTo,
"elastic": () => elastic,
"linear": () => linear,
"swingFrom": () => swingFrom,
"swingFromTo": () => swingFromTo,
"swingTo": () => swingTo
});
// NAMESPACE OBJECT: ./src/token.js
var token_namespaceObject = {};
__webpack_require__.r(token_namespaceObject);
__webpack_require__.d(token_namespaceObject, {
"afterTween": () => afterTween,
"beforeTween": () => beforeTween,
"doesApply": () => doesApply,
"tweenCreated": () => tweenCreated
});
;// CONCATENATED MODULE: ./src/easing-functions.js
/** @typedef {import(".").shifty.easingFunction} shifty.easingFunction */
/*!
* All equations are adapted from Thomas Fuchs'
* [Scripty2](https://github.com/madrobby/scripty2/blob/master/src/effects/transitions/penner.js).
*
* Based on Easing Equations (c) 2003 [Robert
* Penner](http://www.robertpenner.com/), all rights reserved. This work is
* [subject to terms](http://www.robertpenner.com/easing_terms_of_use.html).
*/
/*!
* TERMS OF USE - EASING EQUATIONS
* Open source under the BSD License.
* Easing Equations (c) 2003 Robert Penner, all rights reserved.
*/
/**
* @member Tweenable.formulas
* @description A static Object of {@link shifty.easingFunction}s that can by
* used by Shifty. The default values are defined in
* [`easing-functions.js`](easing-functions.js.html), but you can add your own
* {@link shifty.easingFunction}s by defining them as keys to this Object.
*
* Shifty ships with an implementation of [Robert Penner's easing
* equations](http://robertpenner.com/easing/), as adapted from
* [Scripty2](https://github.com/madrobby/scripty2/blob/master/src/effects/transitions/penner.js)'s
* implementation.
*
See the Pen Shifty - Easing formula
* names by Jeremy Kahn (@jeremyckahn) on CodePen.
*
* @type {Object.}
* @static
*/
/**
* @memberof Tweenable.formulas
* @type {shifty.easingFunction}
* @param {number} pos
* @returns {number}
*/
var linear = function linear(pos) {
return pos;
};
/**
* @memberof Tweenable.formulas
* @type {shifty.easingFunction}
* @param {number} pos
* @returns {number}
*/
var easeInQuad = function easeInQuad(pos) {
return Math.pow(pos, 2);
};
/**
* @memberof Tweenable.formulas
* @type {shifty.easingFunction}
* @param {number} pos
* @returns {number}
*/
var easeOutQuad = function easeOutQuad(pos) {
return -(Math.pow(pos - 1, 2) - 1);
};
/**
* @memberof Tweenable.formulas
* @type {shifty.easingFunction}
* @param {number} pos
* @returns {number}
*/
var easeInOutQuad = function easeInOutQuad(pos) {
return (pos /= 0.5) < 1 ? 0.5 * Math.pow(pos, 2) : -0.5 * ((pos -= 2) * pos - 2);
};
/**
* @memberof Tweenable.formulas
* @type {shifty.easingFunction}
* @param {number} pos
* @returns {number}
*/
var easeInCubic = function easeInCubic(pos) {
return Math.pow(pos, 3);
};
/**
* @memberof Tweenable.formulas
* @type {shifty.easingFunction}
* @param {number} pos
* @returns {number}
*/
var easeOutCubic = function easeOutCubic(pos) {
return Math.pow(pos - 1, 3) + 1;
};
/**
* @memberof Tweenable.formulas
* @type {shifty.easingFunction}
* @param {number} pos
* @returns {number}
*/
var easeInOutCubic = function easeInOutCubic(pos) {
return (pos /= 0.5) < 1 ? 0.5 * Math.pow(pos, 3) : 0.5 * (Math.pow(pos - 2, 3) + 2);
};
/**
* @memberof Tweenable.formulas
* @type {shifty.easingFunction}
* @param {number} pos
* @returns {number}
*/
var easeInQuart = function easeInQuart(pos) {
return Math.pow(pos, 4);
};
/**
* @memberof Tweenable.formulas
* @type {shifty.easingFunction}
* @param {number} pos
* @returns {number}
*/
var easeOutQuart = function easeOutQuart(pos) {
return -(Math.pow(pos - 1, 4) - 1);
};
/**
* @memberof Tweenable.formulas
* @type {shifty.easingFunction}
* @param {number} pos
* @returns {number}
*/
var easeInOutQuart = function easeInOutQuart(pos) {
return (pos /= 0.5) < 1 ? 0.5 * Math.pow(pos, 4) : -0.5 * ((pos -= 2) * Math.pow(pos, 3) - 2);
};
/**
* @memberof Tweenable.formulas
* @type {shifty.easingFunction}
* @param {number} pos
* @returns {number}
*/
var easeInQuint = function easeInQuint(pos) {
return Math.pow(pos, 5);
};
/**
* @memberof Tweenable.formulas
* @type {shifty.easingFunction}
* @param {number} pos
* @returns {number}
*/
var easeOutQuint = function easeOutQuint(pos) {
return Math.pow(pos - 1, 5) + 1;
};
/**
* @memberof Tweenable.formulas
* @type {shifty.easingFunction}
* @param {number} pos
* @returns {number}
*/
var easeInOutQuint = function easeInOutQuint(pos) {
return (pos /= 0.5) < 1 ? 0.5 * Math.pow(pos, 5) : 0.5 * (Math.pow(pos - 2, 5) + 2);
};
/**
* @memberof Tweenable.formulas
* @type {shifty.easingFunction}
* @param {number} pos
* @returns {number}
*/
var easeInSine = function easeInSine(pos) {
return -Math.cos(pos * (Math.PI / 2)) + 1;
};
/**
* @memberof Tweenable.formulas
* @type {shifty.easingFunction}
* @param {number} pos
* @returns {number}
*/
var easeOutSine = function easeOutSine(pos) {
return Math.sin(pos * (Math.PI / 2));
};
/**
* @memberof Tweenable.formulas
* @type {shifty.easingFunction}
* @param {number} pos
* @returns {number}
*/
var easeInOutSine = function easeInOutSine(pos) {
return -0.5 * (Math.cos(Math.PI * pos) - 1);
};
/**
* @memberof Tweenable.formulas
* @type {shifty.easingFunction}
* @param {number} pos
* @returns {number}
*/
var easeInExpo = function easeInExpo(pos) {
return pos === 0 ? 0 : Math.pow(2, 10 * (pos - 1));
};
/**
* @memberof Tweenable.formulas
* @type {shifty.easingFunction}
* @param {number} pos
* @returns {number}
*/
var easeOutExpo = function easeOutExpo(pos) {
return pos === 1 ? 1 : -Math.pow(2, -10 * pos) + 1;
};
/**
* @memberof Tweenable.formulas
* @type {shifty.easingFunction}
* @param {number} pos
* @returns {number}
*/
var easeInOutExpo = function easeInOutExpo(pos) {
if (pos === 0) {
return 0;
}
if (pos === 1) {
return 1;
}
if ((pos /= 0.5) < 1) {
return 0.5 * Math.pow(2, 10 * (pos - 1));
}
return 0.5 * (-Math.pow(2, -10 * --pos) + 2);
};
/**
* @memberof Tweenable.formulas
* @type {shifty.easingFunction}
* @param {number} pos
* @returns {number}
*/
var easeInCirc = function easeInCirc(pos) {
return -(Math.sqrt(1 - pos * pos) - 1);
};
/**
* @memberof Tweenable.formulas
* @type {shifty.easingFunction}
* @param {number} pos
* @returns {number}
*/
var easeOutCirc = function easeOutCirc(pos) {
return Math.sqrt(1 - Math.pow(pos - 1, 2));
};
/**
* @memberof Tweenable.formulas
* @type {shifty.easingFunction}
* @param {number} pos
* @returns {number}
*/
var easeInOutCirc = function easeInOutCirc(pos) {
return (pos /= 0.5) < 1 ? -0.5 * (Math.sqrt(1 - pos * pos) - 1) : 0.5 * (Math.sqrt(1 - (pos -= 2) * pos) + 1);
};
/**
* @memberof Tweenable.formulas
* @type {shifty.easingFunction}
* @param {number} pos
* @returns {number}
*/
var easeOutBounce = function easeOutBounce(pos) {
if (pos < 1 / 2.75) {
return 7.5625 * pos * pos;
} else if (pos < 2 / 2.75) {
return 7.5625 * (pos -= 1.5 / 2.75) * pos + 0.75;
} else if (pos < 2.5 / 2.75) {
return 7.5625 * (pos -= 2.25 / 2.75) * pos + 0.9375;
} else {
return 7.5625 * (pos -= 2.625 / 2.75) * pos + 0.984375;
}
};
/**
* @memberof Tweenable.formulas
* @type {shifty.easingFunction}
* @param {number} pos
* @returns {number}
*/
var easeInBack = function easeInBack(pos) {
var s = 1.70158;
return pos * pos * ((s + 1) * pos - s);
};
/**
* @memberof Tweenable.formulas
* @type {shifty.easingFunction}
* @param {number} pos
* @returns {number}
*/
var easeOutBack = function easeOutBack(pos) {
var s = 1.70158;
return (pos = pos - 1) * pos * ((s + 1) * pos + s) + 1;
};
/**
* @memberof Tweenable.formulas
* @type {shifty.easingFunction}
* @param {number} pos
* @returns {number}
*/
var easeInOutBack = function easeInOutBack(pos) {
var s = 1.70158;
if ((pos /= 0.5) < 1) {
return 0.5 * (pos * pos * (((s *= 1.525) + 1) * pos - s));
}
return 0.5 * ((pos -= 2) * pos * (((s *= 1.525) + 1) * pos + s) + 2);
};
/**
* @memberof Tweenable.formulas
* @type {shifty.easingFunction}
* @param {number} pos
* @returns {number}
*/
var elastic = function elastic(pos) {
return -1 * Math.pow(4, -8 * pos) * Math.sin((pos * 6 - 1) * (2 * Math.PI) / 2) + 1;
};
/**
* @memberof Tweenable.formulas
* @type {shifty.easingFunction}
* @param {number} pos
* @returns {number}
*/
var swingFromTo = function swingFromTo(pos) {
var s = 1.70158;
return (pos /= 0.5) < 1 ? 0.5 * (pos * pos * (((s *= 1.525) + 1) * pos - s)) : 0.5 * ((pos -= 2) * pos * (((s *= 1.525) + 1) * pos + s) + 2);
};
/**
* @memberof Tweenable.formulas
* @type {shifty.easingFunction}
* @param {number} pos
* @returns {number}
*/
var swingFrom = function swingFrom(pos) {
var s = 1.70158;
return pos * pos * ((s + 1) * pos - s);
};
/**
* @memberof Tweenable.formulas
* @type {shifty.easingFunction}
* @param {number} pos
* @returns {number}
*/
var swingTo = function swingTo(pos) {
var s = 1.70158;
return (pos -= 1) * pos * ((s + 1) * pos + s) + 1;
};
/**
* @memberof Tweenable.formulas
* @type {shifty.easingFunction}
* @param {number} pos
* @returns {number}
*/
var bounce = function bounce(pos) {
if (pos < 1 / 2.75) {
return 7.5625 * pos * pos;
} else if (pos < 2 / 2.75) {
return 7.5625 * (pos -= 1.5 / 2.75) * pos + 0.75;
} else if (pos < 2.5 / 2.75) {
return 7.5625 * (pos -= 2.25 / 2.75) * pos + 0.9375;
} else {
return 7.5625 * (pos -= 2.625 / 2.75) * pos + 0.984375;
}
};
/**
* @memberof Tweenable.formulas
* @type {shifty.easingFunction}
* @param {number} pos
* @returns {number}
*/
var bouncePast = function bouncePast(pos) {
if (pos < 1 / 2.75) {
return 7.5625 * pos * pos;
} else if (pos < 2 / 2.75) {
return 2 - (7.5625 * (pos -= 1.5 / 2.75) * pos + 0.75);
} else if (pos < 2.5 / 2.75) {
return 2 - (7.5625 * (pos -= 2.25 / 2.75) * pos + 0.9375);
} else {
return 2 - (7.5625 * (pos -= 2.625 / 2.75) * pos + 0.984375);
}
};
/**
* @memberof Tweenable.formulas
* @type {shifty.easingFunction}
* @param {number} pos
* @returns {number}
*/
var easeFromTo = function easeFromTo(pos) {
return (pos /= 0.5) < 1 ? 0.5 * Math.pow(pos, 4) : -0.5 * ((pos -= 2) * Math.pow(pos, 3) - 2);
};
/**
* @memberof Tweenable.formulas
* @type {shifty.easingFunction}
* @param {number} pos
* @returns {number}
*/
var easeFrom = function easeFrom(pos) {
return Math.pow(pos, 4);
};
/**
* @memberof Tweenable.formulas
* @type {shifty.easingFunction}
* @param {number} pos
* @returns {number}
*/
var easeTo = function easeTo(pos) {
return Math.pow(pos, 0.25);
};
;// CONCATENATED MODULE: ./src/bezier.js
/** @typedef {import(".").shifty.easingFunction} shifty.easingFunction */
/**
* The Bezier magic in this file is adapted/copied almost wholesale from
* [Scripty2](https://github.com/madrobby/scripty2/blob/master/src/effects/transitions/cubic-bezier.js),
* which was adapted from Apple code (which probably came from
* [here](http://opensource.apple.com/source/WebCore/WebCore-955.66/platform/graphics/UnitBezier.h)).
* Special thanks to Apple and Thomas Fuchs for much of this code.
*/
/**
* Copyright (c) 2006 Apple Computer, Inc. All rights reserved.
*
* Redistribution and use in source and binary forms, with or without
* modification, are permitted provided that the following conditions are met:
*
* 1. Redistributions of source code must retain the above copyright notice,
* this list of conditions and the following disclaimer.
*
* 2. Redistributions in binary form must reproduce the above copyright notice,
* this list of conditions and the following disclaimer in the documentation
* and/or other materials provided with the distribution.
*
* 3. Neither the name of the copyright holder(s) nor the names of any
* contributors may be used to endorse or promote products derived from
* this software without specific prior written permission.
*
* THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS"
* AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
* IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE
* ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT OWNER OR CONTRIBUTORS BE
* LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR
* CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF
* SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS
* INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN
* CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE)
* ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE
* POSSIBILITY OF SUCH DAMAGE.
*/
// port of webkit cubic bezier handling by http://www.netzgesta.de/dev/
/**
* @param {number} t
* @param {number} p1x
* @param {number} p1y
* @param {number} p2x
* @param {number} p2y
* @param {number} duration
* @returns {Function}
* @private
*/
function cubicBezierAtTime(t, p1x, p1y, p2x, p2y, duration) {
var ax = 0,
bx = 0,
cx = 0,
ay = 0,
by = 0,
cy = 0;
var sampleCurveX = function sampleCurveX(t) {
return ((ax * t + bx) * t + cx) * t;
};
var sampleCurveY = function sampleCurveY(t) {
return ((ay * t + by) * t + cy) * t;
};
var sampleCurveDerivativeX = function sampleCurveDerivativeX(t) {
return (3 * ax * t + 2 * bx) * t + cx;
};
var solveEpsilon = function solveEpsilon(duration) {
return 1 / (200 * duration);
};
var fabs = function fabs(n) {
return n >= 0 ? n : 0 - n;
};
var solveCurveX = function solveCurveX(x, epsilon) {
var t0, t1, t2, x2, d2, i;
for (t2 = x, i = 0; i < 8; i++) {
x2 = sampleCurveX(t2) - x;
if (fabs(x2) < epsilon) {
return t2;
}
d2 = sampleCurveDerivativeX(t2);
if (fabs(d2) < 1e-6) {
break;
}
t2 = t2 - x2 / d2;
}
t0 = 0;
t1 = 1;
t2 = x;
if (t2 < t0) {
return t0;
}
if (t2 > t1) {
return t1;
}
while (t0 < t1) {
x2 = sampleCurveX(t2);
if (fabs(x2 - x) < epsilon) {
return t2;
}
if (x > x2) {
t0 = t2;
} else {
t1 = t2;
}
t2 = (t1 - t0) * 0.5 + t0;
}
return t2; // Failure.
};
var solve = function solve(x, epsilon) {
return sampleCurveY(solveCurveX(x, epsilon));
};
cx = 3 * p1x;
bx = 3 * (p2x - p1x) - cx;
ax = 1 - cx - bx;
cy = 3 * p1y;
by = 3 * (p2y - p1y) - cy;
ay = 1 - cy - by;
return solve(t, solveEpsilon(duration));
} // End ported code
/**
* GetCubicBezierTransition(x1, y1, x2, y2) -> Function.
*
* Generates a transition easing function that is compatible
* with WebKit's CSS transitions `-webkit-transition-timing-function`
* CSS property.
*
* The W3C has more information about CSS3 transition timing functions:
* http://www.w3.org/TR/css3-transitions/#transition-timing-function_tag
*
* @param {number} [x1]
* @param {number} [y1]
* @param {number} [x2]
* @param {number} [y2]
* @return {Function}
*/
var getCubicBezierTransition = function getCubicBezierTransition() {
var x1 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0.25;
var y1 = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0.25;
var x2 = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0.75;
var y2 = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 0.75;
return function (pos) {
return cubicBezierAtTime(pos, x1, y1, x2, y2, 1);
};
};
/**
* Create a Bezier easing function and attach it to {@link
* Tweenable.formulas}. This function gives you total control over the
* easing curve. Matthew Lein's [Ceaser](http://matthewlein.com/ceaser/) is a
* useful tool for visualizing the curves you can make with this function.
* @method shifty.setBezierFunction
* @param {string} name The name of the easing curve. Overwrites the old
* easing function on {@link Tweenable.formulas} if it exists.
* @param {number} x1
* @param {number} y1
* @param {number} x2
* @param {number} y2
* @return {shifty.easingFunction} The {@link shifty.easingFunction} that was
* attached to {@link Tweenable.formulas}.
*/
var setBezierFunction = function setBezierFunction(name, x1, y1, x2, y2) {
var cubicBezierTransition = getCubicBezierTransition(x1, y1, x2, y2);
cubicBezierTransition.displayName = name;
cubicBezierTransition.x1 = x1;
cubicBezierTransition.y1 = y1;
cubicBezierTransition.x2 = x2;
cubicBezierTransition.y2 = y2;
return Tweenable.formulas[name] = cubicBezierTransition;
};
/**
* `delete` an easing function from {@link Tweenable.formulas}. Be
* careful with this method, as it `delete`s whatever easing formula matches
* `name` (which means you can delete standard Shifty easing functions).
* @method shifty.unsetBezierFunction
* @param {string} name The name of the easing function to delete.
* @return {boolean} Whether or not the functions was `delete`d.
*/
var unsetBezierFunction = function unsetBezierFunction(name) {
return delete Tweenable.formulas[name];
};
;// CONCATENATED MODULE: ./src/tweenable.js
var _Symbol$toStringTag;
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && Symbol.iterator in Object(iter)) return Array.from(iter); }
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
/** @typedef {import("./index").shifty.filter} shifty.filter */
/** @typedef {import("./index").shifty.tweenConfig} shifty.tweenConfig */
/** @typedef {import("./index").shifty.scheduleFunction} shifty.scheduleFunction */
// CONSTANTS
var DEFAULT_EASING = 'linear';
var DEFAULT_DURATION = 500;
var UPDATE_TIME = 1000 / 60;
var root = typeof window !== 'undefined' ? window : global;
var AFTER_TWEEN = 'afterTween';
var AFTER_TWEEN_END = 'afterTweenEnd';
var BEFORE_TWEEN = 'beforeTween';
var TWEEN_CREATED = 'tweenCreated';
var TYPE_FUNCTION = 'function';
var TYPE_STRING = 'string'; // requestAnimationFrame() shim by Paul Irish (modified for Shifty)
// http://paulirish.com/2011/requestanimationframe-for-smart-animating/
var scheduleFunction = root.requestAnimationFrame || root.webkitRequestAnimationFrame || root.oRequestAnimationFrame || root.msRequestAnimationFrame || root.mozCancelRequestAnimationFrame && root.mozRequestAnimationFrame || setTimeout;
var noop = function noop() {};
var listHead = null;
var listTail = null;
/**
* Strictly for testing.
* @private
* @internal
*/
var resetList = function resetList() {
listHead = listTail = null;
};
/**
* Strictly for testing.
* @returns {Tweenable}
* @private
* @internal
*/
var getListHead = function getListHead() {
return listHead;
};
/**
* Strictly for testing.
* @returns {Tweenable}
* @private
* @internal
*/
var getListTail = function getListTail() {
return listTail;
};
var formulas = _objectSpread({}, easing_functions_namespaceObject);
/**
* Calculates the interpolated tween values of an Object for a given
* timestamp.
* @param {number} forPosition The position to compute the state for.
* @param {Object} currentState Current state properties.
* @param {Object} originalState: The original state properties the Object is
* tweening from.
* @param {Object} targetState: The destination state properties the Object
* is tweening to.
* @param {number} duration: The length of the tween in milliseconds.
* @param {number} timestamp: The UNIX epoch time at which the tween began.
* @param {Record} easing: This Object's keys must correspond
* to the keys in targetState.
* @returns {Object}
* @private
*/
var tweenProps = function tweenProps(forPosition, currentState, originalState, targetState, duration, timestamp, easing) {
var easedPosition;
var easingObjectProp;
var start;
var normalizedPosition = forPosition < timestamp ? 0 : (forPosition - timestamp) / duration;
var easingFn = null;
var hasOneEase = false;
if (easing && easing.call) {
hasOneEase = true;
easedPosition = easing(normalizedPosition);
}
for (var key in currentState) {
if (!hasOneEase) {
easingObjectProp = easing[key];
easingFn = easingObjectProp.call ? easingObjectProp : formulas[easingObjectProp];
easedPosition = easingFn(normalizedPosition);
}
start = originalState[key];
currentState[key] = start + (targetState[key] - start) * easedPosition;
}
return currentState;
};
var processTween = function processTween(tween, currentTime) {
var timestamp = tween._timestamp;
var currentState = tween._currentState;
var delay = tween._delay;
if (currentTime < timestamp + delay) {
return;
}
var duration = tween._duration;
var targetState = tween._targetState;
var endTime = timestamp + delay + duration;
var timeToCompute = currentTime > endTime ? endTime : currentTime;
tween._hasEnded = timeToCompute >= endTime;
var offset = duration - (endTime - timeToCompute);
var hasFilters = tween._filters.length > 0;
if (tween._hasEnded) {
tween._render(targetState, tween._data, offset);
return tween.stop(true);
}
if (hasFilters) {
tween._applyFilter(BEFORE_TWEEN);
} // If the animation has not yet reached the start point (e.g., there was
// delay that has not yet completed), just interpolate the starting
// position of the tween.
if (timeToCompute < timestamp + delay) {
timestamp = duration = timeToCompute = 1;
} else {
timestamp += delay;
}
tweenProps(timeToCompute, currentState, tween._originalState, targetState, duration, timestamp, tween._easing);
if (hasFilters) {
tween._applyFilter(AFTER_TWEEN);
}
tween._render(currentState, tween._data, offset);
};
/**
* Process all tweens currently managed by Shifty for the current tick. This
* does not perform any timing or update scheduling; it is the logic that is
* run *by* the scheduling functionality. Specifically, it computes the state
* and calls all of the relevant {@link shifty.tweenConfig} functions supplied
* to each of the tweens for the current point in time (as determined by {@link
* Tweenable.now}.
*
* This is a low-level API that won't be needed in the majority of situations.
* It is primarily useful as a hook for higher-level animation systems that are
* built on top of Shifty. If you need this function, it is likely you need to
* pass something like `() => {}` to {@link
* Tweenable.setScheduleFunction}, override {@link Tweenable.now}
* and manage the scheduling logic yourself.
*
* @method shifty.processTweens
* @see https://github.com/jeremyckahn/shifty/issues/109
*/
var processTweens = function processTweens() {
var nextTweenToProcess;
var currentTime = Tweenable.now();
var currentTween = listHead;
while (currentTween) {
nextTweenToProcess = currentTween._next;
processTween(currentTween, currentTime);
currentTween = nextTweenToProcess;
}
};
var getCurrentTime = Date.now || function () {
return +new Date();
};
var now;
var heartbeatIsRunning = false;
/**
* Determines whether or not a heartbeat tick should be scheduled. This is
* generally only useful for testing environments where Shifty's continuous
* heartbeat mechanism causes test runner issues.
*
* If you are using Jest, you'll want to put this in a global `afterAll` hook.
* If you don't already have a Jest setup file, follow the setup in [this
* StackOverflow post](https://stackoverflow.com/a/57647146), and then add this
* to it:
*
* ```
* import { shouldScheduleUpdate } from 'shifty'
*
* afterAll(() => {
* shouldScheduleUpdate(false)
* })
* ```
*
* @method shifty.shouldScheduleUpdate
* @param {boolean} doScheduleUpdate
* @see https://github.com/jeremyckahn/shifty/issues/156
*/
var shouldScheduleUpdate = function shouldScheduleUpdate(doScheduleUpdate) {
if (doScheduleUpdate && heartbeatIsRunning) {
return;
}
heartbeatIsRunning = doScheduleUpdate;
if (doScheduleUpdate) {
scheduleUpdate();
}
};
/**
* Handles the update logic for one tick of a tween.
* @private
*/
var scheduleUpdate = function scheduleUpdate() {
now = getCurrentTime();
if (heartbeatIsRunning) {
scheduleFunction.call(root, scheduleUpdate, UPDATE_TIME);
}
processTweens();
};
/**
* Creates a usable easing Object from a string, a function or another easing
* Object. If `easing` is an Object, then this function clones it and fills
* in the missing properties with `"linear"`.
*
* If the tween has only one easing across all properties, that function is
* returned directly.
* @param {Record} fromTweenParams
* @param {Object|string|Function|Array.} [easing]
* @param {Object} [composedEasing] Reused composedEasing object (used internally)
* @return {Record|Function}
* @private
*/
var composeEasingObject = function composeEasingObject(fromTweenParams) {
var easing = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : DEFAULT_EASING;
var composedEasing = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
if (Array.isArray(easing)) {
var cubicBezierTransition = getCubicBezierTransition.apply(void 0, _toConsumableArray(easing));
return cubicBezierTransition;
}
var typeofEasing = _typeof(easing);
if (formulas[easing]) {
return formulas[easing];
}
if (typeofEasing === TYPE_STRING || typeofEasing === TYPE_FUNCTION) {
for (var prop in fromTweenParams) {
composedEasing[prop] = easing;
}
} else {
for (var _prop in fromTweenParams) {
composedEasing[_prop] = easing[_prop] || DEFAULT_EASING;
}
}
return composedEasing;
}; // Private declarations used below
var remove = function (previousTween, nextTween) {
return function (tween) {
// Adapted from:
// https://github.com/trekhleb/javascript-algorithms/blob/7c9601df3e8ca4206d419ce50b88bd13ff39deb6/src/data-structures/doubly-linked-list/DoublyLinkedList.js#L73-L121
if (tween === listHead) {
listHead = tween._next;
if (listHead) {
listHead._previous = null;
} else {
listTail = null;
}
} else if (tween === listTail) {
listTail = tween._previous;
if (listTail) {
listTail._next = null;
} else {
listHead = null;
}
} else {
previousTween = tween._previous;
nextTween = tween._next;
previousTween._next = nextTween;
nextTween._previous = previousTween;
} // Clean up any references in case the tween is restarted later.
tween._previous = tween._next = null;
};
}();
var defaultPromiseCtor = typeof Promise === 'function' ? Promise : null;
/**
* @class
* @implements {Promise}
*/
_Symbol$toStringTag = Symbol.toStringTag;
var Tweenable = /*#__PURE__*/function () {
//required for Promise implementation
/**
* @method Tweenable.now
* @static
* @returns {number} The current timestamp.
*/
/**
* Set a custom schedule function.
*
* By default,
* [`requestAnimationFrame`](https://developer.mozilla.org/en-US/docs/Web/API/window.requestAnimationFrame)
* is used if available, otherwise
* [`setTimeout`](https://developer.mozilla.org/en-US/docs/Web/API/Window.setTimeout)
* is used.
* @method Tweenable.setScheduleFunction
* @param {shifty.scheduleFunction} fn The function to be
* used to schedule the next frame to be rendered.
* @return {shifty.scheduleFunction} The function that was set.
*/
/**
* The {@link shifty.filter}s available for use. These filters are
* automatically applied at tween-time by Shifty. You can define your own
* {@link shifty.filter}s and attach them to this object.
* @member Tweenable.filters
* @type {Record}
*/
/**
* @param {Object} [initialState={}] The values that the initial tween should
* start at if a `from` value is not provided to {@link
* Tweenable#tween} or {@link Tweenable#setConfig}.
* @param {shifty.tweenConfig} [config] Configuration object to be passed to
* {@link Tweenable#setConfig}.
* @constructs Tweenable
* @memberof shifty
*/
function Tweenable() {
var initialState = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
var config = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : undefined;
_classCallCheck(this, Tweenable);
_defineProperty(this, _Symbol$toStringTag, 'Promise');
/** @private */
this._config = {};
/** @private */
this._data = {};
/** @private */
this._delay = 0;
/** @private */
this._filters = [];
/** @private */
this._next = null;
/** @private */
this._previous = null;
/** @private */
this._timestamp = null;
/** @private */
this._hasEnded = false;
/** @private */
this._resolve = null;
/** @private */
this._reject = null;
/** @private */
this._currentState = initialState || {};
/** @private */
this._originalState = {};
/** @private */
this._targetState = {};
/** @private */
this._start = noop;
/** @private */
this._render = noop;
/** @private */
this._promiseCtor = defaultPromiseCtor; // To prevent unnecessary calls to setConfig do not set default
// configuration here. Only set default configuration immediately before
// tweening if none has been set.
if (config) {
this.setConfig(config);
}
}
/**
* Applies a filter to Tweenable instance.
* @param {string} filterName The name of the filter to apply.
* @private
*/
_createClass(Tweenable, [{
key: "_applyFilter",
value: function _applyFilter(filterName) {
for (var i = this._filters.length; i > 0; i--) {
var filterType = this._filters[i - i];
var filter = filterType[filterName];
if (filter) {
filter(this);
}
}
}
/**
* Configure and start a tween. If this {@link Tweenable}'s instance
* is already running, then it will stop playing the old tween and
* immediately play the new one.
* @method Tweenable#tween
* @param {shifty.tweenConfig} [config] Gets passed to {@link
* Tweenable#setConfig}.
* @return {Tweenable}
*/
}, {
key: "tween",
value: function tween() {
var config = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : undefined;
if (this._isPlaying) {
this.stop();
}
if (config || !this._config) {
this.setConfig(config);
}
/** @private */
this._pausedAtTime = null;
this._timestamp = Tweenable.now();
this._start(this.get(), this._data);
if (this._delay) {
this._render(this._currentState, this._data, 0);
}
return this._resume(this._timestamp);
}
/**
* Configure a tween that will start at some point in the future. Aside from
* `delay`, `from`, and `to`, each configuration option will automatically
* default to the same option used in the preceding tween of this {@link
* Tweenable} instance.
* @method Tweenable#setConfig
* @param {shifty.tweenConfig} [config={}]
* @return {Tweenable}
*/
}, {
key: "setConfig",
value: function setConfig() {
var config = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
var _config = this._config;
for (var key in config) {
_config[key] = config[key];
} // Configuration options to reuse from previous tweens
var _config$promise = _config.promise,
promise = _config$promise === void 0 ? this._promiseCtor : _config$promise,
_config$start = _config.start,
start = _config$start === void 0 ? noop : _config$start,
finish = _config.finish,
_config$render = _config.render,
render = _config$render === void 0 ? this._config.step || noop : _config$render,
_config$step = _config.step,
step = _config$step === void 0 ? noop : _config$step; // Attach something to this Tweenable instance (e.g.: a DOM element, an
// object, a string, etc.);
this._data = _config.data || _config.attachment || this._data; // Init the internal state
/** @private */
this._isPlaying = false;
/** @private */
this._pausedAtTime = null;
/** @private */
this._scheduleId = null;
/** @private */
this._delay = config.delay || 0;
/** @private */
this._start = start;
/** @private */
this._render = render || step;
/** @private */
this._duration = _config.duration || DEFAULT_DURATION;
/** @private */
this._promiseCtor = promise;
if (finish) {
this._resolve = finish;
}
var from = config.from,
_config$to = config.to,
to = _config$to === void 0 ? {} : _config$to;
var _currentState = this._currentState,
_originalState = this._originalState,
_targetState = this._targetState;
for (var _key in from) {
_currentState[_key] = from[_key];
}
var anyPropsAreStrings = false;
for (var _key2 in _currentState) {
var currentProp = _currentState[_key2];
if (!anyPropsAreStrings && _typeof(currentProp) === TYPE_STRING) {
anyPropsAreStrings = true;
}
_originalState[_key2] = currentProp; // Ensure that there is always something to tween to.
_targetState[_key2] = to.hasOwnProperty(_key2) ? to[_key2] : currentProp;
}
/** @private */
this._easing = composeEasingObject(this._currentState, _config.easing, this._easing);
this._filters.length = 0;
if (anyPropsAreStrings) {
for (var _key3 in Tweenable.filters) {
if (Tweenable.filters[_key3].doesApply(this)) {
this._filters.push(Tweenable.filters[_key3]);
}
}
this._applyFilter(TWEEN_CREATED);
}
return this;
}
/**
* Overrides any `finish` function passed via a {@link shifty.tweenConfig}.
* @method Tweenable#then
* @param {function=} onFulfilled Receives {@link shifty.promisedData} as the
* first parameter.
* @param {function=} onRejected Receives {@link shifty.promisedData} as the
* first parameter.
* @return {Promise