Nemcio/NodeBB
1
0
Fork 0
mirror of https://github.com/NodeBB/NodeBB.git synced 2026-02-21 14:07:42 +01:00
Code Issues Packages Projects Releases Wiki Activity

use visualViewport if it exists

Browse Source 
to detecth mobile keyboard open and scroll to bottom of chat list if we are near, this keeps the message list at the bottom when you open the keyboard on mobile
This commit is contained in:
Barış Soner Uşaklı
2026-02-18 13:36:54 -05:00
parent 2dc83bbd96
commit effdbc4d95
2 changed files with 27 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

34
public/src/client/chats.js
View File

@@ -32,6 +32,8 @@ define('forum/chats', [
let chatNavWrapper = null;
let isAtBottom = true;
$(window).on('action:ajaxify.start', function () {
Chats.destroyAutoComplete(ajaxify.data.roomId);
if (ajaxify.data.template.chats) {
@@ -90,7 +92,10 @@ define('forum/chats', [
const mainWrapper = $('[component="chat/main-wrapper"]');
const chatMessageContent = $('[component="chat/message/content"]');
const chatControls = components.get('chat/controls');
Chats.addSendHandlers(roomId, $('.chat-input'), $('.expanded-chat button[data-action="send"]'));
const chatInput = $('[component="chat/input"]');
Chats.addSendHandlers(roomId, chatInput, $('.expanded-chat button[data-action="send"]'));
Chats.addMobileResizeHandler(chatMessageContent);
Chats.addPopoutHandler();
Chats.addActionHandlers(components.get('chat/message/window'), roomId);
Chats.addManageHandler(roomId, chatControls.find('[data-action="manage"]'));
@@ -105,18 +110,16 @@ define('forum/chats', [
Chats.addTypingHandler(mainWrapper, roomId);
Chats.addIPHandler(mainWrapper);
Chats.addCopyTextLinkHandler(mainWrapper);
Chats.createAutoComplete(roomId, $('[component="chat/input"]'));
Chats.createAutoComplete(roomId, chatInput);
Chats.addUploadHandler({
dragDropAreaEl: $('.chats-full'),
pasteEl: $('[component="chat/input"]'),
pasteEl: chatInput,
uploadFormEl: $('[component="chat/upload"]'),
uploadBtnEl: $('[component="chat/upload/button"]'),
inputEl: $('[component="chat/input"]'),
inputEl: chatInput,
});
$('[data-action="close"]').on('click', function () {
Chats.switchChat();
});
$('[data-action="close"]').on('click', () => Chats.switchChat());
userList.init(roomId, mainWrapper);
Chats.addNotificationSettingHandler(roomId, mainWrapper);
messageSearch.init(roomId, mainWrapper);
@@ -295,7 +298,12 @@ define('forum/chats', [
let loading = false;
let previousScrollTop = el.scrollTop();
let currentScrollTop = previousScrollTop;
el.off('scroll').on('scroll', utils.debounce(async function () {
el.off('scroll');
el.on('scroll', function () {
isAtBottom = messages.isAtBottom(el);
});
el.on('scroll', utils.debounce(async function () {
if (parseInt(el.attr('data-ignore-next-scroll'), 10) === 1) {
el.removeAttr('data-ignore-next-scroll');
previousScrollTop = el.scrollTop();
@@ -546,6 +554,16 @@ define('forum/chats', [
});
};
Chats.addMobileResizeHandler = function (chatMessageContent) {
if (utils.isMobile() && window.visualViewport) {
window.visualViewport.addEventListener('resize', function () {
if (isAtBottom) {
messages.scrollToBottom(chatMessageContent);
}
});
}
};
Chats.createAutoComplete = function (roomId, element, options = {}) {
if (!element.length) {
return;

2
public/src/modules/chat.js
View File

@@ -20,7 +20,7 @@ define('chat', [
roomId: roomId,
uid: uid,
}).then((hookData) => {
if (!hookData.modal) {
if (!hookData.modal || utils.isMobile()) {
return ajaxify.go(`/chats/${roomId}`);
}
if (Chat.modalExists(roomId)) {