Export blink as a function, works more reliably

This commit is contained in:
Henrik Giesel 2021-06-27 16:32:39 +02:00
parent 53c0d372f4
commit 0acbf3e9eb
3 changed files with 15 additions and 11 deletions

View file

@ -8,23 +8,25 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
import { deleteIcon } from "./icons";
export let name: string;
export let blink: boolean = false;
const dispatch = createEventDispatcher();
$: if (blink) {
setTimeout(() => (blink = false), 300);
}
function deleteTag(event: Event): void {
dispatch("tagdelete");
event.stopPropagation();
}
let isBlink: boolean = false;
export function blink() {
isBlink = true;
setTimeout(() => (isBlink = false), 300);
}
</script>
<button
class="d-inline-flex align-items-center tag text-nowrap rounded ps-2 pe-1 me-1"
class:blink
class:blink={isBlink}
tabindex="-1"
on:click
>
@ -62,7 +64,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
}
&.blink {
animation: blink 0.2s linear;
animation: blink 0.3s linear;
}
}
</style>

View file

@ -64,7 +64,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
const contained = names.indexOf(newName);
if (contained >= 0) {
tags[contained].blink = true;
tags[contained].blink();
return false;
}
@ -101,7 +101,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
const deleted = tags.splice(index, 1)[0];
tags = tags;
console.log('dt', activeAfterBlur, index)
console.log("dt", activeAfterBlur, index);
if (active !== null && active > index) {
active--;
}

View file

@ -18,14 +18,16 @@ export function normalizeTagname(tagname: string): string {
export interface Tag {
id: string;
name: string;
blink: boolean;
blink: () => void;
}
const noop = () => {};
export function attachId(name: string): Tag {
return {
id: Math.random().toString(36).substring(2),
name,
blink: false,
blink: noop,
};
}