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:
@@ -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();
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user