cleaner autoscroll system - may fix mobile webkit issues
This commit is contained in:
parent
17e086769d
commit
e3d6527209
1 changed files with 5 additions and 8 deletions
|
@ -8,7 +8,6 @@
|
|||
|
||||
export let channelId;
|
||||
let scrollTarget;
|
||||
let scrollAnchor;
|
||||
let shouldAutoscroll = true;
|
||||
let lastScrollHeight = null;
|
||||
let isScrolledToBottom = true;
|
||||
|
@ -27,16 +26,16 @@
|
|||
lastScrollHeight = null;
|
||||
return;
|
||||
}
|
||||
if (shouldAutoscroll && scrollAnchor) {
|
||||
if (shouldAutoscroll) {
|
||||
messagesLog("[afterUpdate] performing autoscroll...");
|
||||
scrollAnchor.scrollIntoView(false);
|
||||
scrollTarget.scrollTo(0, scrollTarget.scrollHeight);
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
const onScroll = (e) => {
|
||||
const { scrollHeight, scrollTop, clientHeight } = e.target;
|
||||
if ((scrollHeight - scrollTop - clientHeight) <= 20) { // user scrolled to bottom
|
||||
const { offsetHeight, scrollTop, scrollHeight } = e.target;
|
||||
if ((offsetHeight + scrollTop) > (scrollHeight - 20)) { // user scrolled to bottom
|
||||
messages.setIsCollectingOldMessages(true);
|
||||
shouldAutoscroll = true;
|
||||
isScrolledToBottom = true;
|
||||
|
@ -62,12 +61,11 @@
|
|||
|
||||
const windowDidResize = () => {
|
||||
// TODO: hack
|
||||
// showSidebar is false on small viewports
|
||||
// scrolling to bottom when the virtual keyboard pops up does not work on chromium purely based on isScrolledToBottom for some reason
|
||||
if (isScrolledToBottom || $smallViewport) {
|
||||
messagesLog("[windowDidResize] window resized, queueing microtask to scroll to bottom...");
|
||||
queueMicrotask(() => {
|
||||
scrollAnchor.scrollIntoView(false);
|
||||
scrollTarget.scrollTo(0, scrollTarget.scrollHeight);
|
||||
messagesLog("[windowDidResize] scroll to bottom microtask finished.");
|
||||
});
|
||||
}
|
||||
|
@ -123,5 +121,4 @@
|
|||
{/if}
|
||||
<Message message={message} />
|
||||
{/each}
|
||||
<div bind:this={ scrollAnchor } />
|
||||
</div>
|
||||
|
|
Loading…
Reference in a new issue