vevet 1.4.27 → 2.0.1-dev.3

package/dist/js/MenuModule.js

@@ -1,265 +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 _MenuBaseModule2 = _interopRequireDefault(require("./MenuBaseModule"));
-
-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 A class for creating pop-up menus.
- * All animation are set in CSS, here you set timings only.
- * The menu can't be closed if the animaiton of its opening has not ended yet and vice versa. <br>
- * Available targets:
- *  <ul>
- *      <li>show - when the menu is being opened.</li>
- *      <li>shown - when the menu is opened, the process of animation has ended.</li>
- *      <li>innerShow - when the menu is opened and inner animation started.</li>
- *      <li>innerShown - when the menu is opened and inner animation ended.</li>
- *      <li>hide - when the menu is being hidden.</li> 
- *      <li>innerHide - when the menu is being hidden and inner animation starts.</li>
- *      <li>innerHidden - when the menu is being hidden and inner animation ends.</li>
- *      <li>hidden - when the menu is hidden and the animation has ended.</li>
- *  </ul>
- * <br><br> <b>import {MenuModule} from 'vevet';</b>
- * 
- * @vevetModuleCallback { Vevet.MenuModule : show :  }
- * @vevetModuleCallback { Vevet.MenuModule : shown :  }
- * @vevetModuleCallback { Vevet.MenuModule : innerShow :  }
- * @vevetModuleCallback { Vevet.MenuModule : innerShown :  }
- * @vevetModuleCallback { Vevet.MenuModule : hide :  }
- * @vevetModuleCallback { Vevet.MenuModule : innerHide :  }
- * @vevetModuleCallback { Vevet.MenuModule : innerHidden :  }
- * @vevetModuleCallback { Vevet.MenuModule : hidden :  }
- * 
- * @class
- * @memberof Vevet
- * @augments Vevet.MenuBaseModule
- */
-var MenuModule = /*#__PURE__*/function (_MenuBaseModule) {
-  _inherits(MenuModule, _MenuBaseModule);
-
-  var _super = _createSuper(MenuModule);
-
-  /**
-   * @memberof Vevet.MenuModule
-   * @typedef {object} Properties
-   * @augments Vevet.MenuBaseModule.Properties
-   * 
-   * @property {object} [animation] - The class uses timeouts to calculate the animation boundaries.
-   * @property {number} [animation.duration=750] - The duration of animation of the outer when it is being shown or hidden.
-   * @property {number} [animation.inner=0] - The inner duration of the menu. F.e., if you need to animate links before closing the menu.
-   * @property {number} [animation.innerShiftShow=1] - Shift of inner animation before showing. It means that inner animation will start after (1 * animation.duration) since the button was pushed.
-   * @property {number} [animation.innerShiftHide=1] - Shift of inner animation before hiding. It means that inner animation will start after (1 * animation.inner) since the button was pushed.
-   */
-
-  /**
-   * @alias Vevet.MenuModule
-   * 
-   * @param {Vevet.MenuModule.Properties} [data]
-   */
-  function MenuModule(data) {
-    _classCallCheck(this, MenuModule);
-
-    return _super.call(this, data);
-  }
-  /**
-   * @readonly
-   * @type {Vevet.MenuModule.Properties}
-   */
-
-
-  _createClass(MenuModule, [{
-    key: "defaultProp",
-    get: function get() {
-      return (0, _merge.default)(_get(_getPrototypeOf(MenuModule.prototype), "defaultProp", this), {
-        animation: {
-          duration: 500,
-          button: 500,
-          inner: 0,
-          innerShiftShow: 1,
-          innerShiftHide: 1
-        }
-      });
-    }
-    /**
-     * @member Vevet.MenuModule#prop
-     * @memberof Vevet.MenuModule
-     * @readonly
-     * @type {Vevet.MenuModule.Properties}
-     */
-
-    /**
-     * @member Vevet.MenuModule#_prop
-     * @memberof Vevet.MenuModule
-     * @protected
-     * @type {Vevet.MenuModule.Properties}
-     */
-
-    /**
-     * @function Vevet.MenuModule#changeProp
-     * @memberof Vevet.MenuModule
-     * @param {Vevet.MenuModule.Properties} [prop]
-     */
-
-    /**
-     * @description If the menu is animating: opening or closing.
-     * @default false
-     * @readonly
-     * @type {boolean}
-     */
-
-  }, {
-    key: "animating",
-    get: function get() {
-      return this._animating;
-    } // Extra Constructor
-
-  }, {
-    key: "_extra",
-    value: function _extra() {
-      _get(_getPrototypeOf(MenuModule.prototype), "_extra", this).call(this);
-      /**
-       * @description If the menu is animating.
-       * @protected
-       * @member {boolean}
-       */
-
-
-      this._animating = false;
-    }
-    /**
-     * @description Show/Hide the menu.
-     * @returns {boolean} Returns true if the menu can be opened or closed.
-     */
-
-  }, {
-    key: "toggle",
-    value: function toggle() {
-      // check if animating
-      if (this._animating) {
-        return false;
-      }
-
-      this._animating = true; // continue
-
-      return _get(_getPrototypeOf(MenuModule.prototype), "toggle", this).call(this);
-    }
-    /**
-     * @description Show the menu.
-     * @protected
-     */
-
-  }, {
-    key: "_show",
-    value: function _show() {
-      var _this = this;
-
-      _get(_getPrototypeOf(MenuModule.prototype), "_show", this).call(this); // vars
-
-
-      var outer = this._outer,
-          prefix = this._prefix,
-          animation = this._prop.animation; // set classes
-
-      outer.classList.add("".concat(prefix, "_show"));
-
-      if (this._button) {
-        this._button.classList.add("".concat(prefix, "-button_close"));
-      } // show inner
-
-
-      setTimeout(function () {
-        // add inner animation class
-        outer.classList.add("".concat(prefix, "_inner")); // inner animation callback
-
-        _this.lbt("innerShow");
-
-        setTimeout(function () {
-          _this._animating = false;
-
-          _this.lbt("innerShown");
-
-          _this.lbt("shown");
-        }, animation.inner);
-      }, animation.duration * animation.innerShiftShow);
-    }
-    /**
-     * @description Hide the menu.
-     * @protected
-     */
-
-  }, {
-    key: "_hide",
-    value: function _hide() {
-      var _this2 = this;
-
-      _get(_getPrototypeOf(MenuModule.prototype), "_hide", this).call(this); // vars
-
-
-      var outer = this._outer,
-          prefix = this._prefix,
-          animation = this._prop.animation; // inner animation callback
-
-      this.lbt("innerHide"); // change vars
-
-      setTimeout(function () {
-        // remove inner animation class
-        outer.classList.remove("".concat(prefix, "_inner")); // hide class
-
-        outer.classList.add("".concat(prefix, "_hide")); // inner animation end callback
-
-        _this2.lbt("innerHidden"); // remove menu class
-
-
-        if (_this2._button) {
-          _this2._button.classList.remove("".concat(prefix, "-button_close"));
-        }
-
-        setTimeout(function () {
-          _this2._animating = false;
-          _this2._shown = false;
-          outer.classList.remove("".concat(prefix, "_show"));
-          outer.classList.remove("".concat(prefix, "_hide"));
-
-          _this2.lbt("hidden");
-        }, animation.duration);
-      }, animation.inner * animation.innerShiftHide);
-    }
-  }]);
-
-  return MenuModule;
-}(_MenuBaseModule2.default);
-
-exports.default = MenuModule;

package/dist/js/MenuTimelineModule.js

@@ -1,321 +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 _MenuBaseModule2 = _interopRequireDefault(require("./MenuBaseModule"));
-
-var _merge = _interopRequireDefault(require("./merge"));
-
-var _TimelineBaseModule = _interopRequireDefault(require("./TimelineBaseModule"));
-
-var _TimelineModule = _interopRequireDefault(require("./TimelineModule"));
-
-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 A class for creating pop-up menus.
- * All animation are carried out through {@linkcode Vevet.TimelineModule}.
- * This menu CAN be closed if the animaiton of its opening has not ended yet and vice versa. <br>
- * Available targets:
- *  <ul>
- *      <li>progress - timeline animation. Argument - {@linkcode Vevet.TimelineBaseModule.Data}</li>
- *      <li>progressOuter - animate the outer element. Argument - {@linkcode Vevet.TimelineBaseModule.Data}</li>
- *      <li>progressInner - animate inner elements. Argument - {@linkcode Vevet.TimelineBaseModule.Data}</li>
- *      <li>show - when the menu is being opened.</li>
- *      <li>shown - when the menu is opened, the process of animation has ended.</li>
- *      <li>hide - when the menu is being hidden.</li>
- *      <li>hidden - when the menu is hidden and the animation has ended.</li>
- *  </ul>
- * <br><br> <b>import {MenuTimelineModule} from 'vevet';</b>
- * 
- * @vevetModuleCallback { Vevet.MenuTimelineModule : progress : Vevet.TimelineBaseModule.Data }
- * @vevetModuleCallback { Vevet.MenuTimelineModule : progressOuter : Vevet.TimelineBaseModule.Data }
- * @vevetModuleCallback { Vevet.MenuTimelineModule : progressInner : Vevet.TimelineBaseModule.Data }
- * @vevetModuleCallback { Vevet.MenuTimelineModule : show :  }
- * @vevetModuleCallback { Vevet.MenuTimelineModule : shown :  }
- * @vevetModuleCallback { Vevet.MenuTimelineModule : hide :  }
- * @vevetModuleCallback { Vevet.MenuTimelineModule : hidden :  }
- * 
- * @class
- * @memberof Vevet
- * @augments Vevet.MenuBaseModule
- * @requires Vevet.TimelineModule
- * @requires Vevet.TimelineBaseModule
- */
-var MenuTimelineModule = /*#__PURE__*/function (_MenuBaseModule) {
-  _inherits(MenuTimelineModule, _MenuBaseModule);
-
-  var _super = _createSuper(MenuTimelineModule);
-
-  /**
-   * @memberof Vevet.MenuTimelineModule
-   * @typedef {object} Properties
-   * @augments Vevet.MenuBaseModule.Properties
-   * 
-   * @property {object} [timeline] - Timeline settings.
-   * @property {number} [timeline.duration=1500] - The total duration of showing/hiding the menu.
-   * @property {Array<number>} [timeline.outerScope=[0, .25]] - *** In which scope of the main timeline the outer animation
-   * will be carried out. For example, how the outer element will appear.
-   * @property {Array<number>} [timeline.innerScope=[0, 1]] - *** In which scope of the main timeline the inner animation
-   * will be carried out. For example, how links in the menu will appear after the outer element is shown.
-   * @property {string|Array<number>} [timeline.easing] - Easing function of the animation.
-   */
-
-  /**
-   * @alias Vevet.MenuTimelineModule
-   * 
-   * @param {Vevet.MenuTimelineModule.Properties} [data]
-   */
-  function MenuTimelineModule(data) {
-    _classCallCheck(this, MenuTimelineModule);
-
-    return _super.call(this, data);
-  }
-  /**
-   * @readonly
-   * @type {Vevet.MenuTimelineModule.Properties}
-   */
-
-
-  _createClass(MenuTimelineModule, [{
-    key: "defaultProp",
-    get: function get() {
-      return (0, _merge.default)(_get(_getPrototypeOf(MenuTimelineModule.prototype), "defaultProp", this), {
-        timeline: {
-          duration: 1500,
-          outerScope: [0, .25],
-          innerScope: [0, 1],
-          easing: this._vp.easing
-        }
-      });
-    }
-    /**
-     * @member Vevet.MenuTimelineModule#prop
-     * @memberof Vevet.MenuTimelineModule
-     * @readonly
-     * @type {Vevet.MenuTimelineModule.Properties}
-     */
-
-    /**
-     * @member Vevet.MenuTimelineModule#_prop
-     * @memberof Vevet.MenuTimelineModule
-     * @protected
-     * @type {Vevet.MenuTimelineModule.Properties}
-     */
-
-    /**
-     * @function Vevet.MenuTimelineModule#changeProp
-     * @memberof Vevet.MenuTimelineModule
-     * @param {Vevet.MenuTimelineModule.Properties} [prop]
-     */
-    // Extra Constructor
-
-  }, {
-    key: "_extra",
-    value: function _extra() {
-      _get(_getPrototypeOf(MenuTimelineModule.prototype), "_extra", this).call(this);
-
-      var timelineProp = this._prop.timeline,
-          easing = timelineProp.easing;
-      /**
-       * @description Main timeline
-       * @member {Vevet.TimelineModule}
-       * @protected
-       */
-
-      this._timeline = new _TimelineModule.default();
-      var timeline = this._timeline;
-      timeline.on("progress", this._timelineAnimation.bind(this));
-      timeline.on("end", this._timelineAnimationEnd.bind(this));
-      /**
-       * @description Outer timeline
-       * @member {Vevet.TimelineBaseModule}
-       * @protected
-       */
-
-      this._timelineOuter = new _TimelineBaseModule.default({
-        line: timelineProp.outerScope,
-        easing: easing
-      });
-
-      this._timelineOuter.on("progress", this._timelineOuterAnimation.bind(this));
-
-      timeline.addTimeline(this._timelineOuter);
-      /**
-       * @description Innter timeline
-       * @member {Vevet.TimelineBaseModule}
-       * @protected
-       */
-
-      this._timelineInner = new _TimelineBaseModule.default({
-        line: timelineProp.innerScope,
-        easing: easing
-      });
-
-      this._timelineInner.on("progress", this._timelineInnerAnimation.bind(this));
-
-      timeline.addTimeline(this._timelineInner);
-    }
-    /**
-     * @description Animation.
-     * @param {Vevet.TimelineBaseModule.Data} data
-     * @protected
-     */
-
-  }, {
-    key: "_timelineAnimation",
-    value: function _timelineAnimation(data) {
-      this.lbt("progress", data);
-    }
-    /**
-     * @description When animation ends.
-     * @protected
-     */
-
-  }, {
-    key: "_timelineAnimationEnd",
-    value: function _timelineAnimationEnd() {
-      // callbacks
-      if (this._timeline.reversed) {
-        this.lbt("hidden");
-      } else {
-        this.lbt("shown");
-      } // vars
-
-
-      var outer = this._outer,
-          prefix = this._prefix; // manipulate with classes
-
-      if (this._timeline.reversed) {
-        outer.classList.remove("".concat(prefix, "_show"));
-        outer.classList.remove("".concat(prefix, "_hide"));
-      }
-    }
-    /**
-     * @description Outer animation.
-     * @param {Vevet.TimelineBaseModule.Data} data
-     * @protected
-     */
-
-  }, {
-    key: "_timelineOuterAnimation",
-    value: function _timelineOuterAnimation(data) {
-      this.lbt("progressOuter", data); // vars
-
-      var outer = this._outer,
-          button = this._button,
-          prefix = this._prefix; // manipulate with classes
-
-      if (!this._timeline.reversed) {
-        if (data.p > 0) {
-          outer.classList.add("".concat(prefix, "_show"));
-          outer.classList.remove("".concat(prefix, "_hide"));
-
-          if (button) {
-            button.classList.add("".concat(prefix, "-button_close"));
-          }
-        }
-      } else {
-        if (data.p < 1) {
-          outer.classList.add("".concat(prefix, "_hide"));
-
-          if (button) {
-            button.classList.remove("".concat(prefix, "-button_close"));
-          }
-        }
-      }
-    }
-    /**
-     * @description Inner animation.
-     * @param {Vevet.TimelineBaseModule.Data} data
-     * @protected
-     */
-
-  }, {
-    key: "_timelineInnerAnimation",
-    value: function _timelineInnerAnimation(data) {
-      this.lbt("progressInner", data);
-    }
-    /**
-     * @description Show the menu.
-     * @protected
-     */
-
-  }, {
-    key: "_show",
-    value: function _show() {
-      _get(_getPrototypeOf(MenuTimelineModule.prototype), "_show", this).call(this); // play the timeline
-
-
-      var timeline = this._timeline;
-
-      if (timeline.playing) {
-        timeline.reverse();
-      } else {
-        if (timeline.reversed) {
-          timeline.reverse();
-        }
-
-        timeline.play({
-          duration: this._prop.timeline.duration,
-          easing: this._prop.timeline.easing
-        });
-      }
-    }
-    /**
-     * @description Hide the menu.
-     * @protected
-     */
-
-  }, {
-    key: "_hide",
-    value: function _hide() {
-      _get(_getPrototypeOf(MenuTimelineModule.prototype), "_hide", this).call(this);
-
-      var timeline = this._timeline;
-
-      if (timeline.playing) {
-        timeline.reverse();
-      } else {
-        timeline.reverse();
-        timeline.play({
-          duration: this._prop.timeline.duration,
-          easing: this._prop.timeline.easing
-        });
-      }
-    }
-  }]);
-
-  return MenuTimelineModule;
-}(_MenuBaseModule2.default);
-
-exports.default = MenuTimelineModule;