2018-04-09 11:44:02 +00:00
|
|
|
import Diff from "./Diff"
|
|
|
|
|
2018-04-02 05:34:16 +00:00
|
|
|
export default class InfiniteScroller {
|
2017-10-16 10:56:46 +00:00
|
|
|
container: HTMLElement
|
|
|
|
threshold: number
|
|
|
|
|
|
|
|
constructor(container, threshold) {
|
|
|
|
this.container = container
|
|
|
|
this.threshold = threshold
|
|
|
|
|
2018-04-09 11:44:02 +00:00
|
|
|
let check = () => {
|
2017-10-16 10:56:46 +00:00
|
|
|
if(this.container.scrollTop + this.container.clientHeight >= this.container.scrollHeight - threshold) {
|
|
|
|
this.loadMore()
|
|
|
|
}
|
2018-04-09 11:44:02 +00:00
|
|
|
}
|
|
|
|
|
2019-04-22 09:06:50 +00:00
|
|
|
this.container.addEventListener("scroll", _ => {
|
2018-04-09 11:44:02 +00:00
|
|
|
// Wait for mutations to finish before checking if we need infinite scroll to trigger.
|
|
|
|
if(Diff.mutations.mutations.length > 0) {
|
|
|
|
Diff.mutations.wait(() => check())
|
|
|
|
return
|
|
|
|
}
|
|
|
|
|
2018-11-16 13:23:49 +00:00
|
|
|
// Otherwise, queue up the check immediately.
|
|
|
|
// Don't call check() directly to make scrolling as smooth as possible.
|
|
|
|
Diff.mutations.queue(check)
|
2017-10-16 10:56:46 +00:00
|
|
|
})
|
|
|
|
}
|
|
|
|
|
|
|
|
loadMore() {
|
|
|
|
let button = document.getElementById("load-more-button")
|
|
|
|
|
|
|
|
if(!button) {
|
|
|
|
return
|
|
|
|
}
|
|
|
|
|
|
|
|
button.click()
|
|
|
|
}
|
|
|
|
}
|