Initial commit - SoundWave v1.0

- Full PWA support with offline capabilities
- Comprehensive search across songs, playlists, and channels
- Offline playlist manager with download tracking
- Pre-built frontend for zero-build deployment
- Docker-based deployment with docker compose
- Material-UI dark theme interface
- YouTube audio download and management
- Multi-user authentication support

frontend/public/img/GENERATE_ICONS.md

@@ -0,0 +1,23 @@
+# PWA Icon Generation Script
+# This creates placeholder icons - replace with actual app icons
+
+# For production, generate proper icons using:
+# https://www.pwabuilder.com/imageGenerator
+# or
+# https://realfavicongenerator.net/
+
+echo "To generate PWA icons, use one of these tools:"
+echo "1. PWA Builder Image Generator: https://www.pwabuilder.com/imageGenerator"
+echo "2. Real Favicon Generator: https://realfavicongenerator.net/"
+echo ""
+echo "Required icon sizes:"
+echo "- 72x72"
+echo "- 96x96"
+echo "- 128x128"
+echo "- 144x144"
+echo "- 152x152"
+echo "- 192x192"
+echo "- 384x384"
+echo "- 512x512"
+echo ""
+echo "Place generated icons in: frontend/public/img/"

frontend/public/img/icons/logo-source.svg

@@ -0,0 +1,17 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 768 768">
+  <rect width="768" height="768" fill="#A8D5D8"/>
+  <circle cx="384" cy="330" r="135" fill="none" stroke="#0F4C75" stroke-width="12"/>
+  <circle cx="384" cy="330" r="110" fill="none" stroke="#0F4C75" stroke-width="12"/>
+  <path d="M 385 230 Q 405 240 385 250 Q 405 255 385 270 Q 410 275 385 290" fill="none" stroke="#00C8C8" stroke-width="8" stroke-linecap="round"/>
+  <circle cx="384" cy="330" r="80" fill="none" stroke="#00C8C8" stroke-width="10"/>
+  <path fill="#0F4C75" d="M 350 305 L 350 355 L 410 330 Z"/>
+  <rect x="220" y="310" width="12" height="40" rx="6" fill="#00C8C8"/>
+  <rect x="245" y="295" width="12" height="70" rx="6" fill="#00C8C8"/>
+  <rect x="270" y="285" width="12" height="90" rx="6" fill="#0F4C75"/>
+  <rect x="510" y="310" width="12" height="40" rx="6" fill="#00C8C8"/>
+  <rect x="535" y="295" width="12" height="70" rx="6" fill="#00C8C8"/>
+  <rect x="560" y="285" width="12" height="90" rx="6" fill="#0F4C75"/>
+  <text x="384" y="550" font-family="Arial, sans-serif" font-size="80" font-weight="bold" text-anchor="middle" fill="#0F4C75">sound</text>
+  <text x="384" y="550" font-family="Arial, sans-serif" font-size="80" font-weight="bold" text-anchor="middle" fill="#00C8C8" dx="160">wave</text>
+</svg>

frontend/public/img/logo-app.svg

@@ -0,0 +1,39 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 768 768" width="768" height="768">
+  <!-- Background circle -->
+  <circle cx="384" cy="384" r="384" fill="#A8DADC"/>
+  
+  <!-- Sound wave lines - left -->
+  <rect x="190" y="340" width="12" height="60" rx="6" fill="#4ECDC4"/>
+  <rect x="210" y="355" width="12" height="30" rx="6" fill="#4ECDC4"/>
+  <rect x="230" y="345" width="12" height="50" rx="6" fill="#4ECDC4"/>
+  
+  <!-- Outer circle - cyan -->
+  <circle cx="384" cy="320" r="110" fill="none" stroke="#4ECDC4" stroke-width="16"/>
+  
+  <!-- Middle circle - dark blue -->
+  <circle cx="384" cy="320" r="85" fill="none" stroke="#1D3557" stroke-width="12"/>
+  
+  <!-- Inner circle - cyan -->
+  <circle cx="384" cy="320" r="65" fill="#A8DADC" stroke="#4ECDC4" stroke-width="10"/>
+  
+  <!-- Play button -->
+  <path d="M 370 300 L 370 340 L 405 320 Z" fill="#1D3557"/>
+  
+  <!-- Sound wave lines - right -->
+  <rect x="526" y="345" width="12" height="50" rx="6" fill="#4ECDC4"/>
+  <rect x="546" y="355" width="12" height="30" rx="6" fill="#4ECDC4"/>
+  <rect x="566" y="340" width="12" height="60" rx="6" fill="#4ECDC4"/>
+  
+  <!-- Text "soundwave" curved -->
+  <path id="curve" d="M 180 420 Q 384 500 588 420" fill="none"/>
+  <text font-family="Arial, sans-serif" font-size="80" font-weight="700" fill="#1D3557">
+    <textPath href="#curve" startOffset="12%">
+      sound
+    </textPath>
+  </text>
+  <text font-family="Arial, sans-serif" font-size="80" font-weight="700" fill="#4ECDC4">
+    <textPath href="#curve" startOffset="50%">
+      wave
+    </textPath>
+  </text>
+</svg>

frontend/public/img/logo-new.png

@@ -0,0 +1 @@
+# This will be replaced with the actual image file

frontend/public/img/logo.svg

@@ -0,0 +1,39 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 768 768" width="768" height="768">
+  <!-- Background circle -->
+  <circle cx="384" cy="384" r="384" fill="#A8DADC"/>
+  
+  <!-- Sound wave lines - left -->
+  <rect x="190" y="340" width="12" height="60" rx="6" fill="#4ECDC4"/>
+  <rect x="210" y="355" width="12" height="30" rx="6" fill="#4ECDC4"/>
+  <rect x="230" y="345" width="12" height="50" rx="6" fill="#4ECDC4"/>
+  
+  <!-- Outer circle - cyan -->
+  <circle cx="384" cy="320" r="110" fill="none" stroke="#4ECDC4" stroke-width="16"/>
+  
+  <!-- Middle circle - dark blue -->
+  <circle cx="384" cy="320" r="85" fill="none" stroke="#1D3557" stroke-width="12"/>
+  
+  <!-- Inner circle - cyan -->
+  <circle cx="384" cy="320" r="65" fill="#A8DADC" stroke="#4ECDC4" stroke-width="10"/>
+  
+  <!-- Play button -->
+  <path d="M 370 300 L 370 340 L 405 320 Z" fill="#1D3557"/>
+  
+  <!-- Sound wave lines - right -->
+  <rect x="526" y="345" width="12" height="50" rx="6" fill="#4ECDC4"/>
+  <rect x="546" y="355" width="12" height="30" rx="6" fill="#4ECDC4"/>
+  <rect x="566" y="340" width="12" height="60" rx="6" fill="#4ECDC4"/>
+  
+  <!-- Text "soundwave" curved -->
+  <path id="curve" d="M 180 420 Q 384 500 588 420" fill="none"/>
+  <text font-family="Arial, sans-serif" font-size="80" font-weight="700" fill="#1D3557">
+    <textPath href="#curve" startOffset="12%">
+      sound
+    </textPath>
+  </text>
+  <text font-family="Arial, sans-serif" font-size="80" font-weight="700" fill="#4ECDC4">
+    <textPath href="#curve" startOffset="50%">
+      wave
+    </textPath>
+  </text>
+</svg>