mmarch/text-generation-webui
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Make it possible to scroll during streaming (#3721)

Browse source
This commit is contained in:
oobabooga 2023-08-28 16:03:20 -03:00 • committed by GitHub
parent 7d3a0b5387
commit 57e9ded00c
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 34 additions and 25 deletions
Download patch file Download diff file Expand all files Collapse all files

38
js/main.js
View file

@ -29,16 +29,6 @@ document.querySelector('.header_bar').addEventListener('click', function(event)
}
});
//------------------------------------------------
// Add some scrollbars
//------------------------------------------------
const textareaElements = document.querySelectorAll('.add_scrollbar textarea');
for(i = 0; i < textareaElements.length; i++) {
textareaElements[i].classList.remove('scroll-hide');
textareaElements[i].classList.add('pretty_scrollbar');
textareaElements[i].style.resize = "none";
}
//------------------------------------------------
// Keyboard shortcuts
//------------------------------------------------
@ -72,13 +62,25 @@ document.addEventListener("keydown", function(event) {
// Chat scrolling
//------------------------------------------------
const targetElement = document.getElementById('chat').parentNode.parentNode.parentNode;
targetElement.classList.add('pretty_scrollbar');
targetElement.classList.add('chat-parent');
let isScrolled = false;
targetElement.addEventListener('scroll', function() {
let diff = targetElement.scrollHeight - targetElement.clientHeight;
if(Math.abs(targetElement.scrollTop - diff) <= 1 || diff == 0) {
isScrolled = false;
} else {
isScrolled = true;
}
});
// Create a MutationObserver instance
const observer = new MutationObserver(function(mutations) {
mutations.forEach(function(mutation) {
let nodes = targetElement.childNodes[2].childNodes[0].childNodes;
let childElement = nodes[nodes.length - 1];
childElement.scrollTop = childElement.scrollHeight;
if(!isScrolled) {
targetElement.scrollTop = targetElement.scrollHeight;
}
});
});
@ -94,6 +96,16 @@ const config = {
// Start observing the target element
observer.observe(targetElement, config);
//------------------------------------------------
// Add some scrollbars
//------------------------------------------------
const textareaElements = document.querySelectorAll('.add_scrollbar textarea');
for(i = 0; i < textareaElements.length; i++) {
textareaElements[i].classList.remove('scroll-hide');
textareaElements[i].classList.add('pretty_scrollbar');
textareaElements[i].style.resize = "none";
}
//------------------------------------------------
// Improve the looks of the chat input field
//------------------------------------------------

2
js/show_controls.js
View file

@ -1,5 +1,5 @@
const belowChatInput = document.querySelectorAll("#chat-tab > div > :nth-child(n+3), #extensions");
const chatParent = document.getElementById("chat").parentNode;
const chatParent = document.getElementById("chat").parentNode.parentNode.parentNode;
function toggle_controls(value) {
if (value) {