diff --git a/js/main.js b/js/main.js index 6267871c..5bb41808 100644 --- a/js/main.js +++ b/js/main.js @@ -112,6 +112,58 @@ const config = { // Start observing the target element 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 //------------------------------------------------ diff --git a/modules/ui_default.py b/modules/ui_default.py index 29b9bee5..54d1a220 100644 --- a/modules/ui_default.py +++ b/modules/ui_default.py @@ -18,7 +18,7 @@ def create_ui(): with gr.Row(): with gr.Column(): 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="0", elem_classes=["token-counter", "default-token-counter"]) with gr.Row(): @@ -34,7 +34,7 @@ def create_ui(): with gr.Column(): 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'): shared.gradio['markdown_render-default'] = gr.Button('Render') diff --git a/modules/ui_notebook.py b/modules/ui_notebook.py index e2aeb860..ba2775d5 100644 --- a/modules/ui_notebook.py +++ b/modules/ui_notebook.py @@ -19,7 +19,7 @@ def create_ui(): with gr.Column(scale=4): with gr.Tab('Raw'): 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="0", elem_classes=["token-counter"]) with gr.Tab('Markdown'):