🎵 MüüsP3Player v1.0.0

Web-based MP3 player with waveform visualization, A-B loop markers, variable speed playback, smart PDF sheet music viewer, shared practice statistics, and mobile-optimized interface.

✨ Features

📊 Waveform visualization with time scale
🔄 Draggable A-B loop markers
⚡ Speed control (0.4x - 1.5x) with pitch preservation and mobile-friendly buttons
📄 Smart PDF sheet music viewer (95% filename matching with Levenshtein distance)
📈 Server-side statistics tracking (shared across all users)
🎨 Position visualization with horizontal lines showing listening ranges
🔒 Login overlay with UTF-8 password support and Apache Basic Auth
👁️ Password show/hide toggle
📱 Mobile-optimized landscape layout with all controls on one line
💾 Track type persistence (remembers your last selected instrument)
🖥️ Smart fullscreen (mobile only, not on desktop)

🚀 Installation

📤 Upload files to web server
📁 Create directory structure:

- Repertoire/[Song Name]/MP3/*.mp3

- Repertoire/[Song Name]/PDF/*.pdf (optional)

⚙️ Make scripts executable: chmod +x songs.py stats.py
🔑 Change password (see below)

🔑 Password Setup

Set the password using Apache's htpasswd tool on the server:

ssh your-server "cd path/to/mp3-dev && htpasswd .htpasswd username"

UTF-8 Support: The app now supports UTF-8 passwords including umlauts (ä, ö, ü). The login system uses NFC normalization to ensure consistent encoding across browsers and Apache. How it works:

Passwords are stored in .htpasswd (Apache Basic Auth format)
Login overlay tests authentication by accessing a protected file
JavaScript normalizes credentials to NFC before encoding
No separate login.py needed - authentication is handled directly by Apache

🔒 Security

Authentication:

Apache HTTP Basic Authentication
Login overlay tests credentials against protected file
Credentials stored in browser localStorage (no cookies)
UTF-8 NFC normalization for consistent password encoding

Protection:

Server-side authentication via Apache .htpasswd
Path traversal protection in backend
XSS prevention via Content Security Policy (CSP)
Security headers (X-Frame-Options, X-Content-Type-Options, etc.)
Protected files (.htaccess, .htpasswd, .auth-test)
Directory listing disabled

Note: Credentials are stored in localStorage. For maximum security:

Use HTTPS in production
Use strong passwords
Clear localStorage when using shared devices
Implement server-side rate limiting

📋 Changelog