Implement autocomplete hiding on empty activeInput + remove logging

This commit is contained in:
Henrik Giesel 2021-06-29 13:04:32 +02:00
parent 392326b863
commit d3191d7ecb
2 changed files with 11 additions and 21 deletions

View file

@ -92,14 +92,6 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
names.splice(index, 1); names.splice(index, 1);
const contained = names.indexOf(activeName); const contained = names.indexOf(activeName);
console.log(
"isActiveUnique",
active,
index,
activeName,
JSON.stringify(names),
contained
);
if (contained >= 0) { if (contained >= 0) {
tags[contained >= index ? contained + 1 : contained].flash(); tags[contained >= index ? contained + 1 : contained].flash();
return false; return false;
@ -149,7 +141,6 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
const deleted = tags.splice(index, 1)[0]; const deleted = tags.splice(index, 1)[0];
tags = tags; tags = tags;
console.log("dt", activeAfterBlur, index);
if (activeAfterBlur !== null && activeAfterBlur > index) { if (activeAfterBlur !== null && activeAfterBlur > index) {
activeAfterBlur--; activeAfterBlur--;
} }
@ -187,8 +178,6 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
} }
function moveToPreviousTag(index: number): void { function moveToPreviousTag(index: number): void {
console.log("moveprevious", active, index);
if (isFirst(index)) { if (isFirst(index)) {
return; return;
} }
@ -225,7 +214,6 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
} }
function decideNextActive() { function decideNextActive() {
console.log("dna", active, activeAfterBlur);
active = activeAfterBlur; active = activeAfterBlur;
activeAfterBlur = null; activeAfterBlur = null;
} }
@ -238,7 +226,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
return event.code === "Backspace" || event.code === "Delete"; return event.code === "Backspace" || event.code === "Delete";
} }
function update(event: KeyboardEvent, autocomplete: any): void { function onKeydown(event: KeyboardEvent, autocomplete: any): void {
const visible = autocomplete.isVisible(); const visible = autocomplete.isVisible();
const printable = isPrintableKey(event); const printable = isPrintableKey(event);
const deletion = isDeletionKey(event); const deletion = isDeletionKey(event);
@ -251,10 +239,6 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
} }
} }
if (activeName.length === 0) {
autocomplete.hide();
}
switch (event.code) { switch (event.code) {
case "ArrowUp": case "ArrowUp":
autocomplete.selectNext(); autocomplete.selectNext();
@ -288,6 +272,12 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
break; break;
} }
} }
function onKeyup(_event: KeyboardEvent, autocomplete: any): void {
if (activeName.length === 0) {
autocomplete.hide();
}
}
</script> </script>
<StickyBottom> <StickyBottom>
@ -317,7 +307,8 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
activeName = tag.name; activeName = tag.name;
createAutocomplete(activeInput); createAutocomplete(activeInput);
}} }}
on:keydown={(event) => update(event, autocomplete)} on:keydown={(event) => onKeydown(event, autocomplete)}
on:keyup={(event) => onKeyup(event, autocomplete)}
on:input={() => updateTagName(tag)} on:input={() => updateTagName(tag)}
on:tagsplit={({ detail }) => on:tagsplit={({ detail }) =>
enterBehavior( enterBehavior(
@ -360,8 +351,6 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
class="tag-spacer flex-grow-1 align-self-stretch" class="tag-spacer flex-grow-1 align-self-stretch"
on:click={appendEmptyTag} on:click={appendEmptyTag}
/> />
{active}
{activeAfterBlur}
</ButtonToolbar> </ButtonToolbar>
</StickyBottom> </StickyBottom>

View file

@ -75,8 +75,8 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
function onBlur(event: Event): void { function onBlur(event: Event): void {
event.preventDefault(); event.preventDefault();
normalize(); normalize();
console.log("taginput onblur");
if (name.length === 0) { if (name.length === 0) {
dispatch("tagdelete"); dispatch("tagdelete");
} }
@ -182,6 +182,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
on:blur={onBlur} on:blur={onBlur}
on:keydown={onKeydown} on:keydown={onKeydown}
on:keydown on:keydown
on:keyup
on:input on:input
on:paste={onPaste} on:paste={onPaste}
/> />