import { fromEvent, Observable, Subscription } from 'rxjs'
import { distinctUntilChanged, filter, map, share, startWith, throttleTime } from 'rxjs/operators'
-import { AfterContentChecked, Directive, ElementRef, EventEmitter, Input, OnDestroy, OnInit, Output } from '@angular/core'
+import { AfterViewChecked, Directive, ElementRef, EventEmitter, Input, OnDestroy, OnInit, Output } from '@angular/core'
+import { PeerTubeRouterService, RouterSetting } from '@app/core'
@Directive({
selector: '[myInfiniteScroller]'
})
-export class InfiniteScrollerDirective implements OnInit, OnDestroy, AfterContentChecked {
+export class InfiniteScrollerDirective implements OnInit, OnDestroy, AfterViewChecked {
@Input() percentLimit = 70
- @Input() autoInit = false
@Input() onItself = false
@Input() dataObservable: Observable<any[]>
+ // Add angular state in query params to reuse the routed component
+ @Input() setAngularState: boolean
+ @Input() parentDisabled = false
+
@Output() nearOfBottom = new EventEmitter<void>()
private decimalLimit = 0
private checkScroll = false
- constructor (private el: ElementRef) {
+ constructor (
+ private peertubeRouter: PeerTubeRouterService,
+ private el: ElementRef
+ ) {
this.decimalLimit = this.percentLimit / 100
}
- ngAfterContentChecked () {
+ ngAfterViewChecked () {
if (this.checkScroll) {
this.checkScroll = false
- console.log('Checking if the initial state has a scroll.')
-
- if (this.hasScroll() === false) this.nearOfBottom.emit()
+ // Wait HTML update
+ setTimeout(() => {
+ if (this.hasScroll() === false) this.nearOfBottom.emit()
+ })
}
}
ngOnInit () {
- if (this.autoInit === true) return this.initialize()
+ this.initialize()
}
ngOnDestroy () {
filter(({ current }) => this.isScrollingDown(current)),
filter(({ current, maximumScroll }) => (current / maximumScroll) > this.decimalLimit)
)
- .subscribe(() => this.nearOfBottom.emit())
+ .subscribe(() => {
+ if (this.setAngularState && !this.parentDisabled) this.setScrollRouteParams()
+
+ this.nearOfBottom.emit()
+ })
if (this.dataObservable) {
this.dataObservable
this.lastCurrentBottom = current
return result
}
+
+ private setScrollRouteParams () {
+ this.peertubeRouter.addRouteSetting(RouterSetting.REUSE_COMPONENT)
+ }
}