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

Use CSS resizing for send textarea

Browse Source
This commit is contained in:
Cohee
2024-12-21 02:50:42 +02:00
parent 94de9411b6
commit d27d750cb2
1 changed files with 37 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -887,14 +887,44 @@ export function initRossMods() {
saveSettingsDebounced();
});
const cssAutofit = CSS.supports('field-sizing', 'content');
if (cssAutofit) {
sendTextArea.style['fieldSizing'] = 'content';
sendTextArea.style['height'] = 'auto';
let lastHeight = chatBlock.offsetHeight;
const chatBlockResizeObserver = new ResizeObserver((entries) => {
for (const entry of entries) {
if (entry.target !== chatBlock) {
continue;
}
const threshold = 1;
const newHeight = chatBlock.offsetHeight;
const deltaHeight = newHeight - lastHeight;
const isScrollAtBottom = Math.abs(chatBlock.scrollHeight - chatBlock.scrollTop - newHeight) <= threshold;
if (!isScrollAtBottom && Math.abs(deltaHeight) > threshold) {
chatBlock.scrollTop -= deltaHeight;
}
lastHeight = newHeight;
}
});
chatBlockResizeObserver.observe(chatBlock);
}
sendTextArea.addEventListener('input', () => {
const hasContent = sendTextArea.value !== '';
const fitsCurrentSize = sendTextArea.scrollHeight <= sendTextArea.offsetHeight;
const isScrollbarShown = sendTextArea.clientWidth < sendTextArea.offsetWidth;
const isHalfScreenHeight = sendTextArea.offsetHeight >= window.innerHeight / 2;
const needsDebounce = hasContent && (fitsCurrentSize || (isScrollbarShown && isHalfScreenHeight));
if (needsDebounce) autoFitSendTextAreaDebounced();
else autoFitSendTextArea();
if (!cssAutofit) {
const hasContent = sendTextArea.value !== '';
const fitsCurrentSize = sendTextArea.scrollHeight <= sendTextArea.offsetHeight;
const isScrollbarShown = sendTextArea.clientWidth < sendTextArea.offsetWidth;
const isHalfScreenHeight = sendTextArea.offsetHeight >= window.innerHeight / 2;
const needsDebounce = hasContent && (fitsCurrentSize || (isScrollbarShown && isHalfScreenHeight));
if (needsDebounce) autoFitSendTextAreaDebounced();
else autoFitSendTextArea();
}
saveUserInputDebounced();
});