1
0
forked from mirror/misskey
misskey/packages/frontend/src/scripts/confetti.ts
2023-01-06 20:25:08 +09:00

26 lines
935 B
TypeScript

import _confetti from 'canvas-confetti';
import * as os from '@/os';
export function confetti(options: { duration?: number; } = {}) {
const duration = options.duration ?? 1000 * 4;
const animationEnd = Date.now() + duration;
const defaults = { startVelocity: 30, spread: 360, ticks: 60, zIndex: os.claimZIndex('high') };
function randomInRange(min, max) {
return Math.random() * (max - min) + min;
}
const interval = setInterval(() => {
const timeLeft = animationEnd - Date.now();
if (timeLeft <= 0) {
return clearInterval(interval);
}
const particleCount = 50 * (timeLeft / duration);
// since particles fall down, start a bit higher than random
_confetti(Object.assign({}, defaults, { particleCount, origin: { x: randomInRange(0.1, 0.3), y: Math.random() - 0.2 } }));
_confetti(Object.assign({}, defaults, { particleCount, origin: { x: randomInRange(0.7, 0.9), y: Math.random() - 0.2 } }));
}, 250);
}