Ein einfacher Internetradio Player mit Presets.
Find a file
2025-12-19 15:41:37 +01:00
assets Upload files to "assets/img" 2025-12-19 15:40:25 +01:00
js Upload files to "js" 2025-12-19 15:34:10 +01:00
php Upload files to "php" 2025-12-19 15:41:13 +01:00
index.html Update index.html 2025-12-19 15:35:46 +01:00
LICENSE LICENSE aktualisiert 2025-08-14 09:49:07 +02:00
main.js Update main.js 2025-12-19 15:36:01 +01:00
README.md Upload files to "/" 2025-12-19 15:41:37 +01:00

📻 Radioplayer mit Presets

Ein moderner, leichtgewichtiger Internetradio-Player zum Selber-Hosten. Der Player ist modular aufgebaut, responsiv und bietet volle Kontrolle über deine Senderliste.

📂 Projektstruktur

/Radioplayer ├── index.html # Hauptseite (Frontend-Einstieg) ├── main.js # Zentrales Steuerungs-Skript ├── README.md # Dokumentation ├── LICENSE # Lizenzinformationen │ ├── assets/ # Design-Ressourcen │ ├── style.css # Zentrales Stylesheet │ ├── fonts/ # Lokal eingebundene Webfonts (DSGVO-konform) │ └── img/ # Favicons und Icons │ ├── js/ # Modularisierte JavaScript-Logik │ ├── meta-handler.js # Abruf von Stream-Metadaten │ ├── preset-manager.js # Logik zur Speicherung (LocalStorage) │ ├── preset-ui.js # Verwaltung der Bearbeiten-Oberfläche │ ├── sleeptimer.js # Timer-Funktionalität │ └── ui-helper.js # Modals, Footer-Initialisierung & UI-Tools │ └── php/ # Serverseitige Skripte └── metadata.php # Proxy zum Auslesen von ICY-Metadaten

Features

  • Läuft auch auf Servern ohne PHP: Es ist nur HTML und Javascript nötig.
  • Individuelle Presets: Sender können einfach hinzugefügt, bearbeitet, gelöscht und per Drag & Drop sortiert werden.
  • Metadaten-Anzeige: Automatische Anzeige von Sendername und aktuellem Song (diese Funktion erfordert PHP-Unterstützung).
  • Flexibler Import/Export: Sichere deine Senderliste als JSON-Datei oder als kompakten String.
  • Sleeptimer: Praktische Abschaltautomatik für entspanntes Hören.
  • Local Storage: Deine Einstellungen werden direkt im Browser gespeichert kein Backend-Setup für die Datenbank nötig.
  • Modularer Code: Sauber getrennte Logik für UI, Presets, Metadaten und Player.

🛠 Installation

  1. Lade alle Dateien herunter und kopiere sie auf deinen Webserver.
  2. Falls du die Titelanzeige (Metadaten) nutzen möchtest, muss dein Server PHP unterstützen.
  3. Die Datei webradio_presets.json dient als Standard-Vorlage beim ersten Start oder wenn alle vorhandenen Presets gelöscht werden.

📂 Dateistruktur

Um den Code wartungsfreundlich zu halten, ist das Projekt in Module unterteilt:

  • index.html: Das Grundgerüst des Players.
  • main.js: Die Schaltzentrale (steuert den Ablauf).
  • ui-helper.js: Verwaltet Modals, Titel und Footer-Anzeigen.
  • preset-manager.js: Übernimmt das Speichern, Laden und die Kompression der Senderliste.
  • meta-handler.js: Kommuniziert mit dem PHP-Proxy für Songtitel.
  • sleeptimer.js: Logik für die automatische Abschaltung.
  • metadata.php: Der Proxy, der die Metadaten von den Radio-Streams abruft.

🚀 Nutzung

  • Sender hinzufügen: Über "Presets bearbeiten" kannst du eigene Stream-URLs eintragen.
  • Sortieren: Nutze das ☰-Symbol in der Liste, um die Reihenfolge per Drag & Drop zu ändern.
  • Teilen: Exportiere deine Liste als Code-String, um sie auf einem anderen Gerät (z.B. Handy oder Tablet) einfach wieder zu importieren.

🔍 Fehlerbehebung (Troubleshooting)

  • Keine Titelanzeige: Überprüfe, ob die metadata.php im Ordner /optional liegt und dein Server PHP-Requests erlaubt (CURL muss in der PHP-Konfiguration meist aktiviert sein).
  • Presets werden nicht gespeichert: Stelle sicher, dass dein Browser "Local Storage" erlaubt und nicht im privaten Modus ist, der Daten nach dem Schliessen löscht.
  • Stream spielt nicht ab: Einige Browser blockieren "Mixed Content" (HTTP-Streams auf einer HTTPS-Seite). Achte darauf, nach Möglichkeit https://-Stream-URLs zu verwenden.

⚖️ Lizenz

Unlicense https://unlicense.org/


Viel Spass beim Radiohören!