ng-lazyload-image-angular-universal/bundles/ng-lazyload-image-angular-universal.umd.min.js

This is an extension from ng-lazyload-image, made available for Angular Universal.

!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@angular/common"),require("@angular/core"),require("rxjs"),require("rxjs/operators")):"function"==typeof define&&define.amd?define("ng-lazyload-image-angular-universal",["exports","@angular/common","@angular/core","rxjs","rxjs/operators"],t):t(e["ng-lazyload-image-angular-universal"]={},e.ng.common,e.ng.core,e.rxjs,e.rxjs.operators)}(this,function(e,r,i,s,o){"use strict";var a="ng-lazyloaded",u="ng-failed-lazyloaded";function c(e,t){e.className.includes(t)||(e.className+=" "+t)}function l(){return"undefined"!=typeof window}function f(e){return Boolean(e.parentElement&&"picture"===e.parentElement.nodeName.toLowerCase())}function p(e){return"img"===e.nodeName.toLowerCase()}function m(e,t,r){return p(e)?r?e.srcset=t:e.src=t:e.style.backgroundImage="url('"+t+"')",e}function t(o){return function(e){for(var t=e.parentElement.getElementsByTagName("source"),r=0;r<t.length;r++){var n=t[r].getAttribute(o);n&&(t[r].srcset=n)}}}var n=t("defaultImage"),g=t("lazyLoad"),h=t("errorImage");function d(n){return function(e,t,r){p(e)&&f(e)&&n(e),t&&m(e,t,r)}}var b=d(n),v=d(g),y=d(h),I={"finally":function(e){return c(e.element,a)},loadImage:function(e){var r,t=e.element,n=e.useSrcset,o=e.imagePath;if(p(t)&&f(t)){var i=t.parentNode.cloneNode(!0);r=i.getElementsByTagName("img")[0],g(r),m(r,o,n)}else r=new Image,p(t)&&t.sizes&&(r.sizes=t.sizes),n?r.srcset=o:r.src=o;return s.Observable.create(function(t){r.onload=function(){t.next(o),t.complete()},r.onerror=function(e){t.error(null)}})},setErrorImage:function(e){var t=e.element,r=e.errorImagePath,n=e.useSrcset;y(t,r,n),c(t,u)},setLoadedImage:function(e){var t=e.element,r=e.imagePath,n=e.useSrcset;v(t,r,n)},setup:function(e){var t=e.element,r=e.defaultImagePath,n=e.useSrcset;b(t,r,n),function o(e,t){return e.className&&e.className.includes(t)}(t,a)&&function i(e,t){e.className=e.className.replace(t,"")}(t,a)}},O=(w.fromElement=function(e){var t=e.getBoundingClientRect(),r=t.left,n=t.top,o=t.right,i=t.bottom;return 0===r&&0===n&&0===o&&0===i?w.empty:new w(r,n,o,i)},w.fromWindow=function(e){return new w(0,0,e.innerWidth,e.innerHeight)},w.prototype.inflate=function(e){this.left-=e,this.top-=e,this.right+=e,this.bottom+=e},w.prototype.intersectsWith=function(e){return e.left<this.right&&this.left<e.right&&e.top<this.bottom&&this.top<e.bottom},w.prototype.getIntersectionWith=function(e){var t=Math.max(this.left,e.left),r=Math.max(this.top,e.top),n=Math.min(this.right,e.right),o=Math.min(this.bottom,e.bottom);return t<=n&&r<=o?new w(t,r,n,o):w.empty},w.empty=new w(0,0,0,0),w);function w(e,t,r,n){this.left=e,this.top=t,this.right=r,this.bottom=n}var E=new WeakMap;function L(n){if(!n||"function"!=typeof n.addEventListener)return l()&&console.warn("`addEventListener` on "+n+" (scrollTarget) is not a function. Skipping this target"),s.empty();if(E.has(n))return E.get(n);var e=function r(e,t){return e.pipe(o.sampleTime(100,t),o.share(),o.startWith(""))}(s.Observable.create(function(t){function e(e){return t.next(e)}var r={passive:!0,capture:!1};return n.addEventListener("scroll",e,r),function(){return n.removeEventListener("scroll",e,r)}}));return E.set(n,e),e}var j=Object.assign({},I,{isVisible:function(e,t){var r=e.element,n=e.offset,o=e.scrollContainer;void 0===t&&(t=function(){return window});var i=O.fromElement(r);if(i===O.empty)return!1;var s=O.fromWindow(t());if(i.inflate(n),o){var a=O.fromElement(o).getIntersectionWith(s);return i.intersectsWith(a)}return i.intersectsWith(s)},getObservable:function(e){return e.scrollObservable?e.scrollObservable.pipe(o.startWith("")):e.scrollContainer?L(e.scrollContainer):L(l()?window:undefined)}});var C=(x.prototype.ngOnChanges=function(){this.propertyChanges$.next({element:this.elementRef.nativeElement,imagePath:this.lazyImage,defaultImagePath:this.defaultImage,errorImagePath:this.errorImage,useSrcset:this.useSrcset,offset:0|this.offset,scrollContainer:this.scrollTarget,scrollObservable:this.scrollObservable})},x.prototype.ngAfterContentInit=function(){var t=this;if(r.isPlatformServer(this.platformId))return this.scrollSubscription=this.propertyChanges$.pipe(o.tap(function(e){return t.hooks.setup(e)}),o.first()).subscribe(),null;this.ngZone.runOutsideAngular(function(){t.scrollSubscription=t.propertyChanges$.pipe(o.tap(function(e){return t.hooks.setup(e)}),o.switchMap(function(e){return t.hooks.getObservable(e).pipe(function n(t,r){return function(e){return e.pipe(o.filter(function(e){return t.isVisible({element:r.element,event:e,offset:r.offset,scrollContainer:r.scrollContainer})}),o.take(1),o.mergeMap(function(){return t.loadImage(r)}),o.tap(function(e){return t.setLoadedImage({element:r.element,imagePath:e,useSrcset:r.useSrcset})}),o.map(function(){return!0}),o.catchError(function(){return t.setErrorImage(r),s.of(!1)}),o.tap(function(){return t["finally"](r)}))}}(t.hooks,e))})).subscribe(function(e){return t.onLoad.emit(e)})})},x.prototype.ngOnDestroy=function(){[this.scrollSubscription].filter(function(e){return e&&!e.isUnsubscribed}).forEach(function(e){return e.unsubscribe()})},x.decorators=[{type:i.Directive,args:[{selector:"[lazyLoad]"}]}],x.ctorParameters=function(){return[{type:i.ElementRef},{type:i.NgZone},{type:Object,decorators:[{type:i.Inject,args:[i.PLATFORM_ID]}]},{type:undefined,decorators:[{type:i.Optional},{type:i.Inject,args:["options"]}]}]},x.propDecorators={lazyImage:[{type:i.Input,args:["lazyLoad"]}],defaultImage:[{type:i.Input}],errorImage:[{type:i.Input}],scrollTarget:[{type:i.Input}],scrollObservable:[{type:i.Input}],offset:[{type:i.Input}],useSrcset:[{type:i.Input}],onLoad:[{type:i.Output}]},x);function x(e,t,r,n){this.platformId=r,this.onLoad=new i.EventEmitter,this.elementRef=e,this.ngZone=t,this.propertyChanges$=new s.ReplaySubject,this.hooks=function o(t){if(!t)return j;var r={};return t.preset?Object.assign(r,t.preset):Object.assign(r,j),Object.keys(t).filter(function(e){return"preset"!==e}).forEach(function(e){r[e]=t[e]}),r}(n)}var S=(z.forRoot=function(e){return{ngModule:z,providers:[{provide:"options",useValue:e}]}},z.decorators=[{type:i.NgModule,args:[{declarations:[C],exports:[C]}]}],z);function z(){}var M=new WeakMap,N=new s.Subject;function P(e){e.forEach(function(e){return N.next(e)})}function W(r){if(!r.scrollContainer&&!l())return s.empty();var e={root:r.scrollContainer};r.offset&&(e.rootMargin=r.offset+"px");var t=r.scrollContainer||window,n=M.get(t);return n||(n=new IntersectionObserver(P,e),M.set(t,n)),n.observe(r.element),s.Observable.create(function(e){var t=N.pipe(o.filter(function(e){return e.target===r.element})).subscribe(e);return function(){t.unsubscribe(),n.unobserve(r.element)}})}var k=Object.assign({},I,{isVisible:function(e){return e.event.isIntersecting},getObservable:function(e,t){return void 0===t&&(t=W),e.scrollObservable?e.scrollObservable:t(e)}});e.LazyLoadImageDirective=C,e.LazyLoadImageModule=S,e.intersectionObserverPreset=k,e.scrollPreset=j,e["default"]=S,Object.defineProperty(e,"__esModule",{value:!0})});
//# sourceMappingURL=ng-lazyload-image-angular-universal.umd.min.js.map