JAVASCRIPT   158

wow.js

Guest on 6th August 2021 06:47:38 PM

  1. (function() {
  2.   var MutationObserver, Util, WeakMap, getComputedStyle, getComputedStyleRX,
  3.     __bind = function(fn, me){ return function(){ return fn.apply(me, arguments); }; },
  4.     __indexOf = [].indexOf || function(item) { for (var i = 0, l = this.length; i < l; i++) { if (i in this && this[i] === item) return i; } return -1; };
  5.  
  6.   Util = (function() {
  7.     function Util() {}
  8.  
  9.     Util.prototype.extend = function(custom, defaults) {
  10.       var key, value;
  11.       for (key in defaults) {
  12.         value = defaults[key];
  13.         if (custom[key] == null) {
  14.           custom[key] = value;
  15.         }
  16.       }
  17.       return custom;
  18.     };
  19.  
  20.     Util.prototype.isMobile = function(agent) {
  21.       return /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(agent);
  22.     };
  23.  
  24.     Util.prototype.addEvent = function(elem, event, fn) {
  25.       if (elem.addEventListener != null) {
  26.         return elem.addEventListener(event, fn, false);
  27.       } else if (elem.attachEvent != null) {
  28.         return elem.attachEvent("on" + event, fn);
  29.       } else {
  30.         return elem[event] = fn;
  31.       }
  32.     };
  33.  
  34.     Util.prototype.removeEvent = function(elem, event, fn) {
  35.       if (elem.removeEventListener != null) {
  36.         return elem.removeEventListener(event, fn, false);
  37.       } else if (elem.detachEvent != null) {
  38.         return elem.detachEvent("on" + event, fn);
  39.       } else {
  40.         return delete elem[event];
  41.       }
  42.     };
  43.  
  44.     Util.prototype.innerHeight = function() {
  45.       if ('innerHeight' in window) {
  46.         return window.innerHeight;
  47.       } else {
  48.         return document.documentElement.clientHeight;
  49.       }
  50.     };
  51.  
  52.     return Util;
  53.  
  54.   })();
  55.  
  56.   WeakMap = this.WeakMap || this.MozWeakMap || (WeakMap = (function() {
  57.     function WeakMap() {
  58.       this.keys = [];
  59.       this.values = [];
  60.     }
  61.  
  62.     WeakMap.prototype.get = function(key) {
  63.       var i, item, _i, _len, _ref;
  64.       _ref = this.keys;
  65.       for (i = _i = 0, _len = _ref.length; _i < _len; i = ++_i) {
  66.         item = _ref[i];
  67.         if (item === key) {
  68.           return this.values[i];
  69.         }
  70.       }
  71.     };
  72.  
  73.     WeakMap.prototype.set = function(key, value) {
  74.       var i, item, _i, _len, _ref;
  75.       _ref = this.keys;
  76.       for (i = _i = 0, _len = _ref.length; _i < _len; i = ++_i) {
  77.         item = _ref[i];
  78.         if (item === key) {
  79.           this.values[i] = value;
  80.           return;
  81.         }
  82.       }
  83.       this.keys.push(key);
  84.       return this.values.push(value);
  85.     };
  86.  
  87.     return WeakMap;
  88.  
  89.   })());
  90.  
  91.   MutationObserver = this.MutationObserver || this.WebkitMutationObserver || this.MozMutationObserver || (MutationObserver = (function() {
  92.     function MutationObserver() {
  93.       if (typeof console !== "undefined" && console !== null) {
  94.         console.warn('MutationObserver is not supported by your browser.');
  95.       }
  96.       if (typeof console !== "undefined" && console !== null) {
  97.         console.warn('WOW.js cannot detect dom mutations, please call .sync() after loading new content.');
  98.       }
  99.     }
  100.  
  101.     MutationObserver.notSupported = true;
  102.  
  103.     MutationObserver.prototype.observe = function() {};
  104.  
  105.     return MutationObserver;
  106.  
  107.   })());
  108.  
  109.   getComputedStyle = this.getComputedStyle || function(el, pseudo) {
  110.     this.getPropertyValue = function(prop) {
  111.       var _ref;
  112.       if (prop === 'float') {
  113.         prop = 'styleFloat';
  114.       }
  115.       if (getComputedStyleRX.test(prop)) {
  116.         prop.replace(getComputedStyleRX, function(_, _char) {
  117.           return _char.toUpperCase();
  118.         });
  119.       }
  120.       return ((_ref = el.currentStyle) != null ? _ref[prop] : void 0) || null;
  121.     };
  122.     return this;
  123.   };
  124.  
  125.   getComputedStyleRX = /(\-([a-z]){1})/g;
  126.  
  127.   this.WOW = (function() {
  128.     WOW.prototype.defaults = {
  129.       boxClass: 'wow',
  130.       animateClass: 'animated',
  131.       offset: 0,
  132.       mobile: true,
  133.       live: true,
  134.       callback: null
  135.     };
  136.  
  137.     function WOW(options) {
  138.       if (options == null) {
  139.         options = {};
  140.       }
  141.       this.scrollCallback = __bind(this.scrollCallback, this);
  142.       this.scrollHandler = __bind(this.scrollHandler, this);
  143.       this.start = __bind(this.start, this);
  144.       this.scrolled = true;
  145.       this.config = this.util().extend(options, this.defaults);
  146.       this.animationNameCache = new WeakMap();
  147.     }
  148.  
  149.     WOW.prototype.init = function() {
  150.       var _ref;
  151.       this.element = window.document.documentElement;
  152.       if ((_ref = document.readyState) === "interactive" || _ref === "complete") {
  153.         this.start();
  154.       } else {
  155.         this.util().addEvent(document, 'DOMContentLoaded', this.start);
  156.       }
  157.       return this.finished = [];
  158.     };
  159.  
  160.     WOW.prototype.start = function() {
  161.       var box, _i, _len, _ref;
  162.       this.stopped = false;
  163.       this.boxes = (function() {
  164.         var _i, _len, _ref, _results;
  165.         _ref = this.element.querySelectorAll("." + this.config.boxClass);
  166.         _results = [];
  167.         for (_i = 0, _len = _ref.length; _i < _len; _i++) {
  168.           box = _ref[_i];
  169.           _results.push(box);
  170.         }
  171.         return _results;
  172.       }).call(this);
  173.       this.all = (function() {
  174.         var _i, _len, _ref, _results;
  175.         _ref = this.boxes;
  176.         _results = [];
  177.         for (_i = 0, _len = _ref.length; _i < _len; _i++) {
  178.           box = _ref[_i];
  179.           _results.push(box);
  180.         }
  181.         return _results;
  182.       }).call(this);
  183.       if (this.boxes.length) {
  184.         if (this.disabled()) {
  185.           this.resetStyle();
  186.         } else {
  187.           _ref = this.boxes;
  188.           for (_i = 0, _len = _ref.length; _i < _len; _i++) {
  189.             box = _ref[_i];
  190.             this.applyStyle(box, true);
  191.           }
  192.         }
  193.       }
  194.       if (!this.disabled()) {
  195.         this.util().addEvent(window, 'scroll', this.scrollHandler);
  196.         this.util().addEvent(window, 'resize', this.scrollHandler);
  197.         this.interval = setInterval(this.scrollCallback, 50);
  198.       }
  199.       if (this.config.live) {
  200.         return new MutationObserver((function(_this) {
  201.           return function(records) {
  202.             var node, record, _j, _len1, _results;
  203.             _results = [];
  204.             for (_j = 0, _len1 = records.length; _j < _len1; _j++) {
  205.               record = records[_j];
  206.               _results.push((function() {
  207.                 var _k, _len2, _ref1, _results1;
  208.                 _ref1 = record.addedNodes || [];
  209.                 _results1 = [];
  210.                 for (_k = 0, _len2 = _ref1.length; _k < _len2; _k++) {
  211.                   node = _ref1[_k];
  212.                   _results1.push(this.doSync(node));
  213.                 }
  214.                 return _results1;
  215.               }).call(_this));
  216.             }
  217.             return _results;
  218.           };
  219.         })(this)).observe(document.body, {
  220.           childList: true,
  221.           subtree: true
  222.         });
  223.       }
  224.     };
  225.  
  226.     WOW.prototype.stop = function() {
  227.       this.stopped = true;
  228.       this.util().removeEvent(window, 'scroll', this.scrollHandler);
  229.       this.util().removeEvent(window, 'resize', this.scrollHandler);
  230.       if (this.interval != null) {
  231.         return clearInterval(this.interval);
  232.       }
  233.     };
  234.  
  235.     WOW.prototype.sync = function(element) {
  236.       if (MutationObserver.notSupported) {
  237.         return this.doSync(this.element);
  238.       }
  239.     };
  240.  
  241.     WOW.prototype.doSync = function(element) {
  242.       var box, _i, _len, _ref, _results;
  243.       if (element == null) {
  244.         element = this.element;
  245.       }
  246.       if (element.nodeType !== 1) {
  247.         return;
  248.       }
  249.       element = element.parentNode || element;
  250.       _ref = element.querySelectorAll("." + this.config.boxClass);
  251.       _results = [];
  252.       for (_i = 0, _len = _ref.length; _i < _len; _i++) {
  253.         box = _ref[_i];
  254.         if (__indexOf.call(this.all, box) < 0) {
  255.           this.boxes.push(box);
  256.           this.all.push(box);
  257.           if (this.stopped || this.disabled()) {
  258.             this.resetStyle();
  259.           } else {
  260.             this.applyStyle(box, true);
  261.           }
  262.           _results.push(this.scrolled = true);
  263.         } else {
  264.           _results.push(void 0);
  265.         }
  266.       }
  267.       return _results;
  268.     };
  269.  
  270.     WOW.prototype.show = function(box) {
  271.       this.applyStyle(box);
  272.       box.className = "" + box.className + " " + this.config.animateClass;
  273.       if (this.config.callback != null) {
  274.         return this.config.callback(box);
  275.       }
  276.     };
  277.  
  278.     WOW.prototype.applyStyle = function(box, hidden) {
  279.       var delay, duration, iteration;
  280.       duration = box.getAttribute('data-wow-duration');
  281.       delay = box.getAttribute('data-wow-delay');
  282.       iteration = box.getAttribute('data-wow-iteration');
  283.       return this.animate((function(_this) {
  284.         return function() {
  285.           return _this.customStyle(box, hidden, duration, delay, iteration);
  286.         };
  287.       })(this));
  288.     };
  289.  
  290.     WOW.prototype.animate = (function() {
  291.       if ('requestAnimationFrame' in window) {
  292.         return function(callback) {
  293.           return window.requestAnimationFrame(callback);
  294.         };
  295.       } else {
  296.         return function(callback) {
  297.           return callback();
  298.         };
  299.       }
  300.     })();
  301.  
  302.     WOW.prototype.resetStyle = function() {
  303.       var box, _i, _len, _ref, _results;
  304.       _ref = this.boxes;
  305.       _results = [];
  306.       for (_i = 0, _len = _ref.length; _i < _len; _i++) {
  307.         box = _ref[_i];
  308.         _results.push(box.style.visibility = 'visible');
  309.       }
  310.       return _results;
  311.     };
  312.  
  313.     WOW.prototype.customStyle = function(box, hidden, duration, delay, iteration) {
  314.       if (hidden) {
  315.         this.cacheAnimationName(box);
  316.       }
  317.       box.style.visibility = hidden ? 'hidden' : 'visible';
  318.       if (duration) {
  319.         this.vendorSet(box.style, {
  320.           animationDuration: duration
  321.         });
  322.       }
  323.       if (delay) {
  324.         this.vendorSet(box.style, {
  325.           animationDelay: delay
  326.         });
  327.       }
  328.       if (iteration) {
  329.         this.vendorSet(box.style, {
  330.           animationIterationCount: iteration
  331.         });
  332.       }
  333.       this.vendorSet(box.style, {
  334.         animationName: hidden ? 'none' : this.cachedAnimationName(box)
  335.       });
  336.       return box;
  337.     };
  338.  
  339.     WOW.prototype.vendors = ["moz", "webkit"];
  340.  
  341.     WOW.prototype.vendorSet = function(elem, properties) {
  342.       var name, value, vendor, _results;
  343.       _results = [];
  344.       for (name in properties) {
  345.         value = properties[name];
  346.         elem["" + name] = value;
  347.         _results.push((function() {
  348.           var _i, _len, _ref, _results1;
  349.           _ref = this.vendors;
  350.           _results1 = [];
  351.           for (_i = 0, _len = _ref.length; _i < _len; _i++) {
  352.             vendor = _ref[_i];
  353.             _results1.push(elem["" + vendor + (name.charAt(0).toUpperCase()) + (name.substr(1))] = value);
  354.           }
  355.           return _results1;
  356.         }).call(this));
  357.       }
  358.       return _results;
  359.     };
  360.  
  361.     WOW.prototype.vendorCSS = function(elem, property) {
  362.       var result, style, vendor, _i, _len, _ref;
  363.       style = getComputedStyle(elem);
  364.       result = style.getPropertyCSSValue(property);
  365.       _ref = this.vendors;
  366.       for (_i = 0, _len = _ref.length; _i < _len; _i++) {
  367.         vendor = _ref[_i];
  368.         result = result || style.getPropertyCSSValue("-" + vendor + "-" + property);
  369.       }
  370.       return result;
  371.     };
  372.  
  373.     WOW.prototype.animationName = function(box) {
  374.       var animationName;
  375.       try {
  376.         animationName = this.vendorCSS(box, 'animation-name').cssText;
  377.       } catch (_error) {
  378.         animationName = getComputedStyle(box).getPropertyValue('animation-name');
  379.       }
  380.       if (animationName === 'none') {
  381.         return '';
  382.       } else {
  383.         return animationName;
  384.       }
  385.     };
  386.  
  387.     WOW.prototype.cacheAnimationName = function(box) {
  388.       return this.animationNameCache.set(box, this.animationName(box));
  389.     };
  390.  
  391.     WOW.prototype.cachedAnimationName = function(box) {
  392.       return this.animationNameCache.get(box);
  393.     };
  394.  
  395.     WOW.prototype.scrollHandler = function() {
  396.       return this.scrolled = true;
  397.     };
  398.  
  399.     WOW.prototype.scrollCallback = function() {
  400.       var box;
  401.       if (this.scrolled) {
  402.         this.scrolled = false;
  403.         this.boxes = (function() {
  404.           var _i, _len, _ref, _results;
  405.           _ref = this.boxes;
  406.           _results = [];
  407.           for (_i = 0, _len = _ref.length; _i < _len; _i++) {
  408.             box = _ref[_i];
  409.             if (!(box)) {
  410.               continue;
  411.             }
  412.             if (this.isVisible(box)) {
  413.               this.show(box);
  414.               continue;
  415.             }
  416.             _results.push(box);
  417.           }
  418.           return _results;
  419.         }).call(this);
  420.         if (!(this.boxes.length || this.config.live)) {
  421.           return this.stop();
  422.         }
  423.       }
  424.     };
  425.  
  426.     WOW.prototype.offsetTop = function(element) {
  427.       var top;
  428.       while (element.offsetTop === void 0) {
  429.         element = element.parentNode;
  430.       }
  431.       top = element.offsetTop;
  432.       while (element = element.offsetParent) {
  433.         top += element.offsetTop;
  434.       }
  435.       return top;
  436.     };
  437.  
  438.     WOW.prototype.isVisible = function(box) {
  439.       var bottom, offset, top, viewBottom, viewTop;
  440.       offset = box.getAttribute('data-wow-offset') || this.config.offset;
  441.       viewTop = window.pageYOffset;
  442.       viewBottom = viewTop + Math.min(this.element.clientHeight, this.util().innerHeight()) - offset;
  443.       top = this.offsetTop(box);
  444.       bottom = top + box.clientHeight;
  445.       return top <= viewBottom && bottom >= viewTop;
  446.     };
  447.  
  448.     WOW.prototype.util = function() {
  449.       return this._util != null ? this._util : this._util = new Util();
  450.     };
  451.  
  452.     WOW.prototype.disabled = function() {
  453.       return !this.config.mobile && this.util().isMobile(navigator.userAgent);
  454.     };
  455.  
  456.     return WOW;
  457.  
  458.   })();
  459.  
  460. }).call(this);

Raw Paste


Login or Register to edit or fork this paste. It's free.