vevet 1.4.27 → 2.0.1-dev.3

package/dist/js/ScrollViewModule.js

@@ -1,388 +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 _ScrollAnimateModule = _interopRequireDefault(require("./ScrollAnimateModule"));
-
-var _merge = _interopRequireDefault(require("./merge"));
-
-var _timeoutCallback = _interopRequireDefault(require("./timeoutCallback"));
-
-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 Get notified when a DOM element enters the viewport. <br>
- * Available targets:
- *  <ul>
- *      <li>in - when an element appears in the viewport. Each callback receives {@linkcode Vevet.ScrollViewModule.Event} as an argument.</li>
- *  </ul>
- * <br><br> <b>import {ScrollViewModule} from 'vevet';</b>
- * 
- * @vevetModuleCallback { Vevet.ScrollViewModule : in : Vevet.ScrollViewModule.Event}
- * 
- * @class
- * @abstract
- * @memberof Vevet
- * @augments Vevet.ScrollAnimateModule
- */
-var ScrollViewModule = /*#__PURE__*/function (_ScrollAnimate) {
-  _inherits(ScrollViewModule, _ScrollAnimate);
-
-  var _super = _createSuper(ScrollViewModule);
-
-  /**
-   * @memberof Vevet.ScrollViewModule
-   * @typedef {object} Properties
-   * @augments Vevet.ScrollAnimateModule.Properties
-   * 
-   * @property {number} [edge=0.9] - The moment when an element is in viewport. 
-   * 0.9 = 90% of viewport height/width from top/left.
-   * @property {boolean} [seekLoad=true] - *** Call {@linkcode Vevet.ScrollViewModule#seek} after the page is loaded.
-   * @property {string} [classToAdd=vevet-view__el_viewed] - Class to be added to the dom element when it appears in the viewport.
-   * @property {number} [stackDelay=100] - A delay before callbacks are launched.
-   * It is applied only for those elements that have an attribute "data-vevet-view-stack"
-   * and only on the first launch of {@linkcode Vevet.ScrollViewModule#seek}. 
-   * The value of the attribute must be order of elements from 0 to Infinity.
-   * 
-   * @property {object} [autostack]
-   * @property {boolean} [autostack.on=false] - Set true to enable auto-calculation 
-   * of delay of the elements on the first launch of {@linkcode Vevet.ScrollViewModule#seek}.
-   * Autostack will be ignored for the elements that have the attribute "data-vevet-view-stack".
-   * @property {number} [autostack.delay=750] - The maximal delay for the element nearest to the edge of
-   * the scroll outer.
-   */
-
-  /**
-   * @alias Vevet.ScrollViewModule
-   * 
-   * @param {Vevet.ScrollViewModule.Properties} [data]
-   */
-  function ScrollViewModule(data) {
-    _classCallCheck(this, ScrollViewModule);
-
-    return _super.call(this, data);
-  }
-
-  _createClass(ScrollViewModule, [{
-    key: "prefix",
-    get: function get() {
-      return "".concat(this._v.prefix, "view");
-    }
-    /**
-     * @readonly
-     * @type {Vevet.ScrollViewModule.Properties}
-     */
-
-  }, {
-    key: "defaultProp",
-    get: function get() {
-      return (0, _merge.default)(_get(_getPrototypeOf(ScrollViewModule.prototype), "defaultProp", this), {
-        edge: .9,
-        seekLoad: true,
-        classToAdd: "".concat(this._prefix, "__el_viewed"),
-        stackDelay: 100,
-        autostack: {
-          on: false,
-          delay: 750
-        }
-      });
-    }
-    /**
-     * @member Vevet.ScrollViewModule#prop
-     * @memberof Vevet.ScrollViewModule
-     * @readonly
-     * @type {Vevet.ScrollViewModule.Properties}
-     */
-
-    /**
-     * @member Vevet.ScrollViewModule#_prop
-     * @memberof Vevet.ScrollViewModule
-     * @protected
-     * @type {Vevet.ScrollViewModule.Properties}
-     */
-
-    /**
-     * @function Vevet.ScrollViewModule#changeProp
-     * @memberof Vevet.ScrollViewModule
-     * @param {Vevet.ScrollViewModule.Properties} [prop]
-     */
-
-    /**
-     * @memberof Vevet.ScrollViewModule
-     * @typedef {object} Event
-     * 
-     * @property {HTMLElement} el - The element that appeared in the viewport.
-     */
-    // Extra Constructor
-
-  }, {
-    key: "_extra",
-    value: function _extra() {
-      var prefix = this._prefix;
-      /**
-       * @description Edge border
-       * @protected
-       * @member {number}
-       */
-
-      this._edge = 0;
-      /**
-       * @description If first load
-       * @protected
-       * @member {boolean}
-       */
-
-      this._firstLoad = true;
-      /**
-       * @description Data attributes names.
-       * @member {object}
-       * @protected
-       */
-
-      this._data = {
-        proceeded: "data-".concat(prefix, "-proceeded"),
-        in: "data-".concat(prefix, "-in"),
-        stack: "data-".concat(prefix, "-stack")
-      };
-
-      _get(_getPrototypeOf(ScrollViewModule.prototype), "_extra", this).call(this);
-      /**
-       * @description Properties.
-       * @member {object}
-       * @protected
-       */
-
-
-      this._properties = {
-        callback: "".concat(prefix, "-callback")
-      };
-    }
-    /**
-     * @description Get elements.
-     * @protected
-     */
-
-  }, {
-    key: "_elGet",
-    value: function _elGet() {
-      _get(_getPrototypeOf(ScrollViewModule.prototype), "_elGet", this).call(this);
-
-      var data = this._data; // proceeded
-
-      for (var i = 0; i < this._el.length; i++) {
-        var el = this._el[i];
-        var attribute = el[data.proceeded];
-
-        if (typeof attribute == 'undefined') {
-          el[data.in] = false;
-          el[data.proceeded] = true;
-        }
-      }
-    }
-    /**
-     * @description Update elements.
-     */
-
-  }, {
-    key: "updateEl",
-    value: function updateEl() {
-      // remove event listeners before
-      this._removeScrollListeners(); // get new elements
-
-
-      this._elGet();
-    }
-    /**
-     * @description Set events.
-     * @protected
-     */
-
-  }, {
-    key: "_setEvents",
-    value: function _setEvents() {
-      var _this = this;
-
-      _get(_getPrototypeOf(ScrollViewModule.prototype), "_setEvents", this).call(this);
-
-      var prop = this._prop; // on load
-
-      if (prop.seekLoad) {
-        this.addEvent('load', {
-          name: this.name,
-          do: function _do() {
-            if (prop.seekLoad) {
-              _this.seek();
-            }
-          }
-        });
-      } // add class
-
-
-      this.on("in", function (data) {
-        data.el.classList.add(prop.classToAdd);
-      });
-    }
-    /**
-     * @description Update size values.
-     */
-
-  }, {
-    key: "setSize",
-    value: function setSize() {
-      _get(_getPrototypeOf(ScrollViewModule.prototype), "setSize", this).call(this);
-
-      this._edge = this._prop.edge * this._size;
-    } // Seek elements
-
-  }, {
-    key: "seek",
-    value: function seek() {
-      var _this2 = this;
-
-      var val = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
-
-      if (!_get(_getPrototypeOf(ScrollViewModule.prototype), "seek", this).call(this, val)) {
-        return false;
-      }
-
-      var boundingOuter = this._bounding,
-          prop = this._prop,
-          horizontal = prop.horizontal,
-          data = this._data; // get edge
-
-      var edge = this._edge;
-
-      if (this._firstLoad) {
-        edge = this._size;
-      }
-
-      var _loop = function _loop(i) {
-        var el = _this2._el[i]; // continue if the element already entered the viewport
-
-        if (el[data.in]) {
-          return "continue";
-        } // get sizes
-
-
-        var bounding = el.getBoundingClientRect();
-        var b = {
-          top: bounding.top - boundingOuter.top,
-          bottom: bounding.bottom - boundingOuter.bottom,
-          left: bounding.left - boundingOuter.left,
-          right: bounding.right - boundingOuter.right
-        };
-        var elEdges = horizontal ? [b.left, b.right] : [b.top, b.bottom],
-            elSize = horizontal ? el.clientWidth : el.clientHeight; // check if in viewport
-
-        if (elEdges[0] < edge) {
-          if (elEdges[0] > elSize * -1) {
-            // if stack
-            var delay = 0;
-
-            if (_this2._firstLoad) {
-              delay = _this2._getDelay(el, elEdges);
-            } // form an object for event
-
-
-            var obj = {
-              el: el
-            }; // element on view
-
-            (0, _timeoutCallback.default)(function () {
-              _this2.lbt("in", obj);
-
-              _this2._seekCallback(el);
-            }, delay); // change vars
-
-            el[data.in] = true;
-          }
-        }
-      };
-
-      for (var i = 0; i < this._el.length; i++) {
-        var _ret = _loop(i);
-
-        if (_ret === "continue") continue;
-      } // first load
-
-
-      if (this._firstLoad) {
-        this._firstLoad = false;
-      }
-
-      return true;
-    }
-    /**
-     * @description Get element view delay
-     * @protected
-     * @param {HTMLElement} el 
-     * @param {Array<number>} elEdges 
-     */
-
-  }, {
-    key: "_getDelay",
-    value: function _getDelay(el, elEdges) {
-      var prop = this._prop,
-          autostack = prop.autostack,
-          delay = 0;
-      var stack = el.getAttribute(this._data.stack);
-
-      if (stack) {
-        delay = parseInt(stack) * prop.stackDelay;
-      } else {
-        if (autostack.on) {
-          delay = elEdges[0] / this._size * autostack.delay;
-        }
-      }
-
-      return delay;
-    }
-    /**
-     * @protected
-     * @param {HTMLElement} el 
-     */
-
-  }, {
-    key: "_seekCallback",
-    value: function _seekCallback(el) {
-      var callbackProp = this._properties.callback;
-
-      if (typeof el[callbackProp] != "undefined") {
-        el[callbackProp]();
-      }
-    }
-  }]);
-
-  return ScrollViewModule;
-}(_ScrollAnimateModule.default);
-
-exports.default = ScrollViewModule;