luyadev/luya

View on GitHub
core/resources/lazyload/lazyload.js

Summary

Maintainability
A
0 mins
Test Coverage
function _typeof(e){return(_typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(e)}!function(l){var i={debug:!1,initialized:!1,imageSelector:".js-lazyimage",imageClass:"lazyimage",imageWrapperClass:"lazyimage-wrapper",placeholderClass:"lazyimage-placeholder",loaderHtml:'<div class="loader"></div>',images:[],observer:null,observerOptions:{root:null,rootMargin:"200px 0px 200px",threshold:0,trackVisibility:!1},latestId:0,getId:function(){return this.latestId+=1},getImageById:function(i){return this.images.find(function(e){return e.id===i})},collectImages:function(){var i=this;l(this.imageSelector).each(function(){if(void 0===l(this).data("lazy-id")){var e=i.getId();l(this).data("lazy-id",e).addClass("".concat(i.imageClass,"-").concat(e)),i.images.push({id:e,el:this,asBackground:!!l(this).data("as-background"),replacePlaceholder:!!l(this).data("replace-placeholder"),isLoaded:!1,isObserved:!1})}}),this.log("Images",this.images)},observeImages:function(){this.observer||this.initObserver();var e=!0,i=!1,t=void 0;try{for(var a,r=this.images[Symbol.iterator]();!(e=(a=r.next()).done);e=!0){var s=a.value;s.isObserved||s.isLoaded||(this.observer.observe(s.el),s.isObserved=!0)}}catch(e){i=!0,t=e}finally{try{e||null==r.return||r.return()}finally{if(i)throw t}}},imageIntersects:function(e){var i=!0,t=!1,a=void 0;try{for(var r,s=e[Symbol.iterator]();!(i=(r=s.next()).done);i=!0){var o=r.value;void 0===o.isVisible&&(o.isVisible=!0),o.isIntersecting&&(this.observerOptions.trackVisibility&&o.isVisible||!this.observerOptions.trackVisibility)&&(this.observer.unobserve(o.target),this.loadImage(this.getImageById(l(o.target).data("lazy-id"))))}}catch(e){t=!0,a=e}finally{try{i||null==s.return||s.return()}finally{if(t)throw a}}},loadImage:function(i){var t=this;this.log("Image loading:",{id:i.id,image:i}),l(document).trigger("lazyimage-loading",{image:i});var e=l("<img/>");e.on("load",function(){i.isLoaded=!0;var e=l(i.el);i.asBackground?e.css({backgroundImage:"url("+e.data("src")+")"}):i.replacePlaceholder?e.parent(".".concat(t.imageWrapperClass)).replaceWith(e.removeClass("lazyimage").addClass("loaded lazy-image").attr("src",e.data("src"))):e.attr("src",e.data("src")).addClass("loaded").parent(".".concat(t.imageWrapperClass)).addClass("loaded");t.log("Image loaded:",{id:i.id,image:i}),l(document).trigger("lazyimage-loaded",{type:"success",image:i})}),e.on("error",function(){t.log("Image load error:",{id:i.id,image:i}),l(document).trigger("lazyimage-loaded",{type:"error",image:i})}),e.attr("src",l(i.el).data("src"))},initObserver:function(){this.log("Observer options:",this.observerOptions),this.observer=new IntersectionObserver(this.imageIntersects.bind(this),this.observerOptions)},init:function(e){for(var i in this.log("Init, options:",e||{}),e)this.hasOwnProperty(i)&&"function"!=typeof this[i]&&("object"===_typeof(this[i])?this[i]=l.extend(this[i],e[i]):this[i]=e[i]);this.initialized||(this.collectImages(),this.initObserver(),this.observeImages()),this.initialized=!0},log:function(){var e;this.debug&&(e=console).log.apply(e,arguments)}};l.lazyLoad=function(e){if("string"!=typeof e)return i.init(e),this;switch(e){case"refetchElements":case"collectImages":i.collectImages(),i.observeImages()}}}(jQuery);