framework7/components/lazy/lazy.js

Full featured mobile HTML framework for building iOS & Android apps

(function framework7ComponentLoader(a,e){void 0===e&&(e=!0);var t=a.$,r=a.utils,o=(a.getDevice,a.getSupport),s=(a.Class,a.Modal,a.ConstructorMethods,a.ModalMethods,r.bindMethods),n={destroy:function(a){var e=t(a).closest(".page");e.length&&e[0].f7LazyDestroy&&e[0].f7LazyDestroy()},create:function(a){var e=this,r=o(),s=t(a).closest(".page").eq(0),n=s.find(".lazy");if(0!==n.length||s.hasClass("lazy")){var l=e.params.lazy.placeholder;!1!==l&&n.each((function(a){t(a).attr("data-src")&&!t(a).attr("src")&&t(a).attr("src",l)}));var i=[],d=!1;if(e.params.lazy.observer&&r.intersectionObserver){var y=s[0].f7LazyObserver;return y||(y=new window.IntersectionObserver((function(a,t){a.forEach((function(a){if(a.isIntersecting){if(e.params.lazy.sequential&&d)return void(i.indexOf(a.target)<0&&i.push(a.target));d=!0,e.lazy.loadImage(a.target,c),t.unobserve(a.target)}}))}),{root:s[0]})),n.each((function(a){a.f7LazyObserverAdded||(a.f7LazyObserverAdded=!0,y.observe(a))})),void(s[0].f7LazyDestroy||(s[0].f7LazyDestroy=function(){y.disconnect(),delete s[0].f7LazyDestroy,delete s[0].f7LazyObserver}))}s[0].f7LazyDestroy||(s[0].f7LazyDestroy=function(){s[0].f7LazyAttached=!1,delete s[0].f7LazyAttached,s.off("lazy",f),s.off("scroll",f,!0),s.find(".tab").off("tab:mounted tab:show",f),e.off("resize",f)}),s[0].f7LazyAttached||(s[0].f7LazyAttached=!0,s.on("lazy",f),s.on("scroll",f,!0),s.find(".tab").on("tab:mounted tab:show",f),e.on("resize",f)),f()}function c(a){i.indexOf(a)>=0&&i.splice(i.indexOf(a),1),d=!1,e.params.lazy.sequential&&i.length>0&&(d=!0,e.lazy.loadImage(i[0],c))}function f(){e.lazy.load(s,(function(a){e.params.lazy.sequential&&d?i.indexOf(a)<0&&i.push(a):(d=!0,e.lazy.loadImage(a,c))}))}},isInViewport:function(a){var e=this,t=a.getBoundingClientRect(),r=e.params.lazy.threshold||0;return t.top>=0-r&&t.left>=0-r&&t.top<=e.height+r&&t.left<=e.width+r},loadImage:function(a,e){var r=this,o=t(a),s=o.attr("data-background"),n=s||o.attr("data-src");function l(){o.removeClass("lazy").addClass("lazy-loaded"),s?o.css("background-image","url("+n+")"):n&&o.attr("src",n),e&&e(a),o.trigger("lazy:loaded"),r.emit("lazyLoaded",o[0])}if(!n)return o.trigger("lazy:load"),r.emit("lazyLoad",o[0]),void l();var i=new window.Image;i.onload=l,i.onerror=function(){o.removeClass("lazy").addClass("lazy-loaded"),s?o.css("background-image","url("+(r.params.lazy.placeholder||"")+")"):o.attr("src",r.params.lazy.placeholder||""),e&&e(a),o.trigger("lazy:error"),r.emit("lazyError",o[0])},i.src=n,o.removeAttr("data-src").removeAttr("data-background"),o.trigger("lazy:load"),r.emit("lazyLoad",o[0])},load:function(a,e){var r=this,o=t(a);o.hasClass("page")||(o=o.parents(".page").eq(0)),0!==o.length&&o.find(".lazy").each((function(a){t(a).parents(".tab:not(.tab-active)").length>0||r.lazy.isInViewport(a)&&(e?e(a):r.lazy.loadImage(a))}))}},l={name:"lazy",params:{lazy:{placeholder:"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABAQMAAAAl21bKAAAAA1BMVEXCwsK592mkAAAACklEQVQI12NgAAAAAgAB4iG8MwAAAABJRU5ErkJggg==",threshold:0,sequential:!0,observer:!0}},create:function(){s(this,{lazy:n})},on:{pageInit:function(a){(a.$el.find(".lazy").length>0||a.$el.hasClass("lazy"))&&this.lazy.create(a.$el)},pageAfterIn:function(a){var e=o();this.params.lazy.observer&&e.intersectionObserver||(a.$el.find(".lazy").length>0||a.$el.hasClass("lazy"))&&this.lazy.create(a.$el)},pageBeforeRemove:function(a){(a.$el.find(".lazy").length>0||a.$el.hasClass("lazy"))&&this.lazy.destroy(a.$el)},tabMounted:function(a){var e=t(a);(e.find(".lazy").length>0||e.hasClass("lazy"))&&this.lazy.create(e)},tabBeforeRemove:function(a){var e=o();if(!this.params.lazy.observer||!e.intersectionObserver){var r=t(a);(r.find(".lazy").length>0||r.hasClass("lazy"))&&this.lazy.destroy(r)}}}};if(e){if(a.prototype.modules&&a.prototype.modules[l.name])return;a.use(l),a.instance&&(a.instance.useModuleParams(l,a.instance.params),a.instance.useModule(l))}return l}(Framework7, typeof Framework7AutoInstallComponent === 'undefined' ? undefined : Framework7AutoInstallComponent))