small hotfix for scrolling - not the correct PR , but better than forgetting to fixing it

This commit is contained in:
dj2ls 2022-09-05 14:03:10 +02:00
parent 863444c010
commit 902cf50a21
2 changed files with 17 additions and 16 deletions

View file

@ -187,7 +187,6 @@ window.addEventListener('DOMContentLoaded', () => {
}) })
// NEW CHAT // NEW CHAT
document.getElementById("createNewChatButton").addEventListener("click", () => { document.getElementById("createNewChatButton").addEventListener("click", () => {
var dxcallsign = document.getElementById('chatModuleNewDxCall').value; var dxcallsign = document.getElementById('chatModuleNewDxCall').value;
@ -277,9 +276,6 @@ db.post({
update_chat_obj_by_uuid(uuid); update_chat_obj_by_uuid(uuid);
// scroll to bottom
var element = document.getElementById("message-container");
element.scrollTo(0, element.scrollHeight);
// clear input // clear input
document.getElementById('chatModuleMessage').value = '' document.getElementById('chatModuleMessage').value = ''
@ -521,10 +517,10 @@ update_chat = function(obj) {
//document.getElementById('chatModuleDxCall').value = dxcallsign; //document.getElementById('chatModuleDxCall').value = dxcallsign;
selected_callsign = dxcallsign; selected_callsign = dxcallsign;
// scroll to bottom
var element = document.getElementById("message-container"); setTimeout(scrollMessagesToBottom, 200);
//console.log(element.scrollHeight)
element.scrollTo(0, element.scrollHeight);
}); });
@ -662,9 +658,6 @@ update_chat = function(obj) {
// CHECK CHECK CHECK --> This could be done better // CHECK CHECK CHECK --> This could be done better
var id = "chat-" + obj.dxcallsign var id = "chat-" + obj.dxcallsign
document.getElementById(id).insertAdjacentHTML("beforeend", new_message); document.getElementById(id).insertAdjacentHTML("beforeend", new_message);
//var element = document.getElementById("message-container");
//console.log(element.scrollHeight)
/* UPDATE EXISTING ELEMENTS */ /* UPDATE EXISTING ELEMENTS */
} else if (document.getElementById('msg-' + obj._id)) { } else if (document.getElementById('msg-' + obj._id)) {
@ -730,9 +723,6 @@ update_chat = function(obj) {
// handle doc // handle doc
console.log(doc) console.log(doc)
var filename = Object.keys(obj._attachments)[0] var filename = Object.keys(obj._attachments)[0]
var filetype = filename.content_type var filetype = filename.content_type
@ -774,6 +764,10 @@ update_chat = function(obj) {
} }
//window.location = window.location //window.location = window.location
// scroll to bottom on new message
scrollMessagesToBottom();
} }
@ -869,4 +863,11 @@ add_obj_to_database = function(obj){
}).catch(function(err) { }).catch(function(err) {
console.log(err); console.log(err);
}); });
}
// Scroll to bottom of message-container
function scrollMessagesToBottom() {
var messageBody = document.getElementById('message-container');
messageBody.scrollTop = messageBody.scrollHeight - messageBody.clientHeight;
} }

View file

@ -28,7 +28,7 @@
</div> </div>
<div class="container-fluid"> <div class="container-fluid">
<div class="row h-100"> <div class="row h-100">
<div class="col-3 p-2 bg-light"> <div class="col-4 p-2 bg-light">
<! ------Chats area ----------------------------------------------------------------------> <! ------Chats area ---------------------------------------------------------------------->
<div class="container-fluid m-0 p-0"> <div class="container-fluid m-0 p-0">
<div class="input-group bottom-0 m-0 w-100"> <div class="input-group bottom-0 m-0 w-100">
@ -41,7 +41,7 @@
<div class="list-group" id="list-tab" role="tablist"> </div> <div class="list-group" id="list-tab" role="tablist"> </div>
</div> </div>
</div> </div>
<div class="col-9 border vh-100 p-0"> <div class="col-8 border vh-100 p-0">
<! ------ chat navbar ----------------------------------------------------------------------> <! ------ chat navbar ---------------------------------------------------------------------->
<div class="container-fluid m-2 p-0"> <div class="container-fluid m-2 p-0">
<div class="input-group bottom-0"> <div class="input-group bottom-0">