/*! https://github.com/graingert/WOW/blob/master/LICENSE The MIT License (MIT) Copyright (c) 2016 Thomas Grainger. Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions: The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. Portions of this wow.js Software may utilize the following copyrighted material, the use of which is hereby acknowledged. WOW: https://github.com/matthieua/WOW/tree/20848c410fe32d161c2330e1d261b59512094f81 Copyright (C) 2014; Matthieu Aussaguel Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the “Software”), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions: The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. THE SOFTWARE IS PROVIDED “AS IS”, WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. */ (function (global, factory) { if (typeof define === "function" && define.amd) { define(['module', 'exports'], factory); } else if (typeof exports !== "undefined") { factory(module, exports); } else { var mod = { exports: {} }; factory(mod, mod.exports); global.WOW = mod.exports; } })(this, function (module, exports) { 'use strict'; Object.defineProperty(exports, "__esModule", { value: true }); var _class, _temp; function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } var _createClass = 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); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); function isIn(needle, haystack) { return haystack.indexOf(needle) >= 0; } function extend(custom, defaults) { for (var key in defaults) { if (custom[key] == null) { var value = defaults[key]; custom[key] = value; } } return custom; } function isMobile(agent) { return (/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(agent) ); } function createEvent(event) { var bubble = arguments.length <= 1 || arguments[1] === undefined ? false : arguments[1]; var cancel = arguments.length <= 2 || arguments[2] === undefined ? false : arguments[2]; var detail = arguments.length <= 3 || arguments[3] === undefined ? null : arguments[3]; var customEvent = void 0; if (document.createEvent != null) { // W3C DOM customEvent = document.createEvent('CustomEvent'); customEvent.initCustomEvent(event, bubble, cancel, detail); } else if (document.createEventObject != null) { // IE DOM < 9 customEvent = document.createEventObject(); customEvent.eventType = event; } else { customEvent.eventName = event; } return customEvent; } function emitEvent(elem, event) { if (elem.dispatchEvent != null) { // W3C DOM elem.dispatchEvent(event); } else if (event in (elem != null)) { elem[event](); } else if ('on' + event in (elem != null)) { elem['on' + event](); } } function addEvent(elem, event, fn) { if (elem.addEventListener != null) { // W3C DOM elem.addEventListener(event, fn, false); } else if (elem.attachEvent != null) { // IE DOM elem.attachEvent('on' + event, fn); } else { // fallback elem[event] = fn; } } function removeEvent(elem, event, fn) { if (elem.removeEventListener != null) { // W3C DOM elem.removeEventListener(event, fn, false); } else if (elem.detachEvent != null) { // IE DOM elem.detachEvent('on' + event, fn); } else { // fallback delete elem[event]; } } function getInnerHeight() { if ('innerHeight' in window) { return window.innerHeight; } return document.documentElement.clientHeight; } // Minimalistic WeakMap shim, just in case. var WeakMap = window.WeakMap || window.MozWeakMap || function () { function WeakMap() { _classCallCheck(this, WeakMap); this.keys = []; this.values = []; } _createClass(WeakMap, [{ key: 'get', value: function get(key) { for (var i = 0; i < this.keys.length; i++) { var item = this.keys[i]; if (item === key) { return this.values[i]; } } return undefined; } }, { key: 'set', value: function set(key, value) { for (var i = 0; i < this.keys.length; i++) { var item = this.keys[i]; if (item === key) { this.values[i] = value; return this; } } this.keys.push(key); this.values.push(value); return this; } }]); return WeakMap; }(); // Dummy MutationObserver, to avoid raising exceptions. var MutationObserver = window.MutationObserver || window.WebkitMutationObserver || window.MozMutationObserver || (_temp = _class = function () { function MutationObserver() { _classCallCheck(this, MutationObserver); if (typeof console !== 'undefined' && console !== null) { console.warn('MutationObserver is not supported by your browser.'); console.warn('WOW.js cannot detect dom mutations, please call .sync() after loading new content.'); } } _createClass(MutationObserver, [{ key: 'observe', value: function observe() {} }]); return MutationObserver; }(), _class.notSupported = true, _temp); // getComputedStyle shim, from http://stackoverflow.com/a/21797294 var getComputedStyle = window.getComputedStyle || function getComputedStyle(el) { var getComputedStyleRX = /(\-([a-z]){1})/g; return { getPropertyValue: function getPropertyValue(prop) { if (prop === 'float') { prop = 'styleFloat'; } if (getComputedStyleRX.test(prop)) { prop.replace(getComputedStyleRX, function (_, _char) { return _char.toUpperCase(); }); } var currentStyle = el.currentStyle; return (currentStyle != null ? currentStyle[prop] : void 0) || null; } }; }; var WOW = function () { function WOW() { var options = arguments.length <= 0 || arguments[0] === undefined ? {} : arguments[0]; _classCallCheck(this, WOW); this.defaults = { boxClass: 'wow', animateClass: 'animated', offset: 0, mobile: true, live: true, callback: null, scrollContainer: null, resetAnimation: true }; this.animate = function animateFactory() { if ('requestAnimationFrame' in window) { return function (callback) { return window.requestAnimationFrame(callback); }; } return function (callback) { return callback(); }; }(); this.vendors = ['moz', 'webkit']; this.start = this.start.bind(this); this.resetAnimation = this.resetAnimation.bind(this); this.scrollHandler = this.scrollHandler.bind(this); this.scrollCallback = this.scrollCallback.bind(this); this.scrolled = true; this.config = extend(options, this.defaults); if (options.scrollContainer != null) { this.config.scrollContainer = document.querySelector(options.scrollContainer); } // Map of elements to animation names: this.animationNameCache = new WeakMap(); this.wowEvent = createEvent(this.config.boxClass); } _createClass(WOW, [{ key: 'init', value: function init() { this.element = window.document.documentElement; if (isIn(document.readyState, ['interactive', 'complete'])) { this.start(); } else { addEvent(document, 'DOMContentLoaded', this.start); } this.finished = []; } }, { key: 'start', value: function start() { var _this = this; this.stopped = false; this.boxes = [].slice.call(this.element.querySelectorAll('.' + this.config.boxClass)); this.all = this.boxes.slice(0); if (this.boxes.length) { if (this.disabled()) { this.resetStyle(); } else { for (var i = 0; i < this.boxes.length; i++) { var box = this.boxes[i]; this.applyStyle(box, true); } } } if (!this.disabled()) { addEvent(this.config.scrollContainer || window, 'scroll', this.scrollHandler); addEvent(window, 'resize', this.scrollHandler); this.interval = setInterval(this.scrollCallback, 50); } if (this.config.live) { var mut = new MutationObserver(function (records) { for (var j = 0; j < records.length; j++) { var record = records[j]; for (var k = 0; k < record.addedNodes.length; k++) { var node = record.addedNodes[k]; _this.doSync(node); } } return undefined; }); mut.observe(document.body, { childList: true, subtree: true }); } } }, { key: 'stop', value: function stop() { this.stopped = true; removeEvent(this.config.scrollContainer || window, 'scroll', this.scrollHandler); removeEvent(window, 'resize', this.scrollHandler); if (this.interval != null) { clearInterval(this.interval); } } }, { key: 'sync', value: function sync() { if (MutationObserver.notSupported) { this.doSync(this.element); } } }, { key: 'doSync', value: function doSync(element) { if (typeof element === 'undefined' || element === null) { element = this.element; } if (element.nodeType !== 1) { return; } element = element.parentNode || element; var iterable = element.querySelectorAll('.' + this.config.boxClass); for (var i = 0; i < iterable.length; i++) { var box = iterable[i]; if (!isIn(box, this.all)) { this.boxes.push(box); this.all.push(box); if (this.stopped || this.disabled()) { this.resetStyle(); } else { this.applyStyle(box, true); } this.scrolled = true; } } } }, { key: 'show', value: function show(box) { this.applyStyle(box); box.className = box.className + ' ' + this.config.animateClass; if (this.config.callback != null) { this.config.callback(box); } emitEvent(box, this.wowEvent); if (this.config.resetAnimation) { addEvent(box, 'animationend', this.resetAnimation); addEvent(box, 'oanimationend', this.resetAnimation); addEvent(box, 'webkitAnimationEnd', this.resetAnimation); addEvent(box, 'MSAnimationEnd', this.resetAnimation); } return box; } }, { key: 'applyStyle', value: function applyStyle(box, hidden) { var _this2 = this; var duration = box.getAttribute('data-wow-duration'); var delay = box.getAttribute('data-wow-delay'); var iteration = box.getAttribute('data-wow-iteration'); return this.animate(function () { return _this2.customStyle(box, hidden, duration, delay, iteration); }); } }, { key: 'resetStyle', value: function resetStyle() { for (var i = 0; i < this.boxes.length; i++) { var box = this.boxes[i]; box.style.visibility = 'visible'; } return undefined; } }, { key: 'resetAnimation', value: function resetAnimation(event) { if (event.type.toLowerCase().indexOf('animationend') >= 0) { var target = event.target || event.srcElement; target.className = target.className.replace(this.config.animateClass, '').trim(); } } }, { key: 'customStyle', value: function customStyle(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; } }, { key: 'vendorSet', value: function vendorSet(elem, properties) { for (var name in properties) { if (properties.hasOwnProperty(name)) { var value = properties[name]; elem['' + name] = value; for (var i = 0; i < this.vendors.length; i++) { var vendor = this.vendors[i]; elem['' + vendor + name.charAt(0).toUpperCase() + name.substr(1)] = value; } } } } }, { key: 'vendorCSS', value: function vendorCSS(elem, property) { var style = getComputedStyle(elem); var result = style.getPropertyCSSValue(property); for (var i = 0; i < this.vendors.length; i++) { var vendor = this.vendors[i]; result = result || style.getPropertyCSSValue('-' + vendor + '-' + property); } return result; } }, { key: 'animationName', value: function animationName(box) { var aName = void 0; try { aName = this.vendorCSS(box, 'animation-name').cssText; } catch (error) { // Opera, fall back to plain property value aName = getComputedStyle(box).getPropertyValue('animation-name'); } if (aName === 'none') { return ''; // SVG/Firefox, unable to get animation name? } return aName; } }, { key: 'cacheAnimationName', value: function cacheAnimationName(box) { // https://bugzilla.mozilla.org/show_bug.cgi?id=921834 // box.dataset is not supported for SVG elements in Firefox return this.animationNameCache.set(box, this.animationName(box)); } }, { key: 'cachedAnimationName', value: function cachedAnimationName(box) { return this.animationNameCache.get(box); } }, { key: 'scrollHandler', value: function scrollHandler() { this.scrolled = true; } }, { key: 'scrollCallback', value: function scrollCallback() { if (this.scrolled) { this.scrolled = false; var results = []; for (var i = 0; i < this.boxes.length; i++) { var box = this.boxes[i]; if (box) { if (this.isVisible(box)) { this.show(box); continue; } results.push(box); } } this.boxes = results; if (!this.boxes.length && !this.config.live) { this.stop(); } } } }, { key: 'offsetTop', value: function offsetTop(element) { // SVG elements don't have an offsetTop in Firefox. // This will use their nearest parent that has an offsetTop. // Also, using ('offsetTop' of element) causes an exception in Firefox. while (element.offsetTop === undefined) { element = element.parentNode; } var top = element.offsetTop; while (element.offsetParent) { element = element.offsetParent; top += element.offsetTop; } return top; } }, { key: 'isVisible', value: function isVisible(box) { var offset = box.getAttribute('data-wow-offset') || this.config.offset; var viewTop = this.config.scrollContainer && this.config.scrollContainer.scrollTop || window.pageYOffset; var viewBottom = viewTop + Math.min(this.element.clientHeight, getInnerHeight()) - offset; var top = this.offsetTop(box); var bottom = top + box.clientHeight; return top <= viewBottom && bottom >= viewTop; } }, { key: 'disabled', value: function disabled() { return !this.config.mobile && isMobile(navigator.userAgent); } }]); return WOW; }(); exports.default = WOW; module.exports = exports['default']; }); new WOW().init();