rixty/SillyTavern
1
0
Fork 0
mirror of https://github.com/SillyTavern/SillyTavern.git synced 2025-06-05 21:59:27 +02:00
Code Issues Packages Projects Releases Wiki Activity

improve send_textarea autofit performance

Browse Source 
- only expand immediately
- shrink debounced
This commit is contained in:
LenAnderson
2024-03-26 12:11:00 -04:00
parent e567aa2c31
commit 69d195ef31
1 changed files with 27 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

38
public/scripts/RossAscends-mods.js
View File

@@ -658,6 +658,28 @@ export async function initMovingUI() {
} }
} }
/**@type {HTMLTextAreaElement} */
const sendTextArea = document.querySelector('#send_textarea');
/**
* this makes the chat input text area resize vertically to match the text size (limited by CSS at 50% window height)
*/
function autoFitSendTextArea() {
const isFirefox = navigator.userAgent.toLowerCase().indexOf('firefox') > -1;
/**@type {HTMLDivElement} */
const chatBlock = document.querySelector('#chat');
const originalScrollBottom = chatBlock.scrollHeight - (chatBlock.scrollTop + chatBlock.offsetHeight);
if (sendTextArea.scrollHeight == sendTextArea.offsetHeight) {
sendTextArea.style.height = window.getComputedStyle(sendTextArea).getPropertyValue('min-height');
}
sendTextArea.style.height = sendTextArea.scrollHeight + 0.3 + 'px';
if (!isFirefox) {
const newScrollTop = Math.round(chatBlock.scrollHeight - (chatBlock.offsetHeight + originalScrollBottom));
chatBlock.scrollTop = newScrollTop;
}
}
export const autoFitSendTextAreaDebounced = debounce(autoFitSendTextArea);
// --------------------------------------------------- // ---------------------------------------------------
export function initRossMods() { export function initRossMods() {
@@ -820,17 +842,11 @@ export function initRossMods() {
saveSettingsDebounced(); saveSettingsDebounced();
}); });
//this makes the chat input text area resize vertically to match the text size (limited by CSS at 50% window height) sendTextArea.addEventListener('input', ()=>{
$('#send_textarea').on('input', function () { if (sendTextArea.scrollHeight > sendTextArea.offsetHeight) {
const isFirefox = navigator.userAgent.toLowerCase().indexOf('firefox') > -1; autoFitSendTextArea();
const chatBlock = $('#chat'); } else {
const originalScrollBottom = chatBlock[0].scrollHeight - (chatBlock.scrollTop() + chatBlock.outerHeight()); autoFitSendTextAreaDebounced();
this.style.height = window.getComputedStyle(this).getPropertyValue('min-height');
this.style.height = this.scrollHeight + 0.3 + 'px';
if (!isFirefox) {
const newScrollTop = Math.round(chatBlock[0].scrollHeight - (chatBlock.outerHeight() + originalScrollBottom));
chatBlock.scrollTop(newScrollTop);
} }
saveUserInput(); saveUserInput();
}); });