Auto commit: 2026-02-19T18:44:32.489Z
This commit is contained in:
parent
1dc006d161
commit
71f83385d2
125
index.php
125
index.php
@ -37,21 +37,22 @@ $twitter_link = "https://twitter.com/";
|
||||
|
||||
<style>
|
||||
:root {
|
||||
--accent-color: #00c853; /* Refined Green */
|
||||
--primary-color: #38bdf8; /* Vibrant Blue */
|
||||
--bg-overlay: rgba(0, 0, 0, 0.15); /* Even lighter for maximum transparency */
|
||||
--glass-bg: rgba(255, 255, 255, 0.03); /* Almost invisible glass */
|
||||
--glass-border: rgba(255, 255, 255, 0.2);
|
||||
--text-color: #ffffff;
|
||||
--card-shadow: rgba(0, 0, 0, 0.4);
|
||||
--accent-color: #00e676; /* Vibrant Neon Green */
|
||||
--primary-color: #38bdf8; /* Deep Sky Blue */
|
||||
--secondary-color: #f472b6; /* Playful Pink */
|
||||
--bg-overlay: rgba(2, 6, 23, 0.35); /* Deep slate overlay for depth */
|
||||
--glass-bg: rgba(30, 41, 59, 0.3); /* Slate glass */
|
||||
--glass-border: rgba(255, 255, 255, 0.1);
|
||||
--text-color: #f8fafc;
|
||||
--card-shadow: rgba(0, 0, 0, 0.6);
|
||||
}
|
||||
|
||||
[data-theme="light"] {
|
||||
--bg-overlay: rgba(255, 255, 255, 0.6);
|
||||
--glass-bg: rgba(255, 255, 255, 0.8);
|
||||
--glass-border: rgba(0, 0, 0, 0.1);
|
||||
--text-color: #1a1a1a;
|
||||
--card-shadow: rgba(0, 0, 0, 0.15);
|
||||
--bg-overlay: rgba(255, 255, 255, 0.5);
|
||||
--glass-bg: rgba(255, 255, 255, 0.7);
|
||||
--glass-border: rgba(0, 0, 0, 0.05);
|
||||
--text-color: #0f172a;
|
||||
--card-shadow: rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
body, html {
|
||||
@ -83,7 +84,8 @@ $twitter_link = "https://twitter.com/";
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: var(--bg-overlay);
|
||||
background: radial-gradient(circle at 50% 50%, transparent 0%, var(--bg-overlay) 100%);
|
||||
backdrop-filter: blur(2px);
|
||||
}
|
||||
|
||||
.app-container {
|
||||
@ -290,7 +292,8 @@ $twitter_link = "https://twitter.com/";
|
||||
text-overflow: ellipsis;
|
||||
transition: color 0.05s ease, transform 0.05s ease, text-shadow 0.05s ease, opacity 0.5s ease;
|
||||
color: var(--text-color);
|
||||
text-shadow: 0 0 15px rgba(56, 189, 248, 0.6);
|
||||
text-shadow: 0 0 15px var(--primary-color);
|
||||
opacity: 0.9;
|
||||
display: block;
|
||||
margin-top: 0.2rem;
|
||||
will-change: color, transform, text-shadow;
|
||||
@ -463,10 +466,11 @@ $twitter_link = "https://twitter.com/";
|
||||
width: 18px;
|
||||
height: 5px;
|
||||
border-radius: 4px 4px 0 0;
|
||||
background: var(--primary-color);
|
||||
background: linear-gradient(to top, var(--primary-color), var(--accent-color));
|
||||
transition: height 0.05s ease;
|
||||
min-height: 5px;
|
||||
position: relative;
|
||||
box-shadow: 0 0 15px rgba(56, 189, 248, 0.3);
|
||||
}
|
||||
|
||||
/* Visualizer Peak */
|
||||
@ -2281,39 +2285,40 @@ $twitter_link = "https://twitter.com/";
|
||||
if (visualizerPeaks[i]) {
|
||||
visualizerPeaks[i].style.bottom = `${peakHeights[i]}%`;
|
||||
|
||||
const hue = Math.max(0, 200 - (peakHeights[i] * 1.8));
|
||||
const color = `hsla(${hue}, 100%, 85%, 1)`;
|
||||
const glow = `hsla(${hue}, 100%, 60%, 0.9)`;
|
||||
const hue = 190 + (peakHeights[i] * 0.5); // 190 to 240 range (Cyan to Blue)
|
||||
const color = `hsla(${hue}, 100%, 90%, 1)`;
|
||||
const glow = `hsla(${hue}, 100%, 60%, 0.7)`;
|
||||
|
||||
visualizerPeaks[i].style.background = `linear-gradient(to bottom, ${color}, transparent)`;
|
||||
visualizerPeaks[i].style.boxShadow = `0 -2px 12px ${glow}, 0 0 20px ${glow}`;
|
||||
|
||||
// Strobe effect removed
|
||||
visualizerPeaks[i].style.boxShadow = `0 -2px 10px ${glow}`;
|
||||
}
|
||||
}
|
||||
|
||||
// Removed dynamic glow effect based on average volume
|
||||
document.documentElement.style.setProperty('--card-border-bg', '');
|
||||
document.documentElement.style.setProperty('--shake-offset-x', '0px');
|
||||
document.documentElement.style.setProperty('--shake-offset-y', '0px');
|
||||
if (glassCard) glassCard.style.transform = '';
|
||||
|
||||
// Dynamic glow effect based on average volume
|
||||
let sum = 0;
|
||||
for (let i = 0; i < dataArray.length; i++) sum += dataArray[i];
|
||||
const avg = sum / dataArray.length;
|
||||
const intensity = (avg / 255);
|
||||
|
||||
if (glassCard) {
|
||||
const primaryColor = getComputedStyle(document.documentElement).getPropertyValue('--primary-color').trim();
|
||||
glassCard.style.boxShadow = `0 20px 50px rgba(0, 0, 0, 0.5), 0 0 ${intensity * 40}px ${primaryColor}44`;
|
||||
glassCard.style.transform = `scale(${1 + intensity * 0.005})`;
|
||||
}
|
||||
|
||||
// Subtle color shift for border
|
||||
const hueShift = intensity * 30;
|
||||
document.documentElement.style.setProperty('--card-border-bg', `linear-gradient(${45 + hueShift}deg, var(--primary-color), var(--accent-color), var(--secondary-color), var(--primary-color))`);
|
||||
|
||||
if (trackTitle) {
|
||||
trackTitle.style.color = '';
|
||||
trackTitle.style.textShadow = '';
|
||||
trackTitle.style.transform = '';
|
||||
trackTitle.style.transform = `scale(${1 + intensity * 0.01})`;
|
||||
trackTitle.style.textShadow = `0 0 ${15 + intensity * 15}px var(--primary-color)`;
|
||||
}
|
||||
|
||||
if (trackLabel) {
|
||||
trackLabel.style.color = '';
|
||||
trackLabel.style.textShadow = '';
|
||||
}
|
||||
|
||||
// Reset Social Icons
|
||||
// Pulse social icons slightly with bass
|
||||
const bass = dataArray[0] / 255;
|
||||
socialIcons.forEach(icon => {
|
||||
icon.style.backgroundColor = '';
|
||||
icon.style.boxShadow = '';
|
||||
icon.style.transform = '';
|
||||
icon.style.transform = `scale(${1 + bass * 0.05})`;
|
||||
});
|
||||
}
|
||||
|
||||
@ -3444,6 +3449,8 @@ $twitter_link = "https://twitter.com/";
|
||||
}
|
||||
}
|
||||
|
||||
let lastUserLevel = localStorage.getItem('lastUserLevel');
|
||||
|
||||
function showUserProgress(fan) {
|
||||
const container = document.getElementById('user-progress-container');
|
||||
const badge = document.getElementById('user-level-badge');
|
||||
@ -3452,6 +3459,28 @@ $twitter_link = "https://twitter.com/";
|
||||
const bar = document.getElementById('user-level-bar');
|
||||
const rewards = document.getElementById('unlocked-rewards-msg');
|
||||
|
||||
// Check for level up
|
||||
if (lastUserLevel && parseInt(fan.level) > parseInt(lastUserLevel)) {
|
||||
confetti({
|
||||
particleCount: 200,
|
||||
spread: 100,
|
||||
origin: { y: 0.6 },
|
||||
colors: ['#38bdf8', '#facc15', '#00e676', '#ffffff']
|
||||
});
|
||||
// Small delay to let the points update before showing the level up toast
|
||||
setTimeout(() => {
|
||||
const toast = document.createElement('div');
|
||||
toast.className = 'copy-toast';
|
||||
toast.style.background = 'linear-gradient(135deg, #facc15, #fbbf24)';
|
||||
toast.style.color = '#000';
|
||||
toast.innerHTML = `<i class="bi bi-arrow-up-circle-fill"></i> ¡NIVEL SUBIDO! Ahora eres <b>${fan.level_name}</b>`;
|
||||
document.body.appendChild(toast);
|
||||
setTimeout(() => toast.remove(), 5000);
|
||||
}, 500);
|
||||
}
|
||||
lastUserLevel = fan.level;
|
||||
localStorage.setItem('lastUserLevel', fan.level);
|
||||
|
||||
// Update shop points display
|
||||
const shopPoints = document.getElementById('shop-user-points');
|
||||
if (shopPoints) shopPoints.innerText = `${parseInt(fan.total_likes).toLocaleString()} pts`;
|
||||
@ -4029,6 +4058,16 @@ $twitter_link = "https://twitter.com/";
|
||||
}
|
||||
|
||||
function launchFlowerCelebration() {
|
||||
// Celebration confetti burst
|
||||
confetti({
|
||||
particleCount: 150,
|
||||
spread: 70,
|
||||
origin: { y: 0.6 },
|
||||
colors: ['#f472b6', '#fb7185', '#ec4899', '#ffffff', '#ffd700'],
|
||||
shapes: ['circle', 'square'],
|
||||
scalar: 1.2
|
||||
});
|
||||
|
||||
const container = document.getElementById('celebration-overlay');
|
||||
const emojis = ['🌸', '🌹', '🌺', '🌻', '🌼', '🌷', '✨', '💖'];
|
||||
const count = 30;
|
||||
@ -4110,6 +4149,14 @@ $twitter_link = "https://twitter.com/";
|
||||
modal.style.display = 'flex';
|
||||
setTimeout(() => modal.classList.add('show'), 10);
|
||||
|
||||
// Celebration confetti
|
||||
confetti({
|
||||
particleCount: 250,
|
||||
spread: 160,
|
||||
origin: { y: 0.6 },
|
||||
colors: ['#facc15', '#38bdf8', '#ff4444', '#00e676', '#ffffff']
|
||||
});
|
||||
|
||||
// Audio cue if possible
|
||||
try {
|
||||
const audio = new Audio('https://www.soundjay.com/buttons/sounds/button-3.mp3');
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user