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

update floating autocomplete position on scroll

Browse Source
This commit is contained in:
LenAnderson
2024-03-31 07:50:44 -04:00
parent d4a6a7f55f
commit ef23930eaf
1 changed files with 22 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
public/scripts/slash-commands.js
View File

@ -2123,6 +2123,18 @@ export function setNewSlashCommandAutoComplete(textarea, isFloating = false) {
} }
selectedItem = result[0]; selectedItem = result[0];
if (isFloating) { if (isFloating) {
updatePosition();
} else {
const rect = textarea.getBoundingClientRect();
dom.style.setProperty('--bottom', `${window.innerHeight - rect.top}px`);
dom.style.bottom = `${window.innerHeight - rect.top}px`;
dom.style.left = `${rect.left}px`;
dom.style.right = `${window.innerWidth - rect.right}px`;
}
document.body.append(dom);
isActive = true;
};
const updatePosition = () => {
const location = getCursorPosition(); const location = getCursorPosition();
if (location.y <= window.innerHeight / 2) { if (location.y <= window.innerHeight / 2) {
dom.style.top = `${location.bottom}px`; dom.style.top = `${location.bottom}px`;
@ -2139,15 +2151,6 @@ export function setNewSlashCommandAutoComplete(textarea, isFloating = false) {
dom.style.maxWidth = `calc(99vw - ${location.left}px)`; dom.style.maxWidth = `calc(99vw - ${location.left}px)`;
dom.style.maxHeight = `calc(99vh - ${location.top}px)`; dom.style.maxHeight = `calc(99vh - ${location.top}px)`;
} }
} else {
const rect = textarea.getBoundingClientRect();
dom.style.setProperty('--bottom', `${window.innerHeight - rect.top}px`);
dom.style.bottom = `${window.innerHeight - rect.top}px`;
dom.style.left = `${rect.left}px`;
dom.style.right = `${window.innerWidth - rect.right}px`;
}
document.body.append(dom);
isActive = true;
}; };
const getCursorPosition = () => { const getCursorPosition = () => {
const inputRect = textarea.getBoundingClientRect(); const inputRect = textarea.getBoundingClientRect();
@ -2278,6 +2281,9 @@ export function setNewSlashCommandAutoComplete(textarea, isFloating = false) {
showAutoCompleteDebounced(); showAutoCompleteDebounced();
}); });
textarea.addEventListener('blur', ()=>hide()); textarea.addEventListener('blur', ()=>hide());
if (isFloating) {
textarea.addEventListener('scroll', debounce(updatePosition, 100));
}
} }
jQuery(function () { jQuery(function () {