54 lines
1.0 KiB
TypeScript
54 lines
1.0 KiB
TypeScript
import confetti from "canvas-confetti";
|
|
|
|
export const CONFETTI_COLORS = [
|
|
"#2f4a3a",
|
|
"#b4633f",
|
|
"#d9b36a",
|
|
"#7c9077",
|
|
"#ffffff",
|
|
];
|
|
|
|
/** Dezenter Burst bei Ergebnissen. */
|
|
export function popConfetti() {
|
|
confetti({
|
|
particleCount: 70,
|
|
spread: 60,
|
|
startVelocity: 32,
|
|
scalar: 0.9,
|
|
origin: { y: 0.55 },
|
|
colors: CONFETTI_COLORS,
|
|
disableForReducedMotion: true,
|
|
});
|
|
}
|
|
|
|
/** Großer Gewinner-Regen mit zwei Seitenkanonen. */
|
|
export function celebrateConfetti() {
|
|
const defaults: confetti.Options = {
|
|
spread: 70,
|
|
startVelocity: 42,
|
|
colors: CONFETTI_COLORS,
|
|
disableForReducedMotion: true,
|
|
};
|
|
confetti({ ...defaults, particleCount: 120, origin: { y: 0.55 } });
|
|
setTimeout(
|
|
() =>
|
|
confetti({
|
|
...defaults,
|
|
particleCount: 60,
|
|
angle: 60,
|
|
origin: { x: 0, y: 0.7 },
|
|
}),
|
|
150,
|
|
);
|
|
setTimeout(
|
|
() =>
|
|
confetti({
|
|
...defaults,
|
|
particleCount: 60,
|
|
angle: 120,
|
|
origin: { x: 1, y: 0.7 },
|
|
}),
|
|
250,
|
|
);
|
|
}
|