vevet 1.4.27 → 2.0.1-dev.3

package/dist/js/TimelineModule.js

@@ -1,494 +0,0 @@
-"use strict";
-
-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); }
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-
-var _merge = _interopRequireDefault(require("./merge"));
-
-var _TimelineBaseModule2 = _interopRequireDefault(require("./TimelineBaseModule"));
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-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 _get(target, property, receiver) { if (typeof Reflect !== "undefined" && Reflect.get) { _get = Reflect.get; } else { _get = function _get(target, property, receiver) { var base = _superPropBase(target, property); if (!base) return; var desc = Object.getOwnPropertyDescriptor(base, property); if (desc.get) { return desc.get.call(receiver); } return desc.value; }; } return _get(target, property, receiver || target); }
-
-function _superPropBase(object, property) { while (!Object.prototype.hasOwnProperty.call(object, property)) { object = _getPrototypeOf(object); if (object === null) break; } return object; }
-
-function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
-
-function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
-
-function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
-
-function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
-
-function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
-
-function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
-
-function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
-
-/**
- * @classdesc This class is used for creating & playing timelines.
- * Available targets:
- *  <ul>
- *      <li>play - receives {@linkcode Vevet.TimelineModule.Data} as an argument</li>
- *      <li>pause - receives {@linkcode Vevet.TimelineModule.Data} as an argument</li>
- *      <li>resume - receives {@linkcode Vevet.TimelineModule.Data} as an argument</li>
- *      <li>progress - receives {@linkcode Vevet.TimelineModule.Data} as an argument</li>
- *      <li>end</li>
- *      <li>stop - receives {@linkcode Vevet.TimelineModule.Data} as an argument</li>
- *      <li>reverse - receives {@linkcode Vevet.TimelineModule.Data} as an argument</li>
- *  </ul>
- * Each callback will receive the object {@linkcode Vevet.TimelineBaseModule.Data} as an argument.
- * <br><br> <b>import {TimelineBaseModule} from 'vevet';</b>
- * 
- * @vevetModuleCallback { Vevet.TimelineModule : play : Vevet.TimelineModule.Data }
- * @vevetModuleCallback { Vevet.TimelineModule : pause : Vevet.TimelineModule.Data }
- * @vevetModuleCallback { Vevet.TimelineModule : resume : Vevet.TimelineModule.Data }
- * @vevetModuleCallback { Vevet.TimelineModule : progress : Vevet.TimelineModule.Data }
- * @vevetModuleCallback { Vevet.TimelineModule : end :  }
- * @vevetModuleCallback { Vevet.TimelineModule : stop : Vevet.TimelineModule.Data }
- * @vevetModuleCallback { Vevet.TimelineModule : reverse : Vevet.TimelineModule.Data }
- * 
- * @class
- * @memberof Vevet
- * @augments Vevet.TimelineBaseModule
- */
-var TimelineModule = /*#__PURE__*/function (_TimelineBaseModule) {
-  _inherits(TimelineModule, _TimelineBaseModule);
-
-  var _super = _createSuper(TimelineModule);
-
-  /**
-   * @memberof Vevet.TimelineModule
-   * @typedef {object} Properties
-   * @augments Vevet.TimelineBaseModule.Properties
-   * @augments Vevet.TimelineModule.Settings
-   * 
-   * @property {boolean} [destroyOnEnd=false] - Destroy the timeline when it ends.
-   */
-
-  /**
-   * @alias Vevet.TimelineModule
-   * @param {Vevet.TimelineModule.Properties} [data]
-   */
-  function TimelineModule(data) {
-    _classCallCheck(this, TimelineModule);
-
-    return _super.call(this, data);
-  } // Extra Constructor
-
-
-  _createClass(TimelineModule, [{
-    key: "_extra",
-    value: function _extra() {
-      _get(_getPrototypeOf(TimelineModule.prototype), "_extra", this).call(this);
-      /**
-       * @description If animation is playing.
-       * @protected
-       * @member {boolean}
-       */
-
-
-      this._playing = false;
-      /**
-       * @description If animation is paused.
-       * @protected
-       * @member {boolean}
-       */
-
-      this._paused = false;
-      /**
-       * @description If animation is stopped.
-       * @protected
-       * @member {boolean}
-       */
-
-      this._stopped = false;
-      /**
-       * @description If animation is reversed.
-       * @protected
-       * @member {boolean}
-       */
-
-      this._reversed = false;
-      /**
-       * @description Animation Frame.
-       * @protected
-       * @member {number|null}
-       */
-
-      this._frame = null;
-    }
-    /**
-     * @description Create tickers variables.
-     * @protected
-     */
-
-  }, {
-    key: "_tickers",
-    value: function _tickers() {
-      _get(_getPrototypeOf(TimelineModule.prototype), "_tickers", this).call(this);
-      /**
-       * @protected
-       * @member {number}
-       */
-
-
-      this._ticker = 0;
-      /**
-       * @protected
-       * @member {number}
-       */
-
-      this._lastFrame = 0;
-    }
-    /**
-     * @memberof Vevet.TimelineModule
-     * @typedef {object} Settings
-     * @augments Vevet.TimelineBaseModule.Settings
-     * @property {number} [duration=750] - Duration of the animation.
-     * @property {boolean} [autoDuration=false] - Defines if the duration can be changed according to the animation scope.
-     */
-
-    /**
-     * @description Get default settings.
-     * @readonly
-     * @type {Vevet.TimelineModule.Settings}
-     */
-
-  }, {
-    key: "defaultSettings",
-    get: function get() {
-      return (0, _merge.default)(_get(_getPrototypeOf(TimelineModule.prototype), "defaultSettings", this), {
-        duration: 750,
-        autoDuration: false
-      });
-    }
-    /**
-     * @description Check if the timeline is already playing.
-     * @readonly
-     * @default false
-     * @type {boolean}
-     */
-
-  }, {
-    key: "playing",
-    get: function get() {
-      return this._playing;
-    }
-    /**
-     * @description Check if the timeline is reversed.
-     * @readonly
-     * @default false
-     * @type {boolean}
-     */
-
-  }, {
-    key: "reversed",
-    get: function get() {
-      return this._reversed;
-    }
-    /**
-     * @memberof Vevet.TimelineModule
-     * @typedef {object} Data
-     * @augments Vevet.TimelineBaseModule.Data
-     * @property {number} duration - Duration of the animation.
-     */
-
-    /**
-     * @description Get animation data.
-     * @readonly
-     * @type {Vevet.TimelineModule.Data}
-     */
-
-  }, {
-    key: "data",
-    get: function get() {
-      return (0, _merge.default)(_get(_getPrototypeOf(TimelineModule.prototype), "data", this), {
-        duration: this._settings.duration
-      });
-    }
-    /**
-     * @description Start animation. Launch requestAnimationFrame.
-     * Common for {@linkcode Vevet.TimelineModule#play} & {@linkcode Vevet.TimelineModule#resume}.
-     * @protected
-     */
-
-  }, {
-    key: "_start",
-    value: function _start() {
-      // change values
-      this._lastFrame = Date.now(); // change states
-
-      this._playing = true;
-      this._paused = false;
-      this._stopped = false; // launch frame
-
-      this._frame = window.requestAnimationFrame(this._animate.bind(this));
-    }
-    /**
-     * @description Stop animation and set progress to zero.
-     * Common for {@linkcode Vevet.TimelineModule#stop} & {@linkcode Vevet.TimelineModule#pause}.
-     * @protected
-     */
-
-  }, {
-    key: "_stop",
-    value: function _stop() {
-      this._playing = false;
-
-      if (this._frame != null) {
-        cancelAnimationFrame(this._frame);
-        this._frame = null;
-      }
-    }
-    /**
-     * @description Start the timeline.
-     * @param {Vevet.TimelineModule.Settings} data - Settings of the animation.
-     * @returns {Vevet.TimelineModule} Returns 'this'.
-     */
-
-  }, {
-    key: "play",
-    value: function play() {
-      var data = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : this._settings;
-
-      // check if already playing
-      if (this._playing) {
-        return this;
-      } // check if paused
-
-
-      if (this._paused) {
-        return this.resume();
-      } // reset tickers
-
-
-      if (!this._reversed) {
-        this._tickers();
-      } // get properties
-
-
-      this._settings = (0, _merge.default)(this.defaultSettings, data);
-      var settings = this._settings; // get scope line
-
-      var scope = settings.scope,
-          scopeLine = Math.abs(scope[0] - scope[1]); // change duration according to the scope
-
-      if (settings.autoDuration) {
-        settings.duration *= scopeLine;
-      } // launch animation
-
-
-      this._start(); // launch callback
-
-
-      this.lbt('play', this.data);
-      return this;
-    }
-    /**
-     * @description Pause animation.
-     * @returns {Vevet.TimelineModule} Returns 'this'.
-     */
-
-  }, {
-    key: "pause",
-    value: function pause() {
-      // check if not playing
-      if (!this._playing) {
-        return this;
-      } // pause
-
-
-      this._paused = true;
-
-      this._stop(); // launch callback
-
-
-      this.lbt("pause", this.data);
-      return this;
-    }
-    /**
-     * @description Resume animation after it is paused.
-     * @returns {Vevet.TimelineModule} Returns 'this'.
-     */
-
-  }, {
-    key: "resume",
-    value: function resume() {
-      // check if playing
-      if (this._playing) {
-        return this;
-      } // check if not paused
-
-
-      if (!this._paused) {
-        return this;
-      } // check if not ended
-
-
-      if (this._absolute === 1) {
-        return this;
-      } // launch animation
-
-
-      this._start(); // launch callback
-
-
-      this.lbt("resume", this.data);
-      return this;
-    }
-    /**
-     * @description Stop animation and set progress to zero.
-     * @returns {Vevet.TimelineModule} Returns 'this'.
-     */
-
-  }, {
-    key: "stop",
-    value: function stop() {
-      // reset states & stop the animation
-      this._stopReset();
-
-      this._reversed = false; // reset tickers
-
-      this._tickers();
-
-      this._stopped = true; // launch callback
-
-      this.lbt("stop", this.data);
-      return this;
-    }
-    /**
-     * @description Stop animation and set progress to zero.
-     * @protected
-     */
-
-  }, {
-    key: "_stopReset",
-    value: function _stopReset() {
-      this._paused = false;
-      this._stopped = false;
-
-      this._stop();
-    }
-    /**
-     * @description Reverse animation. This method does'nt start the animation line.
-     * @returns {Vevet.TimelineModule} Returns 'this'.
-     */
-
-  }, {
-    key: "reverse",
-    value: function reverse() {
-      if (this._reversed) {
-        this._reversed = false;
-      } else {
-        this._reversed = true;
-      } // launch callback
-
-
-      this.lbt('reverse', this.data);
-      return this;
-    }
-    /**
-     * @description Animation itself.
-     * @protected
-     */
-
-  }, {
-    key: "_animate",
-    value: function _animate() {
-      var now = Date.now(),
-          frameDuration = now - this._lastFrame; // iterate ticker
-
-      if (!this._reversed) {
-        this._ticker += frameDuration;
-      } else {
-        this._ticker -= frameDuration;
-      } // get progress
-
-
-      var progress = this._ticker / this._settings.duration;
-
-      if (progress > 1) {
-        progress = 1;
-      }
-
-      if (progress < 0) {
-        progress = 0;
-      } // calculate values
-
-
-      this.calc(progress); // if need to stop
-
-      var stop = false,
-          end = false;
-
-      if (!this._reversed) {
-        if (this._progress === 1) {
-          stop = true;
-          end = true;
-        }
-      } else {
-        if (this._progress === 0) {
-          stop = true;
-          end = true;
-        }
-      } // stop animation
-
-
-      if (stop) {
-        this._stopReset();
-      } // end callback
-
-
-      if (end) {
-        this.lbt('end');
-      } // destroy & stop
-
-
-      if (stop) {
-        // destroy the class
-        if (this._prop.destroyOnEnd) {
-          this.destroy();
-        }
-
-        return;
-      } // frame difference, set last frame time
-
-
-      this._lastFrame = now; // frame
-
-      this._frame = window.requestAnimationFrame(this._animate.bind(this));
-    }
-    /**
-     * @description Destroy the class.
-     */
-
-  }, {
-    key: "destroy",
-    value: function destroy() {
-      _get(_getPrototypeOf(TimelineModule.prototype), "destroy", this).call(this); // destroy animation frame
-
-
-      if (this._frame != null) {
-        cancelAnimationFrame(this._frame);
-        this._frame = null;
-      }
-    }
-  }]);
-
-  return TimelineModule;
-}(_TimelineBaseModule2.default);
-
-exports.default = TimelineModule;