diff --git a/index.html b/index.html
index 2bc297a..b7f472d 100644
--- a/index.html
+++ b/index.html
@@ -4,8 +4,8 @@
RADICAL - Australia's Democratic Revolution
-
+
+
@@ -1063,6 +1063,85 @@
color: var(--text-muted);
font-style: italic;
}
+
+.music-controls {
+ position: fixed;
+ bottom: 20px;
+ right: 20px;
+ z-index: 1000;
+ background-color: var(--card-bg);
+ border: 1px solid var(--primary);
+ padding: 10px;
+ display: flex;
+ align-items: center;
+ gap: 10px;
+ box-shadow: 0 0 10px rgba(255, 0, 153, 0.3);
+ transition: all 0.3s ease;
+ }
+
+ .music-controls:hover {
+ box-shadow: 0 0 15px rgba(255, 0, 153, 0.5);
+ }
+
+ .music-button {
+ background: none;
+ border: none;
+ color: var(--text);
+ font-size: 24px;
+ cursor: pointer;
+ width: 40px;
+ height: 40px;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ transition: all 0.2s ease;
+ }
+
+ .music-button:hover {
+ color: var(--primary);
+ transform: scale(1.1);
+ }
+
+ .music-label {
+ color: var(--text-muted);
+ font-size: 12px;
+ font-family: 'Roboto Mono', monospace;
+ }
+
+ /* Animation for the play button */
+ @keyframes pulse {
+ 0% { transform: scale(1); }
+ 50% { transform: scale(1.1); }
+ 100% { transform: scale(1); }
+ }
+
+ .pulse {
+ animation: pulse 2s infinite;
+ }
+
+ /* Initial prompt to click for music */
+ .music-prompt {
+ position: fixed;
+ bottom: 80px;
+ right: 20px;
+ background-color: var(--primary);
+ color: var(--dark);
+ padding: 8px 15px;
+ font-size: 12px;
+ font-family: 'Roboto Mono', monospace;
+ border-radius: 0;
+ opacity: 0;
+ transform: translateY(20px);
+ transition: all 0.3s ease;
+ pointer-events: none;
+ z-index: 1000;
+ }
+
+ .music-prompt.visible {
+ opacity: 1;
+ transform: translateY(0);
+ }
+
@@ -2751,6 +2830,87 @@ function addCommentsToProposal(proposalCard, proposalId) {
toggleComments(proposalId, commentsToggle);
});
}
+ // Music player functionality
+ document.addEventListener('DOMContentLoaded', () => {
+ // Set up variables
+ const backgroundMusic = document.getElementById('background-music');
+ const musicControls = document.getElementById('music-controls');
+ const musicToggle = document.getElementById('music-toggle');
+ const musicPrompt = document.getElementById('music-prompt');
+ let musicInitialized = false;
+
+ // Show the prompt after a delay
+ setTimeout(() => {
+ musicPrompt.classList.add('visible');
+ }, 3000);
+
+ // Audio file URL - this should point to your audio file in R2
+ const audioUrl = 'https://radical.omar-c29.workers.dev/memes/steppingout.mp3';
+
+ // Initialize music on first click anywhere on the page
+ document.addEventListener('click', initializeMusic, { once: true });
+
+ function initializeMusic() {
+ if (musicInitialized) return;
+
+ // Set the audio source
+ backgroundMusic.src = audioUrl;
+
+ // Load the audio
+ backgroundMusic.load();
+
+ // Play the audio (this may fail due to browser autoplay policies)
+ playAudio();
+
+ // Show the music controls
+ musicControls.style.display = 'flex';
+
+ // Hide the prompt
+ musicPrompt.classList.remove('visible');
+
+ // Add event listener for the toggle button
+ musicToggle.addEventListener('click', toggleMusic);
+
+ // Mark as initialized
+ musicInitialized = true;
+
+ // Remove the initial click listener
+ document.removeEventListener('click', initializeMusic);
+ }
+
+ function playAudio() {
+ backgroundMusic.play().then(() => {
+ musicToggle.innerHTML = '📀';
+ musicToggle.classList.remove('pulse');
+ }).catch(error => {
+ console.error('Failed to play audio:', error);
+ musicToggle.innerHTML = '📻';
+ musicToggle.classList.add('pulse');
+ });
+ }
+
+ function toggleMusic() {
+ if (backgroundMusic.paused) {
+ playAudio();
+ } else {
+ backgroundMusic.pause();
+ musicToggle.innerHTML = '📻';
+ musicToggle.classList.add('pulse');
+ }
+ }
+ });
+
+ Click anywhere for immersive experience
+
+
+ Radical Vibes
+
+
+