vevet 1.4.27 → 2.0.1-dev.3

package/dist/js/DraggerModule.js

@@ -1,792 +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 _Module2 = _interopRequireDefault(require("./Module"));
-
-var _merge = _interopRequireDefault(require("./merge"));
-
-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); }
-
-var selectEl = require('select-el');
-/**
- * @classdesc Dragging/Swiping. <br>
- * Available targets:
- *  <ul>
- *      <li>start - argument {@linkcode Vevet.DraggerModule.Callback}<li>
- *      <li>end - argument {@linkcode Vevet.DraggerModule.Callback}</li>
- *      <li>move - argument {@linkcode Vevet.DraggerModule.Callback}</li>
- *      <li>up</li>
- *      <li>down</li>
- *      <li>left</li>
- *      <li>right</li>
- *  </ul>
- * <br><br> <b>import {DraggerModule} from 'vevet';</b>
- * 
- * @vevetModuleCallback { Vevet.DraggerModule : start : Vevet.DraggerModule.Callback }
- * @vevetModuleCallback { Vevet.DraggerModule : end : Vevet.DraggerModule.Callback }
- * @vevetModuleCallback { Vevet.DraggerModule : move : Vevet.DraggerModule.Callback }
- * @vevetModuleCallback { Vevet.DraggerModule : up :  }
- * @vevetModuleCallback { Vevet.DraggerModule : down :  }
- * @vevetModuleCallback { Vevet.DraggerModule : left :  }
- * @vevetModuleCallback { Vevet.DraggerModule : right :  }
- * 
- * @class
- * @memberof Vevet
- * @augments Vevet.Module
- */
-
-
-var DraggerModule = /*#__PURE__*/function (_Module) {
-  _inherits(DraggerModule, _Module);
-
-  var _super = _createSuper(DraggerModule);
-
-  /**
-   * @memberof Vevet.DraggerModule
-   * @typedef {object} ThresholdPropagation
-   * 
-   * @property { 'x' | 'y' } dir
-   * @property { number } value
-   */
-
-  /**
-   * @memberof Vevet.DraggerModule
-   * @typedef {object} Properties
-   * @augments Vevet.Module.Properties
-   * 
-   * @property {boolean} [on=true] - If the module is enabled.
-   * @property {string|HTMLElement|Window} outer - *** Selector of the element or the element itself.
-   * @property {number} [min=100] - Minimum length of movement in pixels to launch events under the targets "up", "down, "left", "right".
-   * @property {boolean} [momentum=false] - If momentum drag/swipe is enabled.
-   * @property {number} [momentumStopThreshold=0.01] - When the momentum stops.
-   * @property {number} [friction=.95] - Momentum deceleration friction.
-   * @property { Vevet.DraggerModule.ThresholdPropagation | false } [thresholdPropagation=false] - Stop propagation if a definite length of movement in pixels was reached.
-   * @property { boolean } [preventDefault=false] - Prevent default action on all events
-   * @property { boolean } [stopPropagation=false] - Stop event propagation action on all events
-   */
-
-  /**
-   * @alias Vevet.DraggerModule
-   * 
-   * @param {Vevet.DraggerModule.Properties} [data]
-   */
-  function DraggerModule(data) {
-    _classCallCheck(this, DraggerModule);
-
-    return _super.call(this, data);
-  }
-  /**
-   * @readonly
-   * @type {Vevet.DraggerModule.Properties}
-   */
-
-
-  _createClass(DraggerModule, [{
-    key: "defaultProp",
-    get: function get() {
-      return (0, _merge.default)(_get(_getPrototypeOf(DraggerModule.prototype), "defaultProp", this), {
-        on: true,
-        outer: '',
-        min: 100,
-        momentum: false,
-        momentumStopThreshold: .01,
-        friction: .95,
-        thresholdPropagation: false,
-        preventDefault: false,
-        stopPropagation: false
-      });
-    }
-    /**
-     * @member Vevet.DraggerModule#prop
-     * @memberof Vevet.DraggerModule
-     * @readonly
-     * @type {Vevet.DraggerModule.Properties}
-     */
-
-    /**
-     * @member Vevet.DraggerModule#_prop
-     * @memberof Vevet.DraggerModule
-     * @protected
-     * @type {Vevet.DraggerModule.Properties}
-     */
-
-    /**
-     * @function Vevet.DraggerModule#changeProp
-     * @memberof Vevet.DraggerModule
-     * @param {Vevet.DraggerModule.Properties} [prop]
-     */
-
-    /**
-     * @memberof Vevet.DraggerModule
-     * @typedef {object} Coords
-     * @property {number} x
-     * @property {number} y
-     */
-    // Extra Constructor
-
-  }, {
-    key: "_extra",
-    value: function _extra() {
-      _get(_getPrototypeOf(DraggerModule.prototype), "_extra", this).call(this);
-      /**
-       * @description Start coordinates. They can change when using "thresholdPropagation".
-       * @protected
-       * @member {Vevet.DraggerModule.Coords}
-       */
-
-
-      this._start = {
-        x: 0,
-        y: 0
-      };
-      /**
-       * @description Global coordinates / relative to the window.
-       * @protected 
-       * @member {Vevet.DraggerModule.Coords}
-       */
-
-      this._global = {
-        x: 0,
-        y: 0
-      };
-      /**
-       * @description Previous global coordinates.
-       * @protected 
-       * @member {Vevet.DraggerModule.Coords}
-       */
-
-      this._prev = {
-        x: 0,
-        y: 0
-      };
-      /**
-       * @description Difference between the previous and current values since the drag/swipe was started.
-       * @protected 
-       * @member {Vevet.DraggerModule.Coords}
-       */
-
-      this._diff = {
-        x: 0,
-        y: 0
-      };
-      /**
-       * @description If dragging at the moment
-       * @protected
-       * @member {boolean}
-       */
-
-      this._dragging = false;
-      /**
-       * @description If preventDefault and stopPropagation must be applied.
-       * @protected
-       * @member {boolean}
-       */
-
-      this._prevent = false;
-      /**
-       * @description If momentum is in process.
-       * @protected
-       * @member {boolean}
-       */
-
-      this._decelerating = false;
-      /**
-       * @description Deceleration target values.
-       * @protected 
-       * @member {Vevet.DraggerModule.Coords}
-       */
-
-      this._deceleration = {
-        x: 0,
-        y: 0
-      };
-      /**
-       * @description Pointer ID.
-       * @protected
-       * @member { any }
-       */
-
-      this._pointerID = false;
-      /**
-       * @description Tracking points. They are used to calculate the momentum strength.
-       * @type { Array<Vevet.DraggerModule.TrackingPoint> }
-       * @protected
-       */
-
-      this._trackingPoints = [];
-      /**
-       * @description Additional event listeners.
-       * @protected
-       * @member { Array<Vevet.BindListener> }
-       */
-
-      this._runningListeners = []; // get elements
-
-      this._getElements();
-    }
-    /**
-     * @description Get elements
-     * @protected
-     */
-
-  }, {
-    key: "_getElements",
-    value: function _getElements() {
-      /**
-       * @description Outer element.
-       * @protected
-       * @member {HTMLElement}
-       */
-      this._outer = selectEl.one(this._prop.outer);
-    } // Remove event listeners when properties are changed
-
-  }, {
-    key: "_changeProp",
-    value: function _changeProp() {
-      // remove events
-      this.removeEventListeners(); // update elements
-
-      this._getElements(); // set events
-
-
-      this._setEvents();
-    }
-    /**
-     * @description Set events.
-     * @protected
-     */
-
-  }, {
-    key: "_setEvents",
-    value: function _setEvents() {
-      if (this._prop.on) {
-        this._setStartEvents();
-      }
-    }
-    /**
-     * @description Set events to start dragging. In {@linkcode Vevet.DraggerModule} is is empty.
-     * @protected
-     */
-
-  }, {
-    key: "_setStartEvents",
-    value: function _setStartEvents() {
-      this.listener(this._outer, "mousedown", this._onStart.bind(this));
-      this.listener(this._outer, "touchstart", this._onStart.bind(this));
-    }
-    /**
-     * @description Add running events.
-     * @protected
-     */
-
-  }, {
-    key: "_addRunningEvents",
-    value: function _addRunningEvents() {
-      this._removeRunningEvents();
-
-      var listeners = this._runningListeners;
-      var outer = this._outer;
-      listeners.push(this.listener(outer, 'touchmove', this._onMove.bind(this), {
-        passive: false
-      }));
-      listeners.push(this.listener(outer, 'touchend', this._onEnd.bind(this), {
-        passive: false
-      }));
-      listeners.push(this.listener(outer, 'touchcancel', this._onStop.bind(this), {
-        passive: false
-      }));
-      listeners.push(this.listener(window, 'mousemove', this._onMove.bind(this), {
-        passive: false
-      }));
-      listeners.push(this.listener(window, 'mouseup', this._onEnd.bind(this), {
-        passive: false
-      }));
-      listeners.push(this.listener(window, 'blur', this._onStop.bind(this), {
-        passive: false
-      }));
-    }
-    /**
-     * @description Remove running events.
-     * @protected
-     */
-
-  }, {
-    key: "_removeRunningEvents",
-    value: function _removeRunningEvents() {
-      var _this = this;
-
-      this._runningListeners.forEach(function (event) {
-        _this.removeEventListener({
-          id: event.id,
-          el: event.el
-        });
-      });
-
-      this._runningListeners = [];
-    }
-    /**
-     * @description When dragging has been started.
-     * @param { MouseEvent | TouchEvent } e
-     * @protected
-     */
-
-  }, {
-    key: "_onStart",
-    value: function _onStart(e) {
-      var event = this._normalizeEvent(e);
-
-      if (this._prop.preventDefault) {
-        e.preventDefault();
-      }
-
-      if (this._prop.stopPropagation) {
-        e.stopPropagation();
-      }
-
-      if (!this._dragging) {
-        // prevent actions
-        if (e.type == 'mousedown') {
-          if (e.which == 1) {
-            e.stopPropagation();
-          } else {
-            return;
-          }
-        } // change dragging vars
-
-
-        this._dragging = true;
-        this._decelerating = false;
-        this._prevent = false;
-        this._pointerID = event.id; // reset difference
-
-        this._diff.x = 0;
-        this._diff.y = 0; // change coordinates
-
-        this._global.x = this._prev.x = this._start.x = event.x;
-        this._global.y = this._prev.y = this._start.y = event.y; // change tracking points
-
-        this._trackingPoints = [];
-
-        this._addTrackingPoint(event.x, event.y); // add additional events
-
-
-        this._addRunningEvents(); // call events
-
-
-        this._callEvents('start');
-      }
-    }
-    /**
-     * @description Handles move events
-     * @param { Event } e
-     */
-
-  }, {
-    key: "_onMove",
-    value: function _onMove(e) {
-      if (this._prop.preventDefault) {
-        e.preventDefault();
-      }
-
-      if (this._prop.stopPropagation) {
-        e.stopPropagation();
-      }
-
-      var event = this._normalizeEvent(e);
-
-      if (this._dragging && event.id === this._pointerID) {
-        // calculate difference between current and previous coordinates
-        this._diff.x += Math.abs(event.x - this._global.x);
-        var diffX = this._diff.x;
-        this._diff.y += Math.abs(event.y - this._global.y);
-        var diffY = this._diff.y; // change coordinates
-
-        this._global.x = event.x;
-        this._global.y = event.y; // check if movement is possible
-        // or prevent the default event and propagation
-
-        var thresholdPropagation = this._prop.thresholdPropagation;
-
-        if (thresholdPropagation) {
-          var value = thresholdPropagation.value;
-
-          if (thresholdPropagation.dir == 'x' & diffX > value & diffX > diffY || thresholdPropagation.dir == 'y' & diffY > value & diffY > diffX) {
-            e.stopPropagation();
-            e.preventDefault();
-            this._prevent = true; // if (this._prop.stopppp) {
-            //     console.log("stopppp")
-            // }
-          } else {
-            this._start.x = event.x;
-            this._start.y = event.y;
-            return;
-          }
-        } // add a tracking point
-
-
-        this._addTrackingPoint(this._prev.x, this._prev.y); // call events
-
-
-        this._callEvents("move");
-      }
-    }
-    /**
-     * @description Handles end events
-     * @param { Event } e
-     */
-
-  }, {
-    key: "_onEnd",
-    value: function _onEnd(e) {
-      if (this._prop.preventDefault) {
-        e.preventDefault();
-      }
-
-      if (this._prop.stopPropagation) {
-        e.stopPropagation();
-      }
-
-      var event = this._normalizeEvent(e);
-
-      if (this._dragging && event.id === this._pointerID) {
-        this.stopDrag(false); // start deceleration at the end if enabled
-
-        if (this._prop.momentum) {
-          this._startDeceleration();
-        } // if no, call the end events
-        else {
-            this._callEvents("end");
-          }
-      }
-    }
-    /**
-     * @description Handles end events
-     */
-
-  }, {
-    key: "_onStop",
-    value: function _onStop() {
-      if (this._dragging) {
-        this.stopDrag();
-      }
-    }
-    /**
-     * @description Stop Swipe/Drag.
-     * @param { boolean } [bool] - Launch end callbacks.
-     */
-
-  }, {
-    key: "stopDrag",
-    value: function stopDrag() {
-      var bool = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : true;
-      // change dragging bools
-      this._dragging = false;
-      this._decelerating = false;
-      this._prevent = false; // remove runtime listeners
-
-      this._removeRunningEvents(); // callbacks
-
-
-      if (bool) {
-        this._callEvents("end");
-      }
-    }
-    /**
-     * @memberof Vevet.DraggerModule
-     * @typedef {object} NormalizedEvent
-     * @property { number } x
-     * @property { number } y
-     * @property { any } id
-     */
-
-    /**
-     * @description Normalize Data from the event.
-     * @param { Event } e
-     * @protected
-     */
-
-  }, {
-    key: "_normalizeEvent",
-    value: function _normalizeEvent(e) {
-      // touch events
-      if (e.type === 'touchmove' || e.type === 'touchstart' || e.type === 'touchend') {
-        var touch = e.targetTouches[0] || e.changedTouches[0];
-        return {
-          x: touch.clientX,
-          y: touch.clientY,
-          id: touch.identifier
-        };
-      } // mouse events
-
-
-      return {
-        x: e.clientX,
-        y: e.clientY,
-        id: null
-      };
-    }
-    /**
-     * @description Records movement for the last 100ms
-     * @param {number} x
-     * @param {number} y
-     * @protected
-     */
-
-  }, {
-    key: "_addTrackingPoint",
-    value: function _addTrackingPoint(x, y) {
-      var time = Date.now();
-      var trackingPoints = this._trackingPoints;
-
-      while (trackingPoints.length > 0) {
-        if (time - trackingPoints[0].time <= 100) {
-          break;
-        }
-
-        trackingPoints.shift();
-      }
-
-      trackingPoints.push({
-        x: x,
-        y: y,
-        time: time
-      });
-      this._trackingPoints = trackingPoints;
-    }
-    /**
-     * @memberof Vevet.DraggerModule
-     * @typedef {object} TrackingPoint
-     * @property { number } time
-     * @property { number } x
-     * @property { number } y
-     */
-
-    /**
-     * @description Calculate and start momentum deceleration.
-     * @protected
-     */
-
-  }, {
-    key: "_startDeceleration",
-    value: function _startDeceleration() {
-      var trackingPoints = this._trackingPoints;
-      var firstPoint = trackingPoints[0];
-      var lastPoint = trackingPoints[trackingPoints.length - 1];
-      var xOffset = lastPoint.x - firstPoint.x;
-      var yOffset = lastPoint.y - firstPoint.y;
-      var timeOffset = lastPoint.time - firstPoint.time;
-      var D = timeOffset / 35;
-      var decelerateTarget = this._deceleration;
-      decelerateTarget.x = xOffset / D || 0;
-      decelerateTarget.y = yOffset / D || 0;
-
-      if (Math.abs(decelerateTarget.x) > 1 || Math.abs(decelerateTarget.y) > 1) {
-        this._decelerating = true;
-        window.requestAnimationFrame(this._decelerationAnim.bind(this));
-      } else {
-        this.stopDrag();
-      }
-    }
-    /**
-     * @description Momentum deceleration animation.
-     * @protected
-     */
-
-  }, {
-    key: "_decelerationAnim",
-    value: function _decelerationAnim() {
-      // stop if not decelerating
-      if (!this._decelerating) {
-        return;
-      } // vars
-
-
-      var stopThreshold = this._prop.momentumStopThreshold;
-      var friction = this._prop.friction; // decelerate momentum
-
-      this._deceleration.x *= friction;
-      var x = this._deceleration.x;
-      this._deceleration.y *= friction;
-      var y = this._deceleration.y; // iterate global coordinates
-
-      this._global.x += x;
-      this._global.y += y; // launch callbacks
-
-      this._callEvents("move"); // continue decelerating
-
-
-      if (Math.abs(x) > stopThreshold & Math.abs(y) > stopThreshold) {
-        window.requestAnimationFrame(this._decelerationAnim.bind(this));
-      } else {
-        this.stopDrag();
-      }
-    }
-    /**
-     * @description Call events.
-     * @param { 'start' | 'move' | 'end' } target 
-     */
-
-  }, {
-    key: "_callEvents",
-    value: function _callEvents(target) {
-      // get new coordinates
-      var coords = this._calcCoords(); // if the target is "start", call the start callback
-
-
-      if (target == 'start') {
-        this.lbt("start", coords);
-      } // if the target is "move", call the move callback
-      else if (target == 'move') {
-          this.lbt("move", coords);
-        } // if another target, call "end" callbacks and the "once-callbacks" if they exist
-        else {
-            this.lbt("end", coords);
-
-            this._callOnceEvents(coords);
-          } // change previous values
-
-
-      this._prev.x = this._global.x;
-      this._prev.y = this._global.y;
-    }
-    /**
-     * @description Call once-events
-     * @protected
-     * @param { Vevet.DraggerModule.Coords } coords
-     */
-
-  }, {
-    key: "_callOnceEvents",
-    value: function _callOnceEvents(coords) {
-      var global = coords.global;
-      var startX = this._start.x;
-      var startY = this._start.y;
-      var min = this._prop.min; // to left / left
-
-      if (startX > global.x) {
-        if (Math.abs(startX - global.x) > Math.abs(min)) {
-          this.lbt("left");
-        }
-      } // to right / right
-
-
-      if (startX < global.x) {
-        if (Math.abs(startX - global.x) > Math.abs(min)) {
-          this.lbt("right");
-        }
-      } // to top / up
-
-
-      if (startY > global.y) {
-        if (Math.abs(startY - global.y) > Math.abs(min)) {
-          this.lbt("up");
-        }
-      } // to bottom / down
-
-
-      if (startY < global.y) {
-        if (Math.abs(startY - global.y) > Math.abs(min)) {
-          this.lbt("down");
-        }
-      }
-    }
-    /**
-     * @memberof Vevet.DraggerModule
-     * @typedef {object} Callback
-     * @property {Vevet.DraggerModule.Coords} global - Coordinates relative to the window. 
-     * @property {Vevet.DraggerModule.Coords} inner - Coordinates relative to the outer. 
-     * @property {Vevet.DraggerModule.Coords} diff - Difference between the start and current coordinates.
-     * @property {Vevet.DraggerModule.Coords} step - Difference between current and previous values.
-     */
-
-    /**
-     * @description Calculate current coordinates.
-     * @protected
-     * @returns { Vevet.DraggerModule.Callback }
-     */
-
-  }, {
-    key: "_calcCoords",
-    value: function _calcCoords() {
-      // get outer
-      var outer = this._outer; // get global coords
-
-      var global = this._global; // calculate all coordinates
-
-      var bounding = {
-        top: 0,
-        left: 0
-      },
-          inner = {
-        x: 0,
-        y: 0
-      },
-          diff = {
-        x: 0,
-        y: 0
-      },
-          step = {
-        x: 0,
-        y: 0
-      }; // get inner coords
-      // if the outer is not the window or document, its bounding will be taken into consideration also
-
-      if (outer instanceof Window || outer instanceof Document) {
-        inner.x = global.x;
-        inner.y = global.y;
-      } else {
-        bounding = outer.getBoundingClientRect();
-        inner.x = global.x - bounding.left;
-        inner.y = global.y - bounding.top;
-      } // get difference coords
-
-
-      diff.x = inner.x - (this._start.x - bounding.left);
-      diff.y = inner.y - (this._start.y - bounding.top); // get step values
-
-      step.x = global.x - this._prev.x;
-      step.y = global.y - this._prev.y; // create an object with new coordinates
-
-      return {
-        global: global,
-        inner: inner,
-        diff: diff,
-        step: step
-      };
-    }
-  }]);
-
-  return DraggerModule;
-}(_Module2.default);
-
-exports.default = DraggerModule;