rixty
/
SillyTavern
mirror of https://github.com/SillyTavern/SillyTavern.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Augment Edit Box Input Enfasterment (#2450) 

* edit box performance "fix"

Note: jQuery makes an adjustment to height or scrollHeight that pure JavaScript doesn't;+2 was the minimum I needed to not get a vertical scrollbar, so I went with +4

* Refactor

* Use debounce instead of throttle

---------

Co-authored-by: Cohee <18619528+Cohee1207@users.noreply.github.com>
This commit is contained in:
Succubyss 2024-07-01 12:36:18 -05:00 committed by GitHub
parent 2b30555f3a
commit e1e0ef8730
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 19 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
public/script.js
View File

@ -9169,14 +9169,26 @@ jQuery(async function () {
chooseBogusFolder($(this), tagId); chooseBogusFolder($(this), tagId);
}); });
$(document).on('input', '.edit_textarea', function () { /**
scroll_holder = $('#chat').scrollTop(); * Sets the scroll height of the edit textarea to fit the content.
$(this).height(0).height(this.scrollHeight); * @param {HTMLTextAreaElement} e Textarea element to auto-fit
*/
function autoFitEditTextArea(e) {
scroll_holder = chatElement[0].scrollTop;
e.style.height = '0';
e.style.height = `${e.scrollHeight + 4}px`;
is_use_scroll_holder = true; is_use_scroll_holder = true;
}
const autoFitEditTextAreaDebounced = debounce(autoFitEditTextArea, debounce_timeout.short);
document.addEventListener('input', e => {
if (e.target instanceof HTMLTextAreaElement && e.target.classList.contains('edit_textarea')) {
const immediately = e.target.scrollHeight > e.target.offsetHeight || e.target.value === '';
immediately ? autoFitEditTextArea(e.target) : autoFitEditTextAreaDebounced(e.target);
}
}); });
$('#chat').on('scroll', function () { document.getElementById('chat').addEventListener('scroll', function () {
if (is_use_scroll_holder) { if (is_use_scroll_holder) {
$('#chat').scrollTop(scroll_holder); this.scrollTop = scroll_holder;
is_use_scroll_holder = false; is_use_scroll_holder = false;
} }
}); });

2
public/scripts/constants.js
View File

@ -5,6 +5,8 @@
export const debounce_timeout = { export const debounce_timeout = {
/** [100 ms] For ultra-fast responses, typically for keypresses or executions that might happen multiple times in a loop or recursion. */ /** [100 ms] For ultra-fast responses, typically for keypresses or executions that might happen multiple times in a loop or recursion. */
quick: 100, quick: 100,
/** [200 ms] Slightly slower than quick, but still very responsive. */
short: 200,
/** [300 ms] Default time for general use, good balance between responsiveness and performance. */ /** [300 ms] Default time for general use, good balance between responsiveness and performance. */
standard: 300, standard: 300,
/** [1.000 ms] For situations where the function triggers more intensive tasks. */ /** [1.000 ms] For situations where the function triggers more intensive tasks. */