Qortal/qortal-ui
4
1
Fork 4
mirror of https://github.com/Qortal/qortal-ui.git synced 2025-02-11 17:55:51 +00:00
Code Issues Projects Releases Wiki Activity

use new observer

Browse Source
This commit is contained in:
PhilReact 2023-09-03 19:36:58 -07:00
parent adfe69cce3
commit 8de559c955
1 changed files with 24 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
plugins/plugins/core/components/ChatScroller.js
View File

@ -211,6 +211,7 @@ class ChatScroller extends LitElement {
this.messages = []
this._upObserverhandler = this._upObserverhandler.bind(this)
this._downObserverHandler = this._downObserverHandler.bind(this)
this.__bottomObserverForFetchingMessagesHandler = this.__bottomObserverForFetchingMessagesHandler.bind(this)
this.myAddress = window.parent.reduxStore.getState().app.selectedAddress.address
this.hideMessages = JSON.parse(localStorage.getItem("MessageBlockedAddresses") || "[]")
this.openTipUser = false
@ -304,8 +305,9 @@ class ChatScroller extends LitElement {
</message-template>`
)
})}
<div style=${"height: 1px; margin-top: -100px"} id='bottomObserverForFetchingMessages'></div>
<div style=${"height: 1px;"} id='downObserver'></div>
<!-- <div style=${"height: 1px; margin-top: -100px"} id='bottomObserverForFetchingMessages'></div> -->
</ul>
`
@ -369,9 +371,11 @@ class ChatScroller extends LitElement {
this.viewElement = this.shadowRoot.getElementById('viewElement')
this.upObserverElement = this.shadowRoot.getElementById('upObserver')
this.downObserverElement = this.shadowRoot.getElementById('downObserver')
this.bottomObserverForFetchingMessages = this.shadowRoot.getElementById('bottomObserverForFetchingMessages')
// Intialize Observers
this.upElementObserver()
this.downElementObserver()
this.bottomObserver()
await this.getUpdateComplete()
this.viewElement.scrollTop = this.viewElement.scrollHeight + 50
@ -425,8 +429,14 @@ class ChatScroller extends LitElement {
if (!entries[0].isIntersecting) {
this.showLastMessageRefScroller(true)
} else {
let _scrollElement = entries[0].target.previousElementSibling
this.showLastMessageRefScroller(false)
}
}
__bottomObserverForFetchingMessagesHandler(entries){
if (!entries[0].isIntersecting) {
} else {
let _scrollElement = entries[0].target.previousElementSibling
this._getAfterMessages(_scrollElement)
}
}
@ -453,6 +463,18 @@ class ChatScroller extends LitElement {
// passing it the element to observe, and the options object
observer.observe(elementToObserve)
}
bottomObserver() {
const options = {
}
// identify an element to observe
const elementToObserve = this.bottomObserverForFetchingMessages
// passing it a callback function
const observer = new IntersectionObserver(this.__bottomObserverForFetchingMessagesHandler, options)
// call `observe()` on that MutationObserver instance,
// passing it the element to observe, and the options object
observer.observe(elementToObserve)
}
}
window.customElements.define('chat-scroller', ChatScroller)