PonyMirrors/philomena
1
0
Fork 0
mirror of https://github.com/philomena-dev/philomena.git synced 2025-02-01 03:46:44 +01:00
Code Issues Projects Releases Packages Wiki Activity

Require mouse movement before autocomplete options are selected on hover

Browse source
This commit is contained in:
KoloMl 2024-08-29 03:31:43 +04:00
parent 073ca2881b
commit c8bd0c9c33
1 changed files with 18 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

18
assets/js/autocomplete.ts
View file

@ -125,10 +125,17 @@ function createItem(list: HTMLUListElement, suggestion: TermSuggestion) {
className: 'autocomplete__item', className: 'autocomplete__item',
}); });
let ignoreMouseOver = true;
item.textContent = suggestion.label; item.textContent = suggestion.label;
item.dataset.value = suggestion.value; item.dataset.value = suggestion.value;
item.addEventListener('mouseover', () => { item.addEventListener('mouseover', () => {
// Prevent selection when mouse entered the element without actually moving.
if (ignoreMouseOver) {
return;
}
removeSelected(); removeSelected();
item.classList.add('autocomplete__item--selected'); item.classList.add('autocomplete__item--selected');
}); });
@ -137,6 +144,17 @@ function createItem(list: HTMLUListElement, suggestion: TermSuggestion) {
removeSelected(); removeSelected();
}); });
item.addEventListener(
'mousemove',
() => {
ignoreMouseOver = false;
item.dispatchEvent(new CustomEvent('mouseover'));
},
{
once: true,
},
);
item.addEventListener('click', () => { item.addEventListener('click', () => {
if (!inputField || !item.dataset.value) return; if (!inputField || !item.dataset.value) return;