mirror of
				https://github.com/dawidolko/Website-Templates.git
				synced 2025-10-27 16:03:10 +01:00 
			
		
		
		
	
		
			
				
	
	
		
			307 lines
		
	
	
		
			8.5 KiB
		
	
	
	
		
			JavaScript
		
	
	
	
	
	
			
		
		
	
	
			307 lines
		
	
	
		
			8.5 KiB
		
	
	
	
		
			JavaScript
		
	
	
	
	
	
| (function() {
 | |
|   var Util, WeakMap,
 | |
|     __bind = function(fn, me){ return function(){ return fn.apply(me, arguments); }; };
 | |
| 
 | |
|   Util = (function() {
 | |
|     function Util() {}
 | |
| 
 | |
|     Util.prototype.extend = function(custom, defaults) {
 | |
|       var key, value;
 | |
|       for (key in custom) {
 | |
|         value = custom[key];
 | |
|         if (value != null) {
 | |
|           defaults[key] = value;
 | |
|         }
 | |
|       }
 | |
|       return defaults;
 | |
|     };
 | |
| 
 | |
|     Util.prototype.isMobile = function(agent) {
 | |
|       return /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(agent);
 | |
|     };
 | |
| 
 | |
|     return Util;
 | |
| 
 | |
|   })();
 | |
| 
 | |
|   WeakMap = this.WeakMap || (WeakMap = (function() {
 | |
|     function WeakMap() {
 | |
|       this.keys = [];
 | |
|       this.values = [];
 | |
|     }
 | |
| 
 | |
|     WeakMap.prototype.get = function(key) {
 | |
|       var i, item, _i, _len, _ref;
 | |
|       _ref = this.keys;
 | |
|       for (i = _i = 0, _len = _ref.length; _i < _len; i = ++_i) {
 | |
|         item = _ref[i];
 | |
|         if (item === key) {
 | |
|           return this.values[i];
 | |
|         }
 | |
|       }
 | |
|     };
 | |
| 
 | |
|     WeakMap.prototype.set = function(key, value) {
 | |
|       var i, item, _i, _len, _ref;
 | |
|       _ref = this.keys;
 | |
|       for (i = _i = 0, _len = _ref.length; _i < _len; i = ++_i) {
 | |
|         item = _ref[i];
 | |
|         if (item === key) {
 | |
|           this.values[i] = value;
 | |
|           return;
 | |
|         }
 | |
|       }
 | |
|       this.keys.push(key);
 | |
|       return this.values.push(value);
 | |
|     };
 | |
| 
 | |
|     return WeakMap;
 | |
| 
 | |
|   })());
 | |
| 
 | |
|   this.WOW = (function() {
 | |
|     WOW.prototype.defaults = {
 | |
|       boxClass: 'wow',
 | |
|       animateClass: 'animated',
 | |
|       offset: 0,
 | |
|       mobile: true
 | |
|     };
 | |
| 
 | |
|     function WOW(options) {
 | |
|       if (options == null) {
 | |
|         options = {};
 | |
|       }
 | |
|       this.scrollCallback = __bind(this.scrollCallback, this);
 | |
|       this.scrollHandler = __bind(this.scrollHandler, this);
 | |
|       this.start = __bind(this.start, this);
 | |
|       this.scrolled = true;
 | |
|       this.config = this.util().extend(options, this.defaults);
 | |
|       this.animationNameCache = new WeakMap();
 | |
|     }
 | |
| 
 | |
|     WOW.prototype.init = function() {
 | |
|       var _ref;
 | |
|       this.element = window.document.documentElement;
 | |
|       if ((_ref = document.readyState) === "interactive" || _ref === "complete") {
 | |
|         return this.start();
 | |
|       } else {
 | |
|         return document.addEventListener('DOMContentLoaded', this.start);
 | |
|       }
 | |
|     };
 | |
| 
 | |
|     WOW.prototype.start = function() {
 | |
|       var box, _i, _len, _ref;
 | |
|       this.boxes = this.element.getElementsByClassName(this.config.boxClass);
 | |
|       if (this.boxes.length) {
 | |
|         if (this.disabled()) {
 | |
|           return this.resetStyle();
 | |
|         } else {
 | |
|           _ref = this.boxes;
 | |
|           for (_i = 0, _len = _ref.length; _i < _len; _i++) {
 | |
|             box = _ref[_i];
 | |
|             this.applyStyle(box, true);
 | |
|           }
 | |
|           window.addEventListener('scroll', this.scrollHandler, false);
 | |
|           window.addEventListener('resize', this.scrollHandler, false);
 | |
|           return this.interval = setInterval(this.scrollCallback, 50);
 | |
|         }
 | |
|       }
 | |
|     };
 | |
| 
 | |
|     WOW.prototype.stop = function() {
 | |
|       window.removeEventListener('scroll', this.scrollHandler, false);
 | |
|       window.removeEventListener('resize', this.scrollHandler, false);
 | |
|       if (this.interval != null) {
 | |
|         return clearInterval(this.interval);
 | |
|       }
 | |
|     };
 | |
| 
 | |
|     WOW.prototype.show = function(box) {
 | |
|       this.applyStyle(box);
 | |
|       return box.className = "" + box.className + " " + this.config.animateClass;
 | |
|     };
 | |
| 
 | |
|     WOW.prototype.applyStyle = function(box, hidden) {
 | |
|       var delay, duration, iteration;
 | |
|       duration = box.getAttribute('data-wow-duration');
 | |
|       delay = box.getAttribute('data-wow-delay');
 | |
|       iteration = box.getAttribute('data-wow-iteration');
 | |
|       return this.animate((function(_this) {
 | |
|         return function() {
 | |
|           return _this.customStyle(box, hidden, duration, delay, iteration);
 | |
|         };
 | |
|       })(this));
 | |
|     };
 | |
| 
 | |
|     WOW.prototype.animate = (function() {
 | |
|       if ('requestAnimationFrame' in window) {
 | |
|         return function(callback) {
 | |
|           return window.requestAnimationFrame(callback);
 | |
|         };
 | |
|       } else {
 | |
|         return function(callback) {
 | |
|           return callback();
 | |
|         };
 | |
|       }
 | |
|     })();
 | |
| 
 | |
|     WOW.prototype.resetStyle = function() {
 | |
|       var box, _i, _len, _ref, _results;
 | |
|       _ref = this.boxes;
 | |
|       _results = [];
 | |
|       for (_i = 0, _len = _ref.length; _i < _len; _i++) {
 | |
|         box = _ref[_i];
 | |
|         _results.push(box.setAttribute('style', 'visibility: visible;'));
 | |
|       }
 | |
|       return _results;
 | |
|     };
 | |
| 
 | |
|     WOW.prototype.customStyle = function(box, hidden, duration, delay, iteration) {
 | |
|       if (hidden) {
 | |
|         this.cacheAnimationName(box);
 | |
|       }
 | |
|       box.style.visibility = hidden ? 'hidden' : 'visible';
 | |
|       if (duration) {
 | |
|         this.vendorSet(box.style, {
 | |
|           animationDuration: duration
 | |
|         });
 | |
|       }
 | |
|       if (delay) {
 | |
|         this.vendorSet(box.style, {
 | |
|           animationDelay: delay
 | |
|         });
 | |
|       }
 | |
|       if (iteration) {
 | |
|         this.vendorSet(box.style, {
 | |
|           animationIterationCount: iteration
 | |
|         });
 | |
|       }
 | |
|       this.vendorSet(box.style, {
 | |
|         animationName: hidden ? 'none' : this.cachedAnimationName(box)
 | |
|       });
 | |
|       return box;
 | |
|     };
 | |
| 
 | |
|     WOW.prototype.vendors = ["moz", "webkit"];
 | |
| 
 | |
|     WOW.prototype.vendorSet = function(elem, properties) {
 | |
|       var name, value, vendor, _results;
 | |
|       _results = [];
 | |
|       for (name in properties) {
 | |
|         value = properties[name];
 | |
|         elem["" + name] = value;
 | |
|         _results.push((function() {
 | |
|           var _i, _len, _ref, _results1;
 | |
|           _ref = this.vendors;
 | |
|           _results1 = [];
 | |
|           for (_i = 0, _len = _ref.length; _i < _len; _i++) {
 | |
|             vendor = _ref[_i];
 | |
|             _results1.push(elem["" + vendor + (name.charAt(0).toUpperCase()) + (name.substr(1))] = value);
 | |
|           }
 | |
|           return _results1;
 | |
|         }).call(this));
 | |
|       }
 | |
|       return _results;
 | |
|     };
 | |
| 
 | |
|     WOW.prototype.vendorCSS = function(elem, property) {
 | |
|       var result, style, vendor, _i, _len, _ref;
 | |
|       style = window.getComputedStyle(elem);
 | |
|       result = style.getPropertyCSSValue(property);
 | |
|       _ref = this.vendors;
 | |
|       for (_i = 0, _len = _ref.length; _i < _len; _i++) {
 | |
|         vendor = _ref[_i];
 | |
|         result = result || style.getPropertyCSSValue("-" + vendor + "-" + property);
 | |
|       }
 | |
|       return result;
 | |
|     };
 | |
| 
 | |
|     WOW.prototype.animationName = function(box) {
 | |
|       var animationName;
 | |
|       try {
 | |
|         animationName = this.vendorCSS(box, 'animation-name').cssText;
 | |
|       } catch (_error) {
 | |
|         animationName = window.getComputedStyle(box).getPropertyValue('animation-name');
 | |
|       }
 | |
|       if (animationName === 'none') {
 | |
|         return '';
 | |
|       } else {
 | |
|         return animationName;
 | |
|       }
 | |
|     };
 | |
| 
 | |
|     WOW.prototype.cacheAnimationName = function(box) {
 | |
|       return this.animationNameCache.set(box, this.animationName(box));
 | |
|     };
 | |
| 
 | |
|     WOW.prototype.cachedAnimationName = function(box) {
 | |
|       return this.animationNameCache.get(box);
 | |
|     };
 | |
| 
 | |
|     WOW.prototype.scrollHandler = function() {
 | |
|       return this.scrolled = true;
 | |
|     };
 | |
| 
 | |
|     WOW.prototype.scrollCallback = function() {
 | |
|       var box;
 | |
|       if (this.scrolled) {
 | |
|         this.scrolled = false;
 | |
|         this.boxes = (function() {
 | |
|           var _i, _len, _ref, _results;
 | |
|           _ref = this.boxes;
 | |
|           _results = [];
 | |
|           for (_i = 0, _len = _ref.length; _i < _len; _i++) {
 | |
|             box = _ref[_i];
 | |
|             if (!(box)) {
 | |
|               continue;
 | |
|             }
 | |
|             if (this.isVisible(box)) {
 | |
|               this.show(box);
 | |
|               continue;
 | |
|             }
 | |
|             _results.push(box);
 | |
|           }
 | |
|           return _results;
 | |
|         }).call(this);
 | |
|         if (!this.boxes.length) {
 | |
|           return this.stop();
 | |
|         }
 | |
|       }
 | |
|     };
 | |
| 
 | |
|     WOW.prototype.offsetTop = function(element) {
 | |
|       var top;
 | |
|       while (element.offsetTop === void 0) {
 | |
|         element = element.parentNode;
 | |
|       }
 | |
|       top = element.offsetTop;
 | |
|       while (element = element.offsetParent) {
 | |
|         top += element.offsetTop;
 | |
|       }
 | |
|       return top;
 | |
|     };
 | |
| 
 | |
|     WOW.prototype.isVisible = function(box) {
 | |
|       var bottom, offset, top, viewBottom, viewTop;
 | |
|       offset = box.getAttribute('data-wow-offset') || this.config.offset;
 | |
|       viewTop = window.pageYOffset;
 | |
|       viewBottom = viewTop + this.element.clientHeight - offset;
 | |
|       top = this.offsetTop(box);
 | |
|       bottom = top + box.clientHeight;
 | |
|       return top <= viewBottom && bottom >= viewTop;
 | |
|     };
 | |
| 
 | |
|     WOW.prototype.util = function() {
 | |
|       return this._util || (this._util = new Util());
 | |
|     };
 | |
| 
 | |
|     WOW.prototype.disabled = function() {
 | |
|       return !this.config.mobile && this.util().isMobile(navigator.userAgent);
 | |
|     };
 | |
| 
 | |
|     return WOW;
 | |
| 
 | |
|   })();
 | |
| 
 | |
| }).call(this);
 |