chat2web frontend: fortify autoscroll code

so that it hopefully works across all devices.. scrolling needs another
look or ten in the javascript spec, seriously
This commit is contained in:
Ennea
2024-08-28 17:22:13 +02:00
parent d309030def
commit 0023988ada
+20 -3
View File
@@ -48,7 +48,7 @@
// adjust scroll when the window size changes; mostly for mobile (opening/closing the keyboard)
window.addEventListener('resize', () => {
if (this.scrolledToBottom) {
this.elements.messagesList.lastChild.scrollIntoView();
this.scrollMessagesToBottom();
}
})
@@ -98,11 +98,28 @@
}
messagesAreScrolledToBottom() {
if (this.elements.messagesContainer.scrollTopMax) {
this.scrolledToBottom = this.elements.messagesContainer.scrollTop === this.elements.messagesContainer.scrollTopMax;
} else {
this.scrolledToBottom =
this.elements.messagesContainer.scrollTop >= this.elements.messagesContainer.scrollHeight - this.elements.messagesContainer.offsetHeight;
(
this.elements.messagesContainer.scrollHeight -
this.elements.messagesContainer.clientHeight -
this.elements.messagesContainer.scrollTop
) < 1;
}
return this.scrolledToBottom;
}
scrollMessagesToBottom() {
if (this.elements.messagesContainer.scrollTopMax) {
this.elements.messagesContainer.scrollTop = this.elements.messagesContainer.scrollTopMax;
} else {
this.elements.messagesList.lastChild.scrollIntoView();
}
}
addMessage(messageData) {
const scrolledToBottom = this.messagesAreScrolledToBottom();
this.calculateTimestampWidth(messageData.timestamp);
@@ -121,7 +138,7 @@
this.elements.messagesList.appendChild(liMessage);
if (scrolledToBottom) {
liMessage.scrollIntoView();
this.scrollMessagesToBottom();
}
}