zmp-core/components/lazy/lazy.js

Full featured mobile HTML framework for building iOS & Android apps

(function zmpComponentLoader(a,e){void 0===e&&(e=!0);var t=a.$,r=a.utils,s=(a.getDevice,a.getSupport),n=(a.Class,a.Modal,a.ConstructorMethods,a.ModalMethods,r.bindMethods),o={destroy:function(a){var e=t(a).closest(".page");e.length&&e[0].zmpLazyDestroy&&e[0].zmpLazyDestroy()},create:function(a){var e=this,r=s(),n=t(a).closest(".page").eq(0),o=n.find(".lazy");if(0!==o.length||n.hasClass("lazy")){var l=e.params.lazy.placeholder;!1!==l&&o.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 z=n[0].zmpLazyObserver;return z||(z=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,y),t.unobserve(a.target)}}))}),{root:n[0]})),o.each((function(a){a.zmpLazyObserverAdded||(a.zmpLazyObserverAdded=!0,z.observe(a))})),void(n[0].zmpLazyDestroy||(n[0].zmpLazyDestroy=function(){z.disconnect(),delete n[0].zmpLazyDestroy,delete n[0].zmpLazyObserver}))}n[0].zmpLazyDestroy||(n[0].zmpLazyDestroy=function(){n[0].zmpLazyAttached=!1,delete n[0].zmpLazyAttached,n.off("lazy",c),n.off("scroll",c,!0),n.find(".tab").off("tab:mounted tab:show",c),e.off("resize",c)}),n[0].zmpLazyAttached||(n[0].zmpLazyAttached=!0,n.on("lazy",c),n.on("scroll",c,!0),n.find(".tab").on("tab:mounted tab:show",c),e.on("resize",c)),c()}function y(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],y))}function c(){e.lazy.load(n,(function(a){e.params.lazy.sequential&&d?i.indexOf(a)<0&&i.push(a):(d=!0,e.lazy.loadImage(a,y))}))}},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,s=t(a),n=s.attr("data-background"),o=n||s.attr("data-src");function l(){s.removeClass("lazy").addClass("lazy-loaded"),n?s.css("background-image","url("+o+")"):o&&s.attr("src",o),e&&e(a),s.trigger("lazy:loaded"),r.emit("lazyLoaded",s[0])}if(!o)return s.trigger("lazy:load"),r.emit("lazyLoad",s[0]),void l();var i=new window.Image;i.onload=l,i.onerror=function(){s.removeClass("lazy").addClass("lazy-loaded"),n?s.css("background-image","url("+(r.params.lazy.placeholder||"")+")"):s.attr("src",r.params.lazy.placeholder||""),e&&e(a),s.trigger("lazy:error"),r.emit("lazyError",s[0])},i.src=o,s.removeAttr("data-src").removeAttr("data-background"),s.trigger("lazy:load"),r.emit("lazyLoad",s[0])},load:function(a,e){var r=this,s=t(a);s.hasClass("page")||(s=s.parents(".page").eq(0)),0!==s.length&&s.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(){n(this,{lazy:o})},on:{pageInit:function(a){(a.$el.find(".lazy").length>0||a.$el.hasClass("lazy"))&&this.lazy.create(a.$el)},pageAfterIn:function(a){var e=s();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=s();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}(ZMP, typeof ZMPAutoInstallComponent === 'undefined' ? undefined : ZMPAutoInstallComponent))