lzy-load/bundles/lzy-load.umd.min.js

LzyLoad is an Angular Lib for loading content on demand

!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("@angular/core"),require("rxjs"),require("rxjs/internal/operators")):"function"==typeof define&&define.amd?define("lzy-load",["exports","@angular/core","rxjs","rxjs/internal/operators"],e):e((t=t||self)["lzy-load"]={},t.ng.core,t.rxjs,t.rxjs["internal/operators"])}(this,(function(t,e,i,n){"use strict";var o,s,r="lzyLoadItemPos",a=function(){function t(t,e){this.hostElement=t,this.renderer=e,this.isVisible=!1,this.loadContent=!1}return Object.defineProperty(t.prototype,"pos",{get:function(){return this._pos},set:function(t){null!=t&&(this._pos=t,this.renderer.setProperty(this.hostElement.nativeElement,r,this._pos))},enumerable:!1,configurable:!0}),t}();a.decorators=[{type:e.Directive,args:[{selector:"[lzyLoadItem]",exportAs:"lzyLoadItem"}]}],a.ctorParameters=function(){return[{type:e.ElementRef},{type:e.Renderer2}]},a.propDecorators={pos:[{type:e.Input}]},(o=t.LoadStrategy||(t.LoadStrategy={}))[o.OnVisible=0]="OnVisible",o[o.PctOfVisibleElem=1]="PctOfVisibleElem",o[o.AheadOfVisElem=2]="AheadOfVisElem",o[o.PctOfTotElem=3]="PctOfTotElem",(s=t.UnloadStrategy||(t.UnloadStrategy={}))[s.KeepLoaded=0]="KeepLoaded",s[s.LeavLoadedRange=1]="LeavLoadedRange";var l=function(){function e(e,n){this.renderer=e,this.hostElement=n,this.init=!1,this.loadingRangeAmount=0,this.preloadAmo=0,this.scrollEvent=new i.Subject,this.onResizeEvent=new i.Subject,this.numOfVisiElem=0,this.loadedRange=[],this.settings={loadStrategy:t.LoadStrategy.PctOfVisibleElem,unloadStrategy:t.UnloadStrategy.KeepLoaded,percent:2},this.subscription=new i.Subscription}return e.prototype.ngOnInit=function(){this.registerIO(),this.initScroll(),this.initScreenResizing()},e.prototype.registerIO=function(){this.IOOptions={root:null,rootMargin:"0px",threshold:[.1]},this.container||(this.container=this.hostElement.nativeElement),this.IOOptions.root=this.container},e.prototype.initScroll=function(){var t=this;this.renderer.listen(this.container,"scroll",(function(){t.scrollEvent.next()})),this.subscription.add(this.scrollEvent.pipe(n.debounceTime(100)).subscribe((function(){t.updateLoadedElements()})))},e.prototype.initScreenResizing=function(){var t=this;this.subscription.add(this.onResizeEvent.pipe(n.debounceTime(300)).subscribe((function(){t.calSettings(),t.updateLoadedElements()})))},e.prototype.initialize=function(){this.initializeIntersectionObs()},e.prototype.resetAndRecalculateSettings=function(){this.init=!1,this.observer&&this.observer.disconnect(),this.initializeIntersectionObs()},e.prototype.ngAfterContentInit=function(){var t=this;this.subscription.add(this.itemsIO.changes.subscribe((function(){t.resetAndRecalculateSettings()}))),this.itemsIO.length>0&&this.initialize()},e.prototype.calSettings=function(){switch(this.settings.loadStrategy){case t.LoadStrategy.AheadOfVisElem:this.loadingRangeAmount=Math.ceil(this.settings.number+this.numOfVisiElem),this.preloadAmo=this.settings.number;break;case t.LoadStrategy.PctOfVisibleElem:this.loadingRangeAmount=Math.ceil(this.settings.factor*this.numOfVisiElem),this.preloadAmo=Math.ceil((this.loadingRangeAmount-this.numOfVisiElem)/2);break;case t.LoadStrategy.OnVisible:this.loadingRangeAmount=this.numOfVisiElem,this.preloadAmo=0;break;case t.LoadStrategy.PctOfTotElem:this.loadingRangeAmount=Math.ceil(this.settings.percent*this.itemsIO.length),this.preloadAmo=Math.ceil((this.loadingRangeAmount-this.numOfVisiElem)/2)}},e.prototype.inLoadingRange=function(t){t.loadContent=!0},e.prototype.outOfLoadingRange=function(e){this.settings.unloadStrategy===t.UnloadStrategy.LeavLoadedRange&&(e.loadContent=!1)},e.prototype.getVisibleItems=function(){return this.numOfVisiElem=this.itemsIO.filter((function(t){return t.isVisible})).length,this.numOfVisiElem},e.prototype.initializeIntersectionObs=function(){var t=this;this.observer=new IntersectionObserver((function(e){var i=function(){e.forEach((function(e){var i=t.itemsIO.toArray()[e.target[r]];i&&(i.isVisible=e.isIntersecting)}))};t.init?i():(i(),t.getVisibleItems(),t.calSettings(),t.updateLoadedElements(),t.init=!0)}),this.IOOptions),this.itemsIO.forEach((function(e){t.observer.observe(e.hostElement.nativeElement)}))},e.prototype.calLoadedRange=function(t){var e=[0,0],i=t[0],n=t[t.length-1],o=this.itemsIO.length-1;return e[0]=Math.max(0,i.pos-this.preloadAmo),0===e[0]?e[1]=Math.min(this.loadingRangeAmount,o):n.pos+this.preloadAmo>=o?(e[1]=o,e[0]=Math.max(0,o-this.loadingRangeAmount)):e[1]=n.pos+this.preloadAmo,e},e.prototype.updateLoadedElements=function(){var t=this,e=this.itemsIO.filter((function(t){return t.isVisible}));e.length>0&&(this.loadedRange=this.calLoadedRange(e),this.itemsIO.forEach((function(e,i){i>=t.loadedRange[0]&&i<=t.loadedRange[1]?t.inLoadingRange(e):t.outOfLoadingRange(e)})))},e.prototype.onResize=function(){this.onResizeEvent.next()},e.prototype.ngOnDestroy=function(){this.observer&&this.observer.disconnect(),this.subscription.unsubscribe()},e}();l.decorators=[{type:e.Component,args:[{selector:"lzy-load-cont",template:"<ng-content></ng-content>",styles:[":host{background:transparent;border:inherit;color:inherit;display:flex;margin:0;padding:0}"]}]}],l.ctorParameters=function(){return[{type:e.Renderer2},{type:e.ElementRef}]},l.propDecorators={settings:[{type:e.Input}],container:[{type:e.Input}],itemsIO:[{type:e.ContentChildren,args:[a,{descendants:!0}]}],onResize:[{type:e.HostListener,args:["window:resize",[]]}]};var c=function(){};c.decorators=[{type:e.NgModule,args:[{declarations:[l,a],imports:[],exports:[l,a]}]}],t.LL_PRO_NAME=r,t.LzyLoadContComponent=l,t.LzyLoadItemDirective=a,t.LzyLoadModule=c,Object.defineProperty(t,"__esModule",{value:!0})}));
//# sourceMappingURL=lzy-load.umd.min.js.map