Session 5: Prestige System with Stellar Essence

2026-08-20 13:43:23 +00:00
parent f18ef5c396
commit 3ee33ee43f
7 changed files with 769 additions and 88 deletions
@@ -178,6 +178,99 @@ const Particles = {
            document.getElementById('game-container').appendChild(star);
        }
    }
+    /**
+     * Create prestige reset effect - cosmic explosion
+     */
+    createPrestigeEffect(x, y) {
+        const colors = ['#ffd700', '#9b59b6', '#3498db', '#ffffff', '#e74c3c'];
+        
+        // Outer ring burst
+        for (let i = 0; i < 30; i++) {
+            const particle = document.createElement('div');
+            particle.className = 'particle prestige-particle';
+            
+            const angle = (Math.PI * 2 * i) / 30;
+            const velocity = 100 + Math.random() * 80;
+            const size = 10 + Math.random() * 15;
+            const color = colors[Math.floor(Math.random() * colors.length)];
+            
+            particle.style.cssText = `
+                left: ${x}px;
+                top: ${y}px;
+                width: ${size}px;
+                height: ${size}px;
+                background: ${color};
+                border-radius: 50%;
+                pointer-events: none;
+                position: fixed;
+                z-index: 998;
+                box-shadow: 0 0 15px ${color}, 0 0 30px ${color};
+            `;
+            
+            document.body.appendChild(particle);
+            
+            const animation = particle.animate([
+                { 
+                    transform: 'translate(-50%, -50%) scale(1)', 
+                    opacity: 1 
+                },
+                { 
+                    transform: `translate(calc(-50% + ${Math.cos(angle) * velocity}px), calc(-50% + ${Math.sin(angle) * velocity}px)) scale(1.5)`, 
+                    opacity: 0.8 
+                },
+                { 
+                    transform: `translate(calc(-50% + ${Math.cos(angle) * velocity * 2}px), calc(-50% + ${Math.sin(angle) * velocity * 2}px)) scale(0)`, 
+                    opacity: 0 
+                }
+            ], {
+                duration: 1500,
+                easing: 'cubic-bezier(0.25, 0.46, 0.45, 0.94)'
+            });
+            
+            animation.onfinish = () => particle.remove();
+        }
+        
+        // Inner sparkle burst
+        for (let i = 0; i < 15; i++) {
+            const sparkle = document.createElement('div');
+            sparkle.className = 'particle';
+            
+            const angle = Math.random() * Math.PI * 2;
+            const velocity = 50 + Math.random() * 50;
+            const size = 4 + Math.random() * 6;
+            
+            sparkle.style.cssText = `
+                left: ${x}px;
+                top: ${y}px;
+                width: ${size}px;
+                height: ${size}px;
+                background: #ffd700;
+                border-radius: 50%;
+                pointer-events: none;
+                position: fixed;
+                z-index: 998;
+                box-shadow: 0 0 10px #ffd700;
+            `;
+            
+            document.body.appendChild(sparkle);
+            
+            const animation = sparkle.animate([
+                { 
+                    transform: 'translate(-50%, -50%) scale(1)', 
+                    opacity: 1 
+                },
+                { 
+                    transform: `translate(calc(-50% + ${Math.cos(angle) * velocity}px), calc(-50% + ${Math.sin(angle) * velocity}px)) scale(0)`, 
+                    opacity: 0 
+                }
+            ], {
+                duration: 800,
+                easing: 'ease-out'
+            });
+            
+            animation.onfinish = () => sparkle.remove();
+        }
+    },
 };

 // Make globally accessible