xTr1m/GameList
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Confetti fx

Browse Source
This commit is contained in:
Frank Tovar
2026-02-03 01:42:01 +01:00
parent 4db2a343c2
commit e4402c08d5
2 changed files with 20 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

35
wwwroot/app.js
View File

@@ -840,9 +840,9 @@ function setupCardVisualHover(el, url) {
function setupBackgroundPan(config = {}) { function setupBackgroundPan(config = {}) {
const root = document.documentElement; const root = document.documentElement;
const maxOffset = config.maxOffsetPx ?? 10; const maxOffset = config.maxOffsetPx ?? 5;
const ease = config.ease ?? 0.03; const ease = config.ease ?? 0.03;
const scaleFactor = config.scaleFactor ?? 1.05; const scaleFactor = config.scaleFactor ?? 1.02;
if (scaleFactor) { if (scaleFactor) {
root.style.setProperty("--bg-scale", scaleFactor); root.style.setProperty("--bg-scale", scaleFactor);
} }
@@ -914,16 +914,17 @@ function triggerCelebration(button) {
function spawnConfetti(x, y, count) { function spawnConfetti(x, y, count) {
for (let i = 0; i < count; i++) { for (let i = 0; i < count; i++) {
const speed = 0.5;
fxParticles.push({ fxParticles.push({
x, x: x + (Math.random() - 0.5) * 20,
y, y: y + (Math.random() - 0.5) * 200,
vx: (Math.random() - 0.5) * 6, vx: (Math.random() - 0.5) * 10 * speed,
vy: Math.random() * -6 - 2, vy: (Math.random() * -6 - 2) * speed,
size: 6 + Math.random() * 4, size: 6 + Math.random() * 4,
life: 60 + Math.random() * 20, life: 600 + Math.random() * 200,
color: randomColor(), color: randomColor(),
type: "confetti", type: "confetti",
wobble: Math.random() * Math.PI * 2, wobble: Math.random(),
}); });
} }
} }
@@ -931,14 +932,14 @@ function spawnConfetti(x, y, count) {
function spawnFirework(x, y, count) { function spawnFirework(x, y, count) {
for (let i = 0; i < count; i++) { for (let i = 0; i < count; i++) {
const angle = (Math.PI * 2 * i) / count + Math.random() * 0.3; const angle = (Math.PI * 2 * i) / count + Math.random() * 0.3;
const speed = 3 + Math.random() * 3; const speed = (3 + Math.random() * 3) * 0.1;
fxParticles.push({ fxParticles.push({
x, x,
y, y,
vx: Math.cos(angle) * speed, vx: Math.cos(angle) * speed,
vy: Math.sin(angle) * speed, vy: (Math.sin(angle) - 1) * speed,
size: 4 + Math.random() * 3, size: 4 + Math.random() * 3,
life: 50 + Math.random() * 20, life: 500 + Math.random() * 200,
color: randomColor(), color: randomColor(),
type: "spark", type: "spark",
}); });
@@ -949,16 +950,18 @@ function fxStep() {
if (!fxCtx || !fxCanvas) return; if (!fxCtx || !fxCanvas) return;
fxCtx.clearRect(0, 0, fxCanvas.width, fxCanvas.height); fxCtx.clearRect(0, 0, fxCanvas.width, fxCanvas.height);
fxParticles = fxParticles.filter((p) => p.life > 0); fxParticles = fxParticles.filter((p) => p.life > 0);
let i = 0;
for (const p of fxParticles) { for (const p of fxParticles) {
i += 1;
if (p.type === "confetti") { if (p.type === "confetti") {
p.vy += 0.18; p.vy += 0.018;
p.vx *= 0.99; p.vx *= 0.999;
p.wobble += 0.2; p.wobble += 0.2;
p.x += p.vx + Math.cos(p.wobble) * 0.8; p.x += p.vx + Math.cos(p.wobble + i) * 0.5;
p.y += p.vy; p.y += p.vy;
} else { } else {
p.vy += 0.08; p.vy += 0.008;
p.vx *= 0.995; p.vx *= 0.9995;
p.x += p.vx; p.x += p.vx;
p.y += p.vy; p.y += p.vy;
} }

2
wwwroot/styles.css
View File

@@ -7,7 +7,7 @@
-apple-system, -apple-system,
sans-serif; sans-serif;
color: #2c1c0d; color: #2c1c0d;
--bg-scale: 1.12; --bg-scale: 1.0;
--bg-x: 0px; --bg-x: 0px;
--bg-y: 0px; --bg-y: 0px;
} }