feat(settings): block interactions while animation is happening

This commit is contained in:
2026-02-08 20:19:40 +01:00
parent e30efff798
commit 0093c00ff9
11 changed files with 83 additions and 2 deletions

View File

@@ -17,12 +17,15 @@ const OUTRO_DURATION = 0.25;
const ROW_STAGGER = SLIDE_DURATION + 0.075;
const ROW_COUNT = 2;
const isAnimating = ref(true);
const animation = reactive({
rowOffsetY: new Array<number>(ROW_COUNT).fill(SLIDE_OFFSET),
rowOpacity: new Array<number>(ROW_COUNT).fill(0),
});
const animateIntro = async () => {
isAnimating.value = true;
const timeline = gsap.timeline();
for (let i = 0; i < ROW_COUNT; i++) {
timeline
@@ -38,9 +41,11 @@ const animateIntro = async () => {
);
}
await timeline;
isAnimating.value = false;
};
const animateOutro = async () => {
isAnimating.value = true;
const timeline = gsap.timeline();
for (let i = 0; i < ROW_COUNT; i++) {
timeline
@@ -63,11 +68,13 @@ onMounted(() => {
});
const handleCancel = async () => {
if (isAnimating.value) return;
await animateOutro();
store.closeSubMenu();
};
const handleConfirm = async () => {
if (isAnimating.value) return;
await animateOutro();
store.closeSubMenu();
};