vevet 1.4.27 → 2.0.1-dev.3

package/dist/js/TextSplitModule.js

@@ -1,785 +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"));
-
-var _domInsertAfter = _interopRequireDefault(require("./domInsertAfter"));
-
-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');
-
-var dom = require('dom-create-element');
-/**
- * @classdesc Split text into letters, words & lines. <br>
- *  Available targets:
- *  <ul>
- *      <li>resize - when window is resizes.</li>
- *      <li>split - when the text is splitted into letters, words & lines. Argument - {@linkcode Vevet.TextSplitModule.Elements}</li>
- *  </ul>
- * <br><br> <b>import {TextSplitModule} from 'vevet';</b>
- * 
- * @vevetModuleCallback { Vevet.TextSplitModule : resize :  }
- * @vevetModuleCallback { Vevet.TextSplitModule : split : Vevet.TextSplitModule.Elements }
- * 
- * @class
- * @memberof Vevet
- * @augments Vevet.Module
- */
-
-
-var TextSplitModule = /*#__PURE__*/function (_Module) {
-  _inherits(TextSplitModule, _Module);
-
-  var _super = _createSuper(TextSplitModule);
-
-  /**
-   * @memberof Vevet.TextSplitModule
-   * @typedef {object} Properties
-   * @augments Vevet.Module.Properties
-   * 
-   * @property {string|HTMLElement} [selector=.vevet-textSplit] - *** Element with text.
-   * @property {number} [resizeTimeout=0] - Timeout before lines are updated when the window is resized.
-   * @property {boolean} [appendLetters=true] - *** Defines if we need to wrap each char into a span.
-   * @property {boolean} [appendWords=true] - *** Defines if we need to wrap each word into a span.
-   * @property {boolean} [appendLines=false] - *** Defines if we need to wrap each line into a span.
-   */
-
-  /**
-   * @alias Vevet.TextSplitModule
-   * 
-   * @param {Vevet.TextSplitModule.Properties} [data]
-   */
-  function TextSplitModule(data) {
-    _classCallCheck(this, TextSplitModule);
-
-    return _super.call(this, data);
-  }
-
-  _createClass(TextSplitModule, [{
-    key: "prefix",
-    get: function get() {
-      return "".concat(this._v.prefix, "text-split");
-    }
-    /**
-     * @readonly
-     * @type {Vevet.TextSplitModule.Properties}
-     */
-
-  }, {
-    key: "defaultProp",
-    get: function get() {
-      return (0, _merge.default)(_get(_getPrototypeOf(TextSplitModule.prototype), "defaultProp", this), {
-        selector: ".".concat(this._prefix),
-        resizeTimeout: 0,
-        appendLetters: true,
-        appendWords: true,
-        appendLines: false
-      });
-    }
-    /**
-     * @member Vevet.TextSplitModule#prop
-     * @memberof Vevet.TextSplitModule
-     * @readonly
-     * @type {Vevet.TextSplitModule.Properties}
-     */
-
-    /**
-     * @member Vevet.TextSplitModule#_prop
-     * @memberof Vevet.TextSplitModule
-     * @protected
-     * @type {Vevet.TextSplitModule.Properties}
-     */
-
-    /**
-     * @function Vevet.TextSplitModule#changeProp
-     * @memberof Vevet.TextSplitModule
-     * @param {Vevet.TextSplitModule.Properties} [prop]
-     */
-
-    /**
-     * @memberof Vevet.TextSplitModule
-     * @typedef {object} Letter
-     * @property {HTMLElement|false} el Defines the span element itself.
-     * @property {string} content Defines innerHTML of the element.
-     * @property {boolean} newline Defines if the element precedes a new line.
-     * @property {boolean} whitespace Defines if the element precedes a whitespace.
-     * @property {string} type Defines the type of the element.
-     */
-
-    /**
-     * @description Get letters.
-     * @readonly
-     * @type {Array<Vevet.TextSplitModule.Letter>}
-     */
-
-  }, {
-    key: "letters",
-    get: function get() {
-      return this._el.letters;
-    }
-    /**
-     * @memberof Vevet.TextSplitModule
-     * @typedef {object} Word
-     * @property {HTMLElement|false} el Defines the span element itself.
-     * @property {string} content Defines the contents of all letters inside the word.
-     * @property {Array<Vevet.TextSplitModule.Letter>} children All letters inside the word.
-     * @property {boolean} newline Defines if the element precedes a new line.
-     * @property {string} type Defines the type of the element.
-     */
-
-    /**
-     * @description Get words.
-     * @readonly
-     * @type {Array<Vevet.TextSplitModule.Word>}
-     */
-
-  }, {
-    key: "words",
-    get: function get() {
-      return this._el.words;
-    }
-    /**
-     * @memberof Vevet.TextSplitModule
-     * @typedef {object} Line
-     * @property {HTMLElement|false} el Defines the span element itself.
-     * @property {string} content The contents of all words inside of the line.
-     * @property {Array<Vevet.TextSplitModule.Word|Vevet.TextSplitModule.Letter>} children All words inside of the line.
-     * @property {string} type Defines the type of the element.
-     */
-
-    /**
-     * @description Get lines.
-     * @readonly
-     * @type {Array<Vevet.TextSplitModule.Line>}
-     */
-
-  }, {
-    key: "lines",
-    get: function get() {
-      return this._el.lines;
-    }
-    /**
-     * @memberof Vevet.TextSplitModule
-     * @typedef {object} Elements
-     * @property {Array<Vevet.TextSplitModule.Letter>} letters
-     * @property {Array<Vevet.TextSplitModule.Word>} words
-     * @property {Array<Vevet.TextSplitModule.Line>} lines
-     */
-
-    /**
-     * @description Get all elements of the text.
-     * @readonly
-     * @type {Vevet.TextSplitModule.Elements}
-     */
-
-  }, {
-    key: "elements",
-    get: function get() {
-      return this._el;
-    }
-    /**
-     * @description Get outer element.
-     * @readonly
-     * @type {HTMLElement}
-     */
-
-  }, {
-    key: "outer",
-    get: function get() {
-      return this._outer;
-    } // Extra Constructor
-
-  }, {
-    key: "_extra",
-    value: function _extra() {
-      _get(_getPrototypeOf(TextSplitModule.prototype), "_extra", this).call(this);
-      /**
-       * @description Outer element.
-       * @protected
-       * @member {HTMLElement}
-       */
-
-
-      this._outer = selectEl.one(this._prop.selector);
-      var outer = this._outer;
-      outer.classList.add("".concat(this._prefix));
-      /**
-       * @description Inner text.
-       * @protected
-       * @member {string}
-       */
-
-      this._text = outer.innerText;
-
-      if (this._text.length == 0) {
-        this._text = outer.textContent;
-      }
-      /**
-       * @description Inner HTML.
-       * @protected
-       * @member {string}
-       */
-
-
-      this._html = outer.innerHTML;
-      /**
-       * @description Defines if the text is already split into letters & words.
-       * @protected
-       * @member {boolean}
-       */
-
-      this._splitBool = false;
-      /**
-       * @description Elements.
-       * @protected
-       * @member {Vevet.TextSplitModule.Elements}
-       */
-
-      this._el = {
-        letters: [],
-        words: [],
-        lines: []
-      }; // split text
-
-      this.split();
-    } // Set events
-
-  }, {
-    key: "_setEvents",
-    value: function _setEvents() {
-      var _this = this;
-
-      _get(_getPrototypeOf(TextSplitModule.prototype), "_setEvents", this).call(this);
-
-      this.addEvent("viewport", {
-        target: 'w_',
-        name: this.name,
-        do: function _do() {
-          _this._resize();
-        }
-      });
-    }
-    /**
-     * @description Resize & split.
-     * @protected
-     */
-
-  }, {
-    key: "_resize",
-    value: function _resize() {
-      var _this2 = this;
-
-      setTimeout(function () {
-        _this2._resizeFunc();
-      }, this._prop.resizeTimeout);
-    }
-    /**
-     * @description Split on resize.
-     * @protected
-     */
-
-  }, {
-    key: "_resizeFunc",
-    value: function _resizeFunc() {
-      this.split();
-      this.lbt("resize");
-    }
-    /**
-     * @description Split the text into letters, words and lines.
-     * If the text is already split into words and letters, a new array of lines containing words 
-     * will be formed. See {@linkcode Vevet.TextSplitModule.Elements}
-     */
-
-  }, {
-    key: "split",
-    value: function split() {
-      // get prop
-      var prop = this._prop; // perhaps, you will need thid class
-      // it is added when the text is being split
-      // and it removes  when it is already split
-
-      this._outer.classList.add("".concat(this._prefix, "_splitting")); // split text into letters and words
-
-
-      if (!this._splitBool) {
-        // split
-        this._wordsSplit();
-
-        this._lettersSplit(); // clear innerHTML
-
-
-        this._outer.innerHTML = ''; // and append
-
-        this._lettersAppend();
-
-        this._wordsAppend();
-      } // remove previous lines
-
-
-      if (this._splitBool) {
-        this._linesRemove();
-      } // append spaces
-
-
-      if (!prop.appendLines) {
-        if (!this._splitBool) {
-          this._appendSpaces();
-        }
-      } // split to lines
-
-
-      if (prop.appendLines) {
-        this._appendSpaces();
-
-        this._linesSplit();
-
-        this._removeBr();
-
-        this._linesAppend();
-
-        this._appendSpaces();
-      } else {
-        this._linesSplit();
-      } // change value
-
-
-      this._splitBool = true; // remove the class
-
-      this._outer.classList.remove("".concat(this._prefix, "_splitting")); // launch callback
-
-
-      this.lbt("split", this._el);
-    }
-    /**
-     * @description Split text into words.
-     * @protected
-     */
-
-  }, {
-    key: "_wordsSplit",
-    value: function _wordsSplit() {
-      var _this3 = this;
-
-      // split text to chars
-      var chars = this._text.split(""),
-          el = [],
-          word = []; // gor thru all chars and add them to single words
-
-
-      var i = 0;
-      chars.forEach(function (char) {
-        var whitespace = false,
-            newline = false,
-            charCode = char.charCodeAt(0),
-            newWord = false,
-            lastChar = i == chars.length - 1; // if a whitespace
-
-        if (charCode === 32 || charCode === 160) {
-          whitespace = true;
-        } // if a new line
-        else if (charCode === 10) {
-            newline = true;
-          } // define if a new word
-
-
-        if (newline || whitespace || lastChar) {
-          newWord = true;
-
-          if (lastChar) {
-            word.push(char);
-          }
-        } // if a new word
-
-
-        if (newWord) {
-          // add previous word to elements
-          if (word.length > 0) {
-            el.push({
-              el: false,
-              children: word,
-              newline: newline,
-              content: word.join(""),
-              type: 'word'
-            });
-          }
-
-          word = [];
-        } else {
-          word.push(char);
-        } // iteration
-
-
-        i++;
-      }); // add elements to words
-
-      if (this._prop.appendWords) {
-        el.forEach(function (word) {
-          word.el = dom({
-            selector: 'span',
-            styles: "".concat(_this3._prefix, "__word")
-          });
-          word.el.classList.add();
-
-          if (!_this3._prop.appendLetters) {
-            word.el.innerHTML = word.content;
-          }
-        });
-      } // add to stack
-
-
-      this._el.words = el;
-    }
-    /**
-     * @description Append words to the outer element.
-     * @protected
-     */
-
-  }, {
-    key: "_wordsAppend",
-    value: function _wordsAppend() {
-      var _this4 = this;
-
-      if (this._prop.appendWords) {
-        this._el.words.forEach(function (obj) {
-          _this4._outer.appendChild(obj.el);
-        });
-      }
-    }
-    /**
-     * @description Split text into letters.
-     * @protected
-     */
-
-  }, {
-    key: "_lettersSplit",
-    value: function _lettersSplit() {
-      var _this5 = this;
-
-      // get words
-      var words = this._el.words; // in each word point out a letter
-
-      words.forEach(function (word) {
-        // get chars
-        var chars = word.children; // create letters
-
-        var letters = [],
-            i = 0;
-        chars.forEach(function (char) {
-          // last element
-          var last = i == chars.length - 1; // create object
-
-          var letter = {
-            el: false,
-            content: char,
-            whitespace: last,
-            newline: !!(last && word.newline),
-            type: 'letter'
-          }; // create element
-
-          if (_this5._prop.appendLetters) {
-            letter.el = dom({
-              selector: 'span',
-              styles: "".concat(_this5._prefix, "__letter")
-            });
-            letter.el.innerHTML = char;
-          } // add to stack
-
-
-          letters.push(letter);
-
-          _this5._el.letters.push(letter); // iteration
-
-
-          i++;
-        }); // change letters in words
-
-        word.children = letters;
-      });
-    }
-    /**
-     * @description Append letters to the outer element.
-     * @protected
-     */
-
-  }, {
-    key: "_lettersAppend",
-    value: function _lettersAppend() {
-      var _this6 = this;
-
-      if (this._prop.appendLetters) {
-        if (!this._prop.appendWords) {
-          // if words are disabled, append to outer
-          if (!this._prop.appendWords) {
-            this._el.letters.forEach(function (obj) {
-              // append letters
-              _this6._outer.appendChild(obj.el);
-            });
-          }
-        } // append letters to words
-        else {
-            this._el.words.forEach(function (word) {
-              word.children.forEach(function (letter) {
-                word.el.appendChild(letter.el);
-              });
-            });
-          }
-      }
-    }
-    /**
-     * @description Append spaces between words & letters.
-     * @protected
-     */
-
-  }, {
-    key: "_appendSpaces",
-    value: function _appendSpaces() {
-      var prop = this._prop,
-          el = this._el;
-
-      if (prop.appendWords) {
-        this._appendSpacesType(el.words);
-      } else if (prop.appendLetters) {
-        this._appendSpacesType(el.letters);
-      }
-    }
-    /**
-     * @description Append spaces between elements.
-     * @param {Array<Vevet.TextSplitModule.Letter>|Array<Vevet.TextSplitModule.Word>} el
-     * @protected
-     */
-
-  }, {
-    key: "_appendSpacesType",
-    value: function _appendSpacesType(el) {
-      el.forEach(function (obj) {
-        // append whitespace
-        var whitespace = false;
-
-        if (obj.type == 'word') {
-          whitespace = true;
-        } else {
-          if (obj.whitespace) {
-            whitespace = true;
-          }
-        }
-
-        if (whitespace) {
-          whitespace = document.createTextNode("\x20");
-          (0, _domInsertAfter.default)(whitespace, obj.el);
-        } // append br
-
-
-        if (obj.newline) {
-          var br = dom({
-            selector: 'br'
-          });
-          (0, _domInsertAfter.default)(br, obj.el);
-        }
-      });
-    }
-    /**
-     * @description Remove new lines (br tags).
-     * @protected
-     */
-
-  }, {
-    key: "_removeBr",
-    value: function _removeBr() {
-      var br = this._outer.querySelectorAll("br");
-
-      br.forEach(function (el) {
-        el.remove();
-      });
-    }
-    /**
-     * @description Split text into lines.
-     * @protected
-     */
-
-  }, {
-    key: "_linesSplit",
-    value: function _linesSplit() {
-      var _this7 = this;
-
-      var prop = this._prop; // get elements
-
-      var el = [];
-
-      if (prop.appendWords) {
-        el = this._el.words;
-      } else {
-        if (prop.appendLetters) {
-          el = this._el.letters;
-        }
-      } // vars
-
-
-      var lines = [],
-          line = [],
-          offsetPrev = 0,
-          newline = false; // go thru all elements and split them into lines
-
-      for (var i = 0; i < el.length; i++) {
-        // vars
-        var obj = el[i]; // compare offsets
-
-        var offset = obj.el.offsetTop;
-
-        if (offset !== offsetPrev) {
-          newline = true;
-        } else {
-          newline = false;
-        }
-
-        offsetPrev = offset; // add new line to stack
-
-        if (newline & line.length > 0) {
-          lines.push(line);
-          line = [];
-        } // add to line
-
-
-        line.push(obj);
-      } // add last line
-
-
-      lines.push(line); // create an array of lines
-
-      var l = this._el.lines; // add lines to the array
-
-      lines.forEach(function (line) {
-        var obj = {
-          el: false,
-          children: line,
-          content: '',
-          type: 'line'
-        }; // add content
-
-        line.forEach(function (child) {
-          obj.content += child.content;
-
-          if (child.type == 'word' || child.whitespace) {
-            obj.content += ' ';
-          }
-        }); // create element
-
-        if (prop.appendLines) {
-          obj.el = dom({
-            selector: 'span',
-            styles: "".concat(_this7._prefix, "__line")
-          });
-        } // add to lines
-
-
-        l.push(obj);
-      });
-    }
-    /**
-     * @description Append lines to the outer element.
-     * @protected
-     */
-
-  }, {
-    key: "_linesAppend",
-    value: function _linesAppend() {
-      var _this8 = this;
-
-      // append lines
-      if (this._prop.appendLines) {
-        this._el.lines.forEach(function (line) {
-          // append line
-          _this8._outer.appendChild(line.el); // appnd children
-
-
-          line.children.forEach(function (child) {
-            line.el.appendChild(child.el);
-          });
-        });
-      }
-    }
-    /**
-     * @description Remove lines from the outer element.
-     * @protected
-     */
-
-  }, {
-    key: "_linesRemove",
-    value: function _linesRemove() {
-      var prop = this._prop,
-          el = this._el,
-          outer = this._outer;
-
-      if (prop.appendLines) {
-        // move words
-        if (prop.appendWords) {
-          el.words.forEach(function (obj) {
-            outer.appendChild(obj.el);
-          });
-        } else {
-          // move letters
-          if (prop.appendLetters) {
-            el.letters.forEach(function (obj) {
-              outer.appendChild(obj.el);
-            });
-          }
-        }
-      } // remove lines
-
-
-      el.lines.forEach(function (obj) {
-        if (obj.el) {
-          obj.el.remove();
-        }
-      });
-      el.lines = [];
-    }
-    /**
-     * @description Destroy the class.
-     */
-
-  }, {
-    key: "destroy",
-    value: function destroy() {
-      _get(_getPrototypeOf(TextSplitModule.prototype), "destroy", this).call(this);
-
-      this._outer.innerHTML = this._html;
-    }
-  }]);
-
-  return TextSplitModule;
-}(_Module2.default);
-
-exports.default = TextSplitModule;