AI/text-generation-webui
1
0
Fork 0
mirror of https://github.com/oobabooga/text-generation-webui.git synced 2024-09-19 15:56:56 +00:00
Code Issues Packages Projects Releases Wiki Activity

Autoscroll Notebook/Default textareas during streaming

Browse Source
This commit is contained in:
oobabooga 2023-08-28 18:22:03 -07:00
parent 558e918fd6
commit c75f98a6d6
3 changed files with 55 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

52
js/main.js
View File

@ -112,6 +112,58 @@ const config = {
// Start observing the target element // Start observing the target element
observer.observe(targetElement, config); observer.observe(targetElement, config);
//------------------------------------------------
// Notebook box scrolling
//------------------------------------------------
const notebookElement = document.querySelector('#textbox-notebook textarea');
let notebookScrolled = false;
notebookElement.addEventListener('scroll', function() {
let diff = notebookElement.scrollHeight - notebookElement.clientHeight;
if(Math.abs(notebookElement.scrollTop - diff) <= 1 || diff == 0) {
notebookScrolled = false;
} else {
notebookScrolled = true;
}
});
const notebookObserver = new MutationObserver(function(mutations) {
mutations.forEach(function(mutation) {
if(!notebookScrolled) {
notebookElement.scrollTop = notebookElement.scrollHeight;
}
});
});
notebookObserver.observe(notebookElement.parentNode.parentNode.parentNode, config);
//------------------------------------------------
// Default box scrolling
//------------------------------------------------
const defaultElement = document.querySelector('#textbox-default textarea');
let defaultScrolled = false;
defaultElement.addEventListener('scroll', function() {
let diff = defaultElement.scrollHeight - defaultElement.clientHeight;
if(Math.abs(defaultElement.scrollTop - diff) <= 1 || diff == 0) {
defaultScrolled = false;
} else {
defaultScrolled = true;
}
});
const defaultObserver = new MutationObserver(function(mutations) {
mutations.forEach(function(mutation) {
if(!defaultScrolled) {
defaultElement.scrollTop = defaultElement.scrollHeight;
}
});
});
defaultObserver.observe(defaultElement.parentNode.parentNode.parentNode, config);
//------------------------------------------------ //------------------------------------------------
// Add some scrollbars // Add some scrollbars
//------------------------------------------------ //------------------------------------------------

4
modules/ui_default.py
View File

@ -18,7 +18,7 @@ def create_ui():
with gr.Row(): with gr.Row():
with gr.Column(): with gr.Column():
with gr.Row(): with gr.Row():
shared.gradio['textbox-default'] = gr.Textbox(value='', elem_classes=['textbox_default', 'add_scrollbar'], lines=27, label='Input') shared.gradio['textbox-default'] = gr.Textbox(value='', lines=27, label='Input', elem_classes=['textbox_default', 'add_scrollbar'])
shared.gradio['token-counter-default'] = gr.HTML(value="<span>0</span>", elem_classes=["token-counter", "default-token-counter"]) shared.gradio['token-counter-default'] = gr.HTML(value="<span>0</span>", elem_classes=["token-counter", "default-token-counter"])
with gr.Row(): with gr.Row():
@ -34,7 +34,7 @@ def create_ui():
with gr.Column(): with gr.Column():
with gr.Tab('Raw'): with gr.Tab('Raw'):
shared.gradio['output_textbox'] = gr.Textbox(lines=27, label='Output', elem_classes=['textbox_default_output', 'add_scrollbar']) shared.gradio['output_textbox'] = gr.Textbox(lines=27, label='Output', elem_id='textbox-default', elem_classes=['textbox_default_output', 'add_scrollbar'])
with gr.Tab('Markdown'): with gr.Tab('Markdown'):
shared.gradio['markdown_render-default'] = gr.Button('Render') shared.gradio['markdown_render-default'] = gr.Button('Render')

2
modules/ui_notebook.py
View File

@ -19,7 +19,7 @@ def create_ui():
with gr.Column(scale=4): with gr.Column(scale=4):
with gr.Tab('Raw'): with gr.Tab('Raw'):
with gr.Row(): with gr.Row():
shared.gradio['textbox-notebook'] = gr.Textbox(value='', elem_classes=['textbox', 'add_scrollbar'], lines=27) shared.gradio['textbox-notebook'] = gr.Textbox(value='', lines=27, elem_id='textbox-notebook', elem_classes=['textbox', 'add_scrollbar'])
shared.gradio['token-counter-notebook'] = gr.HTML(value="<span>0</span>", elem_classes=["token-counter"]) shared.gradio['token-counter-notebook'] = gr.HTML(value="<span>0</span>", elem_classes=["token-counter"])
with gr.Tab('Markdown'): with gr.Tab('Markdown'):