22

✏️ Editing: lazyload.1.0.3.js

/*=================================================
=            WP Rocket Lazyload System            =
=================================================*/

(function(){
	'use strict';

var docElem = document.documentElement;

/*==========  Get computed style  ==========*/
	
	var getStyle = function (elem, style){
		return getComputedStyle(elem, null)[style];
	};

/*==========  Get window scrolls values  ==========*/

var getWindowScroll = function(){
		var scrollTop, scrollLeft;

if(document.compatMode === 'CSS1Compat'){
			scrollTop  = docElem.scrollTop;
			scrollLeft = docElem.scrollTop;
		}else{
			scrollTop  = window.pageYOffset;
			scrollLeft = window.pageXOffset;
		}

return {'left': scrollLeft, 'top': scrollTop};
	}

/*==========  Get window Size  ==========*/

var getWindowSize = function(){
		return {
			'height': window.innerHeight || docElem.clientHeight,
			'width' : window.innerWidth || docElem.clientWidth
		}
	}

/*==========  Check if element is visible  ==========*/
	
	var isVisible = function(elem, winSizes, winScroll){
		var
			visible   = getStyle(elem, 'visibility') != 'hidden',
			outerRect = elem.getBoundingClientRect();

return visible ? (outerRect.top < (winSizes.height + winScroll.top)) && (outerRect.left < (winSizes.width + winScroll.left)) : false;
	};

/*==========  Get elements  ==========*/
	
	var getElems = function(){
		return document.querySelectorAll('[data-lazy-src],[data-lazy-original]');
	}

/*==========  Main function  ==========*/
	
	var lazyLoad = function(){
		var
			elems     = getElems(),
			winSizes  = getWindowSize(),
			winScroll = getWindowScroll();

for(var i = 0; i < elems.length; i++){
			var elem    = elems[i];

if( isVisible(elem, winSizes, winScroll) ){
				var
					lazyAttr = elem.getAttribute('data-lazy-original') ? 'data-lazy-original' : 'data-lazy-src',
					lazySrc  = elem.getAttribute(lazyAttr),
					tagName  = elem.tagName.toLowerCase();
				
				switch(tagName){
					case 'img':
						var img = new Image;
						
						img.onload = new function(){
							elem.src = lazySrc;
							//triggerLoaded();
						};

img.src = lazySrc;
					break;

case 'iframe':
						elem.src = lazySrc;
						//triggerLoaded();
					break;
				}
				
				elem.removeAttribute(lazyAttr);
			}
		}
	}

/*==========  Launch window.onLazyLoaded function once image loaded  ==========*/
	
	/*function triggerLoaded(){
		if(typeof window.onLazyLoaded == 'function'){
			window.onLazyLoaded.call(null);
		}
	}*/

/*==========  Set events  ==========*/

if(window.MutationObserver){
		new MutationObserver( lazyLoad ).observe( docElem, {childList: true, subtree: true, attributes: true} );
	}else{
		docElem.addEventListener('DOMNodeInserted', lazyLoad, true);
		docElem.addEventListener('DOMAttrModified', lazyLoad, true);
		setInterval(lazyLoad, 999);
	}

['focus', 'mouseover', 'click', 'load', 'transitionend', 'animationend', 'webkitAnimationEnd'].forEach(function(name){
		document.addEventListener(name, lazyLoad, true);
	});

['scroll', 'resize', 'hashchange'].forEach(function(name){
		window.addEventListener(name, lazyLoad, true);
	});

})();

MR SKB