ngx-infinite-scroller
Version:
Infinite bidirectional scroll directive for Angular 11
16 lines (14 loc) • 12.7 kB
JavaScript
!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("@angular/core"),require("@angular/common"),require("rxjs"),require("rxjs/operators"),require("is-number")):"function"==typeof define&&define.amd?define("ngx-infinite-scroller",["exports","@angular/core","@angular/common","rxjs","rxjs/operators","is-number"],e):e((t="undefined"!=typeof globalThis?globalThis:t||self)["ngx-infinite-scroller"]={},t.ng.core,t.ng.common,t.rxjs,t.rxjs.operators,t.isNumber)}(this,(function(t,e,o,r,i,n){"use strict";function l(t){return t&&"object"==typeof t&&"default"in t?t:{default:t}}var s=l(n),c=function(t,e){return(c=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(t,e){t.__proto__=e}||function(t,e){for(var o in e)Object.prototype.hasOwnProperty.call(e,o)&&(t[o]=e[o])})(t,e)};
/*! *****************************************************************************
Copyright (c) Microsoft Corporation.
Permission to use, copy, modify, and/or distribute this software for any
purpose with or without fee is hereby granted.
THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
PERFORMANCE OF THIS SOFTWARE.
***************************************************************************** */function p(t,e){function o(){this.constructor=t}c(t,e),t.prototype=null===e?Object.create(e):(o.prototype=e.prototype,new o)}Object.create;Object.create;var u,a=function(){function t(){}return Object.defineProperty(t.prototype,"scrollTop",{get:function(){return this._el.nativeElement.scrollTop},enumerable:!1,configurable:!0}),Object.defineProperty(t.prototype,"scrollHeight",{get:function(){return this._el.nativeElement.scrollHeight},enumerable:!1,configurable:!0}),Object.defineProperty(t.prototype,"clientHeight",{get:function(){return this._el.nativeElement.clientHeight},enumerable:!1,configurable:!0}),Object.defineProperty(t.prototype,"initMode",{get:function(){return this._initMode},set:function(t){this._initMode=t},enumerable:!1,configurable:!0}),Object.defineProperty(t.prototype,"scrollStreamActive",{get:function(){return this._scrollStreamActive},set:function(t){this._scrollStreamActive=t},enumerable:!1,configurable:!0}),Object.defineProperty(t.prototype,"previousScrollPositionpUpdated",{get:function(){return this._previousScrollPositionpUpdated},set:function(t){this._previousScrollPositionpUpdated=t},enumerable:!1,configurable:!0}),Object.defineProperty(t.prototype,"previousScrollTop",{get:function(){return this._previousScrollTop},enumerable:!1,configurable:!0}),Object.defineProperty(t.prototype,"previousScrollHeight",{get:function(){return this._previousScrollHeight},enumerable:!1,configurable:!0}),t.prototype.setup=function(t){this._el=t.el,this._initMode=t.initMode,this._scrollStreamActive=t.scrollStreamActive,this._previousScrollPositionpUpdated=t.previousScrollPositionpUpdated,this.updatePreviousScrollTop(),this.updatePreviousScrollHeight()},t.prototype.updatePreviousScrollTop=function(){this._previousScrollTop=this._el.nativeElement.scrollTop},t.prototype.updatePreviousScrollHeight=function(){this._previousScrollHeight=this._el.nativeElement.scrollHeight},t}();a.decorators=[{type:e.Injectable}],function(t){t.DEFAULT="DEFAULT",t.TOP="TOP",t.MIDDLE="MIDDLE",t.BOTTOM="BOTTOM"}(u||(u={}));var h=function(){},g=function(){function t(t,e){this.directive=t,this.state=e}return t.prototype.wasScrolledDown=function(t,e){return t.scrollTop<e.scrollTop},t.prototype.wasScrolledUp=function(t,e){return!this.wasScrolledDown(t,e)},t.prototype.isScrollDownEnough=function(t,e){return(t.scrollTop+t.clientHeight)/t.scrollHeight>e/100},t.prototype.isScrollUpEnough=function(t,e){return t.scrollTop/t.scrollHeight<e/100},t.prototype.getInitialScrollPositionValue=function(t){var e=this.directive.initialScrollPosition;if(s.default(e))return Number(e);var o=this.getInitialScrollPositions();return e===u.DEFAULT?o[t]:o[e]},t.prototype.getInitialScrollPositions=function(){var t,e=this.state,o=e.scrollHeight,r=e.clientHeight;return(t={})[u.TOP]=0,t[u.MIDDLE]=o/2-r/2,t[u.BOTTOM]=o,t},t}(),f=function(t){function e(e,o){return t.call(this,e,o)||this}return p(e,t),e.prototype.scrollDirectionChanged=function(e){var o=this;return e.pipe(i.filter((function(e){return t.prototype.wasScrolledUp.call(o,e[0],e[1])})))},e.prototype.scrollRequestZoneChanged=function(e){var o=this;return e.pipe(i.filter((function(e){return t.prototype.isScrollUpEnough.call(o,e[1],o.directive.scrollUpPercentilePositionTrigger)})))},e.prototype.askForUpdate=function(){this.directive.onScrollUp.next()},e.prototype.setInitialScrollPosition=function(){var e=t.prototype.getInitialScrollPositionValue.call(this,u.BOTTOM);this.directive.scrollTo(e)},e.prototype.setPreviousScrollPosition=function(){var t=this.state.previousScrollTop+(this.state.scrollHeight-this.state.previousScrollHeight);this.directive.scrollTo(t)},e}(g),d=function(t){function e(e,o){return t.call(this,e,o)||this}return p(e,t),e.prototype.scrollDirectionChanged=function(e){var o=this;return e.pipe(i.filter((function(e){return t.prototype.wasScrolledDown.call(o,e[0],e[1])})))},e.prototype.scrollRequestZoneChanged=function(e){var o=this;return e.pipe(i.filter((function(e){return t.prototype.isScrollDownEnough.call(o,e[1],o.directive.scrollDownPercentilePositionTrigger)})))},e.prototype.askForUpdate=function(){this.directive.onScrollDown.next()},e.prototype.setInitialScrollPosition=function(){var e=t.prototype.getInitialScrollPositionValue.call(this,u.TOP);this.directive.scrollTo(e)},e.prototype.setPreviousScrollPosition=function(){var t=this.state.previousScrollTop;this.directive.scrollTo(t)},e}(g),y=function(t){function e(e,o){return t.call(this,e,o)||this}return p(e,t),e.prototype.scrollDirectionChanged=function(t){return t},e.prototype.scrollRequestZoneChanged=function(e){var o=this;return e.pipe(i.filter((function(e){return t.prototype.isScrollUpEnough.call(o,e[1],o.directive.scrollUpPercentilePositionTrigger)||t.prototype.isScrollDownEnough.call(o,e[1],o.directive.scrollDownPercentilePositionTrigger)})),i.tap((function(e){o.scrolledUp=t.prototype.wasScrolledUp.call(o,e[0],e[1])})))},e.prototype.askForUpdate=function(){this.scrolledUp?this.directive.onScrollUp.next():this.directive.onScrollDown.next()},e.prototype.setInitialScrollPosition=function(){var e=t.prototype.getInitialScrollPositionValue.call(this,u.MIDDLE);this.directive.scrollTo(e)},e.prototype.setPreviousScrollPosition=function(){var t;t=this.scrolledUp?this.state.previousScrollTop+(this.state.scrollHeight-this.state.previousScrollHeight):this.state.previousScrollTop,this.directive.scrollTo(t)},e}(g),v=function(){function t(t,e){this.directive=t,this.state=e,this.DEFAULT_REQUEST_TIMEOUT=3e4}return t.prototype.start=function(){var t=this;this.listener=window.requestAnimationFrame(this.listen.bind(this)),this.httpRequestTimeout||(this.httpRequestTimeout=setTimeout((function(){t.stopIfRequestTimeout()}),this.DEFAULT_REQUEST_TIMEOUT))},t.prototype.stop=function(){window.cancelAnimationFrame(this.listener),clearTimeout(this.httpRequestTimeout),this.httpRequestTimeout=null},t.prototype.listen=function(){this.state.previousScrollHeight!==this.state.scrollHeight?(this.stop(),this.directive.onScrollbarHeightChanged()):this.start()},t.prototype.stopIfRequestTimeout=function(){this.state.previousScrollPositionpUpdated||this.stop()},t}(),S=function(t){function n(i,n,l,s){var c=t.call(this)||this;return c.platformId=i,c.el=n,c.renderer=l,c.state=s,c.strategy="scrollingToBottom",c.initialScrollPosition=u.DEFAULT,c.scrollbarAnimationInterval=100,c.scrollDebounceTimeAfterScrollHeightChanged=50,c.scrollDebounceTimeAfterDOMMutationOnInit=1e3,c.scrollUpPercentilePositionTrigger=2,c.scrollDownPercentilePositionTrigger=98,c.onScrollUp=new e.EventEmitter,c.onScrollDown=new e.EventEmitter,c.scrollHeightChanged=new r.Subject,c.domMutationEmitter=new r.Subject,c.isBrowser=o.isPlatformBrowser(i),c.state.setup({el:n,initMode:!0,scrollStreamActive:!0,previousScrollPositionpUpdated:!1}),c}return p(n,t),Object.defineProperty(n.prototype,"scrollPairChanged",{get:function(){var t=this;if(this.scrollChanged)return this.scrollChanged.pipe(i.takeWhile((function(){return t.state.scrollStreamActive})),i.map((function(t){return{scrollHeight:t.target.scrollHeight,scrollTop:t.target.scrollTop,clientHeight:t.target.clientHeight}})),i.pairwise(),i.debounceTime(this.scrollbarAnimationInterval))},enumerable:!1,configurable:!0}),Object.defineProperty(n.prototype,"scrollDirectionChanged",{get:function(){return this.scrollingStrategy.scrollDirectionChanged(this.scrollPairChanged)},enumerable:!1,configurable:!0}),Object.defineProperty(n.prototype,"scrollRequestZoneChanged",{get:function(){var t=this;return this.scrollingStrategy.scrollRequestZoneChanged(this.scrollDirectionChanged).pipe(i.tap((function(){t.state.updatePreviousScrollTop(),t.state.updatePreviousScrollHeight(),t.state.previousScrollPositionpUpdated=!1,t.scrollHeightListener.start()})))},enumerable:!1,configurable:!0}),n.prototype.ngOnInit=function(){this.useStrategy(),this.useScrollHeightListener(),this.registerScrollEventHandler(),this.registerMutationObserver(),this.registerInitialScrollPostionHandler(),this.registerPreviousScrollPositionHandler()},n.prototype.ngAfterViewInit=function(){this.registerScrollSpy()},n.prototype.ngOnDestroy=function(){this.unregisterMutationObserver()},n.prototype.scrollTo=function(t){this.state.scrollStreamActive=!1,this.renderer.setProperty(this.el.nativeElement,"scrollTop",t),this.state.scrollStreamActive=!0},n.prototype.onScrollbarHeightChanged=function(){this.scrollHeightChanged.next()},n.prototype.registerScrollEventHandler=function(){this.scrollChanged=r.fromEvent(this.el.nativeElement,"scroll")},n.prototype.registerMutationObserver=function(){var t=this;if(this.isBrowser){this.domMutationObserver=new MutationObserver((function(e){t.domMutationEmitter.next(e)}));this.domMutationObserver.observe(this.el.nativeElement,{attributes:!0,childList:!0,characterData:!0})}},n.prototype.registerInitialScrollPostionHandler=function(){var t=this;this.domMutationEmitter.pipe(i.takeWhile((function(){return t.state.initMode})),i.debounceTime(this.scrollDebounceTimeAfterDOMMutationOnInit)).subscribe((function(){t.scrollingStrategy.setInitialScrollPosition(),t.state.initMode=!1}))},n.prototype.registerPreviousScrollPositionHandler=function(){var t=this;r.zip(this.scrollRequestZoneChanged,this.scrollHeightChanged).pipe(i.skipWhile((function(){return t.state.initMode})),i.debounceTime(this.scrollDebounceTimeAfterScrollHeightChanged)).subscribe((function(){t.scrollingStrategy.setPreviousScrollPosition(),t.state.previousScrollPositionpUpdated=!0}))},n.prototype.registerScrollSpy=function(){var t=this;this.scrollRequestZoneChanged.subscribe((function(){t.scrollingStrategy.askForUpdate()}))},n.prototype.unregisterMutationObserver=function(){this.domMutationObserver&&this.domMutationObserver.disconnect()},n.prototype.useStrategy=function(){switch(this.strategy){case"scrollingToBoth":this.scrollingStrategy=new y(this,this.state);break;case"scrollingToTop":this.scrollingStrategy=new f(this,this.state);break;case"scrollingToBottom":default:this.scrollingStrategy=new d(this,this.state)}},n.prototype.useScrollHeightListener=function(){this.scrollHeightListener=new v(this,this.state)},n}(h);S.decorators=[{type:e.Directive,args:[{selector:"[ngxInfiniteScroller]"}]}],S.ctorParameters=function(){return[{type:void 0,decorators:[{type:e.Inject,args:[e.PLATFORM_ID]}]},{type:e.ElementRef},{type:e.Renderer2},{type:a}]},S.propDecorators={strategy:[{type:e.Input}],initialScrollPosition:[{type:e.Input}],scrollbarAnimationInterval:[{type:e.Input}],scrollDebounceTimeAfterScrollHeightChanged:[{type:e.Input}],scrollDebounceTimeAfterDOMMutationOnInit:[{type:e.Input}],scrollUpPercentilePositionTrigger:[{type:e.Input}],scrollDownPercentilePositionTrigger:[{type:e.Input}],onScrollUp:[{type:e.Output}],onScrollDown:[{type:e.Output}]};var b=function(){};b.decorators=[{type:e.NgModule,args:[{declarations:[S],imports:[],exports:[S],providers:[a],bootstrap:[]}]}],t.NgxInfiniteScrollerModule=b,t.ɵa=S,t.ɵb=h,t.ɵc=a,Object.defineProperty(t,"__esModule",{value:!0})}));
//# sourceMappingURL=ngx-infinite-scroller.umd.min.js.map