Adrià Vilanova MartÃnez | a7ae3db | 2022-01-28 11:57:27 +0100 | [diff] [blame] | 1 | import {getOptions, isOptionEnabled} from '../../common/optionsUtils.js'; |
| 2 | |
| 3 | const kInteropLoadMoreClasses = { |
| 4 | 'scTailwindThreadMorebuttonload-all': 'threadall', |
| 5 | 'scTailwindThreadMorebuttonload-more': 'thread', |
| 6 | }; |
| 7 | |
| 8 | export default class InfiniteScroll { |
| 9 | constructor() { |
| 10 | this.intersectionObserver = null; |
| 11 | } |
| 12 | |
| 13 | setUpIntersectionObserver(node, isScrollableContent) { |
| 14 | if (this.intersectionObserver === null) { |
| 15 | var scrollableContent = isScrollableContent ? |
| 16 | node : |
| 17 | node.querySelector('.scrollable-content'); |
| 18 | if (scrollableContent !== null) { |
| 19 | let intersectionOptions = { |
| 20 | root: scrollableContent, |
| 21 | rootMargin: '0px', |
| 22 | threshold: 1.0, |
| 23 | }; |
| 24 | this.intersectionObserver = new IntersectionObserver( |
| 25 | this.intersectionCallback, intersectionOptions); |
| 26 | } |
| 27 | } |
| 28 | } |
| 29 | |
| 30 | intersectionCallback(entries, observer) { |
| 31 | entries.forEach(entry => { |
| 32 | if (entry.isIntersecting) { |
| 33 | console.debug('[infinitescroll] Clicking button: ', entry.target); |
| 34 | entry.target.click(); |
| 35 | } |
| 36 | }); |
| 37 | } |
| 38 | |
| 39 | observeLoadMoreBar(bar) { |
| 40 | if (this.intersectionObserver === null) { |
| 41 | console.warn( |
| 42 | '[infinitescroll] ' + |
| 43 | 'The intersectionObserver is not ready yet.'); |
| 44 | return; |
| 45 | } |
| 46 | |
| 47 | getOptions(['thread', 'threadall']).then(threadOptions => { |
| 48 | if (threadOptions.thread) |
| 49 | this.intersectionObserver.observe( |
| 50 | bar.querySelector('.load-more-button')); |
| 51 | if (threadOptions.threadall) |
| 52 | this.intersectionObserver.observe( |
| 53 | bar.querySelector('.load-all-button')); |
| 54 | }); |
| 55 | } |
| 56 | |
| 57 | observeLoadMoreInteropBtn(btn) { |
| 58 | if (this.intersectionObserver === null) { |
| 59 | console.warn( |
| 60 | '[infinitescroll] ' + |
| 61 | 'The intersectionObserver is not ready yet.'); |
| 62 | return; |
| 63 | } |
| 64 | |
| 65 | let parentClasses = btn.parentNode?.classList; |
| 66 | let feature = null; |
| 67 | for (const [c, f] of Object.entries(kInteropLoadMoreClasses)) { |
| 68 | if (parentClasses?.contains?.(c)) { |
| 69 | feature = f; |
| 70 | break; |
| 71 | } |
| 72 | } |
| 73 | if (feature === null) return; |
| 74 | isOptionEnabled(feature).then(isEnabled => { |
| 75 | if (isEnabled) this.intersectionObserver.observe(btn); |
| 76 | }); |
| 77 | } |
| 78 | }; |