LogalDeveloper/owncast
0
Fork 0
Code Activity

Increase do not autoscroll buffer to fix chat not scrolling to bottom. Fixes #1324

Browse Source
This commit is contained in:
Gabe Kangas
2021-08-29 16:58:37 -07:00
parent d522e41d5c
commit 4a34ccde05
2 changed files with 3 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
webroot/js/components/chat/chat.js
View File

@@ -8,7 +8,6 @@ import { CALLBACKS, SOCKET_MESSAGE_TYPES } from '../../utils/websocket.js';
import { import {
jumpToBottom, jumpToBottom,
debounce, debounce,
setLocalStorage,
} from '../../utils/helpers.js'; } from '../../utils/helpers.js';
import { extraUserNamesFromMessageHistory } from '../../utils/chat.js'; import { extraUserNamesFromMessageHistory } from '../../utils/chat.js';
import { import {
@@ -295,6 +294,7 @@ export default class Chat extends Component {
const shouldScroll = const shouldScroll =
scrollHeight >= clientHeight && scrollHeight >= clientHeight &&
fullyScrolled - scrollTop < MESSAGE_JUMPTOBOTTOM_BUFFER; fullyScrolled - scrollTop < MESSAGE_JUMPTOBOTTOM_BUFFER;
return shouldScroll; return shouldScroll;
} }
@@ -315,6 +315,7 @@ export default class Chat extends Component {
// if the messages list grows in number of child message nodes due to new messages received, scroll to bottom. // if the messages list grows in number of child message nodes due to new messages received, scroll to bottom.
messageListCallback(mutations) { messageListCallback(mutations) {
const numMutations = mutations.length; const numMutations = mutations.length;
if (numMutations) { if (numMutations) {
const item = mutations[numMutations - 1]; const item = mutations[numMutations - 1];
if (item.type === 'childList' && item.addedNodes.length) { if (item.type === 'childList' && item.addedNodes.length) {

2
webroot/js/utils/constants.js
View File

@@ -52,7 +52,7 @@ export const CHAT_OK_KEYCODES = [
'Backspace', 'Backspace',
]; ];
export const CHAT_KEY_MODIFIERS = ['Control', 'Shift', 'Meta', 'Alt']; export const CHAT_KEY_MODIFIERS = ['Control', 'Shift', 'Meta', 'Alt'];
export const MESSAGE_JUMPTOBOTTOM_BUFFER = 300; export const MESSAGE_JUMPTOBOTTOM_BUFFER = 500;
// app styling // app styling
export const WIDTH_SINGLE_COL = 730; export const WIDTH_SINGLE_COL = 730;