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

@@ -19,6 +19,8 @@ const TEXT_FADE_DURATION = 0.15;
const SCORE_OFFSET = -20;
const SCORE_DURATION = 0.15;
const isAnimating = ref(true);
const intro = reactive({
boardOffsetY: BOARD_SLIDE_OFFSET,
boardOpacity: 0,
@@ -27,6 +29,7 @@ const intro = reactive({
});
const animateIntro = async () => {
isAnimating.value = true;
await gsap
.timeline()
.to(
@@ -49,9 +52,11 @@ const animateIntro = async () => {
{ scoreOffsetY: 0, duration: SCORE_DURATION, ease: "none" },
BOARD_SLIDE_DURATION + TEXT_FADE_DURATION,
);
isAnimating.value = false;
};
const animateOutro = async () => {
isAnimating.value = true;
await gsap
.timeline()
.to(
@@ -80,6 +85,7 @@ onMounted(() => {
});
const handleCancel = async () => {
if (isAnimating.value) return;
switch (state.value) {
case "alive": {
state.value = "pause";
@@ -109,6 +115,7 @@ const handleCancel = async () => {
};
const handleConfirm = () => {
if (isAnimating.value) return;
switch (state.value) {
case "alive": {
state.value = "pause";