(function (global, factory) {
	typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
		typeof define === 'function' && define.amd ? define(factory) :
			(global = global || self, global.LazyLoad = factory());
}(this, (function () { 'use strict';

	function _extends() {
		_extends = Object.assign || function (target) {
			for (var i = 1; i < arguments.length; i++) {
				var source = arguments[i];

				for (var key in source) {
					if (Object.prototype.hasOwnProperty.call(source, key)) {
						target[key] = source[key];
					}
				}
			}

			return target;
		};

		return _extends.apply(this, arguments);
	}

	var runningOnBrowser = typeof window !== "undefined";
	var isBot = runningOnBrowser && !("onscroll" in window) || typeof navigator !== "undefined" && /(gle|ing|ro)bot|crawl|spider/i.test(navigator.userAgent);
	var supportsIntersectionObserver = runningOnBrowser && "IntersectionObserver" in window;
	var supportsClassList = runningOnBrowser && "classList" in document.createElement("p");
	var isHiDpi = runningOnBrowser && window.devicePixelRatio > 1;

	var defaultSettings = {
		elements_selector: "img",
		container: isBot || runningOnBrowser ? document : null,
		threshold: 300,
		thresholds: null,
		data_src: "src",
		data_srcset: "srcset",
		data_sizes: "sizes",
		data_bg: "bg",
		data_bg_hidpi: "bg-hidpi",
		data_bg_multi: "bg-multi",
		data_bg_multi_hidpi: "bg-multi-hidpi",
		data_poster: "poster",
		class_applied: "applied",
		class_loading: "loading",
		class_loaded: "loaded",
		class_error: "error",
		load_delay: 0,
		auto_unobserve: true,
		callback_enter: null,
		callback_exit: null,
		callback_applied: null,
		callback_loading: null,
		callback_loaded: null,
		callback_error: null,
		callback_finish: null,
		use_native: false
	};
	var getExtendedSettings = function getExtendedSettings(customSettings) {
		return _extends({}, defaultSettings, customSettings);
	};

	/* Creates instance and notifies it through the window element */
	var createInstance = function createInstance(classObj, options) {
		var event;
		var eventString = "LazyLoad::Initialized";
		var instance = new classObj(options);

		try {
			// Works in modern browsers
			event = new CustomEvent(eventString, {
				detail: {
					instance: instance
				}
			});
		} catch (err) {
			// Works in Internet Explorer (all versions)
			event = document.createEvent("CustomEvent");
			event.initCustomEvent(eventString, false, false, {
				instance: instance
			});
		}

		window.dispatchEvent(event);
	};
	/* Auto initialization of one or more instances of lazyload, depending on the
		options passed in (plain object or an array) */


	var autoInitialize = function autoInitialize(classObj, options) {
		if (!options) {
			return;
		}

		if (!options.length) {
			// Plain object
			createInstance(classObj, options);
		} else {
			// Array of objects
			for (var i = 0, optionsItem; optionsItem = options[i]; i += 1) {
				createInstance(classObj, optionsItem);
			}
		}
	};

	var statusObserved = "observed";
	var statusApplied = "applied";
	var statusLoading = "loading";
	var statusLoaded = "loaded";
	var statusError = "error";
	var statusNative = "native";

	var dataPrefix = "data-";
	var statusDataName = "ll-status";
	var timeoutDataName = "ll-timeout";
	var getData = function getData(element, attribute) {
		return element.getAttribute(dataPrefix + attribute);
	};
	var setData = function setData(element, attribute, value) {
		var attrName = dataPrefix + attribute;

		if (value === null) {
			element.removeAttribute(attrName);
			return;
		}

		element.setAttribute(attrName, value);
	};
	var resetStatus = function resetStatus(element) {
		return setData(element, statusDataName, null);
	};
	var setStatus = function setStatus(element, status) {
		return setData(element, statusDataName, status);
	};
	var hasAnyStatus = function hasAnyStatus(element) {
		return getData(element, statusDataName) !== null;
	};
	var hasStatusObserved = function hasStatusObserved(element) {
		return getData(element, statusDataName) === statusObserved;
	};
	var hasStatusError = function hasStatusError(element) {
		return getData(element, statusDataName) === statusError;
	};
	var setTimeoutData = function setTimeoutData(element, value) {
		return setData(element, timeoutDataName, value);
	};
	var getTimeoutData = function getTimeoutData(element) {
		return getData(element, timeoutDataName);
	};

	var safeCallback = function safeCallback(callback, arg1, arg2, arg3) {
		if (!callback) {
			return;
		}

		if (arg3 !== undefined) {
			callback(arg1, arg2, arg3);
			return;
		}

		if (arg2 !== undefined) {
			callback(arg1, arg2);
			return;
		}

		callback(arg1);
	};

	var addClass = function addClass(element, className) {
		if (supportsClassList) {
			element.classList.add(className);
			return;
		}

		element.className += (element.className ? " " : "") + className;
	};
	var removeClass = function removeClass(element, className) {
		if (supportsClassList) {
			element.classList.remove(className);
			return;
		}

		element.className = element.className.replace(new RegExp("(^|\\s+)" + className + "(\\s+|$)"), " ").replace(/^\s+/, "").replace(/\s+$/, "");
	};

	var addTempImage = function addTempImage(element) {
		element.llTempImage = document.createElement("img");
	};
	var deleteTempImage = function deleteTempImage(element) {
		delete element.llTempImage;
	};
	var getTempImage = function getTempImage(element) {
		return element.llTempImage;
	};

	var increaseLoadingCount = function increaseLoadingCount(instance) {
		if (!instance) return;
		instance.loadingCount += 1;
	};
	var getSourceTags = function getSourceTags(parentTag) {
		var sourceTags = [];

		for (var i = 0, childTag; childTag = parentTag.children[i]; i += 1) {
			if (childTag.tagName === "SOURCE") {
				sourceTags.push(childTag);
			}
		}

		return sourceTags;
	};
	var setAttributeIfValue = function setAttributeIfValue(element, attrName, value) {
		if (!value) {
			return;
		}

		element.setAttribute(attrName, value);
	};
	var setImageAttributes = function setImageAttributes(element, settings) {
		setAttributeIfValue(element, "sizes", getData(element, settings.data_sizes));
		setAttributeIfValue(element, "srcset", getData(element, settings.data_srcset));
		setAttributeIfValue(element, "src", getData(element, settings.data_src));
	};
	var setSourcesImg = function setSourcesImg(element, settings) {
		var parent = element.parentNode;

		if (parent && parent.tagName === "PICTURE") {
			var sourceTags = getSourceTags(parent);
			sourceTags.forEach(function (sourceTag) {
				setImageAttributes(sourceTag, settings);
			});
		}

		setImageAttributes(element, settings);
	};
	var setSourcesIframe = function setSourcesIframe(element, settings) {
		setAttributeIfValue(element, "src", getData(element, settings.data_src));
	};
	var setSourcesVideo = function setSourcesVideo(element, settings) {
		var sourceTags = getSourceTags(element);
		sourceTags.forEach(function (sourceTag) {
			setAttributeIfValue(sourceTag, "src", getData(sourceTag, settings.data_src));
		});
		setAttributeIfValue(element, "poster", getData(element, settings.data_poster));
		setAttributeIfValue(element, "src", getData(element, settings.data_src));
		element.load();
	};
	var setSourcesFunctions = {
		IMG: setSourcesImg,
		IFRAME: setSourcesIframe,
		VIDEO: setSourcesVideo
	};
	var setSources = function setSources(element, settings, instance) {
		var setSourcesFunction = setSourcesFunctions[element.tagName];
		if (!setSourcesFunction) return;
		setSourcesFunction(element, settings); // Annotate and notify loading

		increaseLoadingCount(instance);
		addClass(element, settings.class_loading);
		setStatus(element, statusLoading);
		safeCallback(settings.callback_loading, element, instance);
		safeCallback(settings.callback_reveal, element, instance); // <== DEPRECATED
	};
	var setBackground = function setBackground(element, settings, instance) {
		var bg1xValue = getData(element, settings.data_bg);
		var bgHiDpiValue = getData(element, settings.data_bg_hidpi);
		var bgDataValue = isHiDpi && bgHiDpiValue ? bgHiDpiValue : bg1xValue;
		if (!bgDataValue) return;
		element.style.backgroundImage = "url(\"".concat(bgDataValue, "\")");
		getTempImage(element).setAttribute("src", bgDataValue); // Annotate and notify loading

		increaseLoadingCount(instance);
		addClass(element, settings.class_loading);
		setStatus(element, statusLoading);
		safeCallback(settings.callback_loading, element, instance);
		safeCallback(settings.callback_reveal, element, instance); // <== DEPRECATED
	}; // NOTE: THE TEMP IMAGE TRICK CANNOT BE DONE WITH data-multi-bg
	// BECAUSE INSIDE ITS VALUES MUST BE WRAPPED WITH URL() AND ONE OF THEM
	// COULD BE A GRADIENT BACKGROUND IMAGE

	var setMultiBackground = function setMultiBackground(element, settings, instance) {
		var bg1xValue = getData(element, settings.data_bg_multi);
		var bgHiDpiValue = getData(element, settings.data_bg_multi_hidpi);
		var bgDataValue = isHiDpi && bgHiDpiValue ? bgHiDpiValue : bg1xValue;
		if (!bgDataValue) return;
		element.style.backgroundImage = bgDataValue; // Annotate and notify applied

		addClass(element, settings.class_applied);
		setStatus(element, statusApplied);
		safeCallback(settings.callback_applied, element, instance);
	};

	var genericLoadEventName = "load";
	var mediaLoadEventName = "loadeddata";
	var errorEventName = "error";
	var elementsWithLoadEvent = ["IMG", "IFRAME", "VIDEO"];
	var hasLoadEvent = function hasLoadEvent(element) {
		return elementsWithLoadEvent.indexOf(element.tagName) > -1;
	};
	var decreaseLoadingCount = function decreaseLoadingCount(settings, instance) {
		if (!instance) return;
		instance.loadingCount -= 1;
	};
	var checkFinish = function checkFinish(settings, instance) {
		if (!instance || instance.toLoadCount || instance.loadingCount) return;
		safeCallback(settings.callback_finish, instance);
	};
	var addEventListener = function addEventListener(element, eventName, handler) {
		element.addEventListener(eventName, handler);
	};
	var removeEventListener = function removeEventListener(element, eventName, handler) {
		element.removeEventListener(eventName, handler);
	};
	var addEventListeners = function addEventListeners(element, loadHandler, errorHandler) {
		addEventListener(element, genericLoadEventName, loadHandler);
		addEventListener(element, mediaLoadEventName, loadHandler);
		addEventListener(element, errorEventName, errorHandler);
	};
	var removeEventListeners = function removeEventListeners(element, loadHandler, errorHandler) {
		removeEventListener(element, genericLoadEventName, loadHandler);
		removeEventListener(element, mediaLoadEventName, loadHandler);
		removeEventListener(element, errorEventName, errorHandler);
	};
	var doneHandler = function doneHandler(element, settings, instance) {
		deleteTempImage(element);
		decreaseLoadingCount(settings, instance);
		removeClass(element, settings.class_loading);
	};
	var loadHandler = function loadHandler(event, element, settings, instance) {
		doneHandler(element, settings, instance);
		addClass(element, settings.class_loaded);
		setStatus(element, statusLoaded);
		safeCallback(settings.callback_loaded, element, instance);
		checkFinish(settings, instance);
	};
	var errorHandler = function errorHandler(event, element, settings, instance) {
		doneHandler(element, settings, instance);
		addClass(element, settings.class_error);
		setStatus(element, statusError);
		safeCallback(settings.callback_error, element, instance);
		checkFinish(settings, instance);
	};
	var addOneShotEventListeners = function addOneShotEventListeners(element, settings, instance) {
		var elementToListenTo = getTempImage(element) || element;

		var _loadHandler = function _loadHandler(event) {
			loadHandler(event, element, settings, instance);
			removeEventListeners(elementToListenTo, _loadHandler, _errorHandler);
		};

		var _errorHandler = function _errorHandler(event) {
			errorHandler(event, element, settings, instance);
			removeEventListeners(elementToListenTo, _loadHandler, _errorHandler);
		};

		addEventListeners(elementToListenTo, _loadHandler, _errorHandler);
	};

	var decreaseToLoadCount = function decreaseToLoadCount(settings, instance) {
		if (!instance) return;
		instance.toLoadCount -= 1;
	};
	var unobserve = function unobserve(element, instance) {
		if (!instance) return;
		var observer = instance._observer;

		if (observer && instance._settings.auto_unobserve) {
			observer.unobserve(element);
		}
	};

	var loadBackground = function loadBackground(element, settings, instance) {
		addTempImage(element);
		addOneShotEventListeners(element, settings, instance);
		setBackground(element, settings, instance);
		setMultiBackground(element, settings, instance);
	};

	var loadRegular = function loadRegular(element, settings, instance) {
		addOneShotEventListeners(element, settings, instance);
		setSources(element, settings, instance);
	};

	var load = function load(element, settings, instance) {
		if (hasLoadEvent(element)) {
			loadRegular(element, settings, instance);
		} else {
			loadBackground(element, settings, instance);
		}

		decreaseToLoadCount(settings, instance);
		unobserve(element, instance);
		checkFinish(settings, instance);
	};
	var loadNative = function loadNative(element, settings, instance) {
		addOneShotEventListeners(element, settings, instance);
		setSources(element, settings, instance);
		decreaseToLoadCount(settings, instance);
		setStatus(element, statusNative);
		checkFinish(settings, instance);
	};

	var cancelDelayLoad = function cancelDelayLoad(element) {
		var timeoutId = getTimeoutData(element);

		if (!timeoutId) {
			return; // do nothing if timeout doesn't exist
		}

		clearTimeout(timeoutId);
		setTimeoutData(element, null);
	};
	var delayLoad = function delayLoad(element, settings, instance) {
		var loadDelay = settings.load_delay;
		var timeoutId = getTimeoutData(element);

		if (timeoutId) {
			return; // do nothing if timeout already set
		}

		timeoutId = setTimeout(function () {
			load(element, settings, instance);
			cancelDelayLoad(element);
		}, loadDelay);
		setTimeoutData(element, timeoutId);
	};

	var onEnter = function onEnter(element, entry, instance) {
		var settings = instance._settings;
		safeCallback(settings.callback_enter, element, entry, instance);

		if (!settings.load_delay) {
			load(element, settings, instance);
			return;
		}

		delayLoad(element, settings, instance);
	};
	var onExit = function onExit(element, entry, instance) {
		var settings = instance._settings;
		safeCallback(settings.callback_exit, element, entry, instance);

		if (!settings.load_delay) {
			return;
		}

		cancelDelayLoad(element);
	};

	var nativeLazyTags = ["IMG", "IFRAME"];
	var loadingString = "loading";
	var shouldUseNative = function shouldUseNative(settings) {
		return settings.use_native && loadingString in HTMLImageElement.prototype;
	};
	var loadAllNative = function loadAllNative(elements, settings, instance) {
		elements.forEach(function (element) {
			if (nativeLazyTags.indexOf(element.tagName) === -1) {
				return;
			}

			element.setAttribute(loadingString, "lazy");
			loadNative(element, settings, instance);
		});
		instance.toLoadCount = 0;
	};

	var isIntersecting = function isIntersecting(entry) {
		return entry.isIntersecting || entry.intersectionRatio > 0;
	};

	var getObserverSettings = function getObserverSettings(settings) {
		return {
			root: settings.container === document ? null : settings.container,
			rootMargin: settings.thresholds || settings.threshold + "px"
		};
	};

	var resetObserver = function resetObserver(observer) {
		observer.disconnect();
	};
	var observeElements = function observeElements(observer, elements) {
		elements.forEach(function (element) {
			observer.observe(element);
			setStatus(element, statusObserved);
		});
	};
	var updateObserver = function updateObserver(observer, elementsToObserve) {
		resetObserver(observer);
		observeElements(observer, elementsToObserve);
	};
	var setObserver = function setObserver(instance) {
		if (!supportsIntersectionObserver || shouldUseNative(instance._settings)) {
			return;
		}

		instance._observer = new IntersectionObserver(function (entries) {
			entries.forEach(function (entry) {
				return isIntersecting(entry) ? onEnter(entry.target, entry, instance) : onExit(entry.target, entry, instance);
			});
		}, getObserverSettings(instance._settings));
	};

	var toArray = function toArray(nodeSet) {
		return Array.prototype.slice.call(nodeSet);
	};
	var queryElements = function queryElements(settings) {
		return settings.container.querySelectorAll(settings.elements_selector);
	};
	var isToManage = function isToManage(element) {
		return !hasAnyStatus(element) || hasStatusObserved(element);
	};
	var excludeManagedElements = function excludeManagedElements(elements) {
		return toArray(elements).filter(isToManage);
	};
	var hasError = function hasError(element) {
		return hasStatusError(element);
	};
	var filterErrorElements = function filterErrorElements(elements) {
		return toArray(elements).filter(hasError);
	};
	var getElementsToLoad = function getElementsToLoad(elements, settings) {
		return excludeManagedElements(elements || queryElements(settings));
	};

	var retryLazyLoad = function retryLazyLoad(instance) {
		var settings = instance._settings;
		var errorElements = filterErrorElements(queryElements(settings));
		errorElements.forEach(function (element) {
			removeClass(element, settings.class_error);
			resetStatus(element);
		});
		instance.update();
	};
	var setOnlineCheck = function setOnlineCheck(instance) {
		if (!runningOnBrowser) {
			return;
		}

		window.addEventListener("online", function (event) {
			retryLazyLoad(instance);
		});
	};

	var LazyLoad = function LazyLoad(customSettings, elements) {
		this._settings = getExtendedSettings(customSettings);
		this.loadingCount = 0;
		setObserver(this);
		setOnlineCheck(this);
		this.update(elements);
	};

	LazyLoad.prototype = {
		update: function update(givenNodeset) {
			var settings = this._settings;
			var elementsToLoad = getElementsToLoad(givenNodeset, settings);
			this.toLoadCount = elementsToLoad.length;

			if (isBot || !supportsIntersectionObserver) {
				this.loadAll(elementsToLoad);
				return;
			}

			if (shouldUseNative(settings)) {
				loadAllNative(elementsToLoad, settings, this);
				return;
			}

			updateObserver(this._observer, elementsToLoad);
		},
		destroy: function destroy() {
			// Observer
			if (this._observer) {
				this._observer.disconnect();
			}

			delete this._observer;
			delete this._settings;
			delete this.loadingCount;
			delete this.toLoadCount;
		},
		loadAll: function loadAll(elements) {
			var _this = this;

			var settings = this._settings;
			var elementsToLoad = getElementsToLoad(elements, settings);
			elementsToLoad.forEach(function (element) {
				load(element, settings, _this);
			});
		},
		// DEPRECATED
		load: function load$1(element) {
			load(element, this._settings, this);
		}
	};

	LazyLoad.load = function (element, customSettings) {
		var settings = getExtendedSettings(customSettings);

		load(element, settings);
	};
	/* Automatic instances creation if required (useful for async script loading) */


	if (runningOnBrowser) {
		autoInitialize(LazyLoad, window.lazyLoadOptions);
	}

	return LazyLoad;

})));
