Bedienoberfläche für Webradio
ulrich
2018-01-04 5226a2e67c7dec0fa19e9adafb6dd6f95b0a364d
README.md
@@ -1,3 +1,79 @@
# radio-ui
Eine Bedienoberfläche für Webradio
## Prototyp
Diese Anwendung ist zur Zeit im Bau. Der aktuelle Prototyp zum Stand des Codes in diesem Repository ist hier zu sehen: [Link zum Prototyp](/data/ulrich/test/radio-ui).
## Vorgesehene Funktionen
Das radio-ui zeigt eine Übersicht von Radiosendern. Antippen eines Senders in der Übersicht spielt den Sender ab.
Radiosender können hinzugefügt, geändert und gelöscht werden. Ein Suchfeld ermöglicht das Einschränken der Übersicht auf bestimmte Sender.
Das Abspiel-Ziel ist konfigurierbar: Ein Radionsender kann entweder auf dem Gerät abgespielt werden, auf dem das radio-ui läuft oder auf einem anderen Gerät wie z.B. einem Raspberry Pi.
Zum Abspielen auf einem Raspberry Pi ist die Nutzung der Anwendung [pirc](/gitblit/docs/pirc.git) vorgesehen, die zum Spielen von Audiostreams den [omxplayer](https://elinux.org/Omxplayer) mit einer unter [Tomcat](https://de.wikipedia.org/wiki/Apache_Tomcat) laufenden Fernbedienung kombiniert, die per HTTP gesteuert werden kann.
## Nutzung von Vorlagen
Die Anwendung radio-ui ist ein Beispiel für die Nutzung von Vorlagen in Webanwendungen. Die Datei `index.html` definiert Bereiche einer HTML-Seite als `div`-Elemente, die während der Ausführung des Programmes dynamisch mit wechselnden Inhalten gefüllt werden.
Inhalte werden dabei mit Hilfe von [Mustache](https://github.com/janl/mustache.js) aus einer Vorlage und einer Inhaltsbeschreibung in [JSON](https://de.wikipedia.org/wiki/JavaScript_Object_Notation) zu [HTML](https://de.wikipedia.org/wiki/Hypertext_Markup_Language) zusammengesetzt.
## Abhängigkeiten
Zur Verwendung des radio-ui sind die folgenden Komponenten erforderlich
+ [jQuery](http://jquery.com/)
+ [Mustache](https://github.com/janl/mustache.js)
+ [app-menu](/gitblit/docs/web!app-menu.git)
Diese sind in der Datei `index.html` über die folgenden Einträge eingebunden.
````
<link rel="stylesheet" type="text/css" href="../jslib/app-menu/nav-toggle.css">
<link rel="stylesheet" type="text/css" href="../jslib/app-menu/app-menu.css">
<script src="../jslib/jquery-1.11.1/jquery-1.11.1.min.js"></script>
<script src="../jslib/mustache/mustache.min.js"></script>
<script src="../jslib/app-menu/app-menu.js"></script>
````
Sollen einzelne Komponenten von einem anderen Ort wie beispielsweise einem Content Delivery Network (CDN) eingebunden werden, müssen nur die obigen Einträge entsprechend angepasst werden.
## Radiostreams
Nachfolgend die Adressen einiger Radiostreams
### hr3
[Livestream-Übersicht](http://www.hr3.de/service/hr3-online-hoeren,webradio-100.html)
128 kbit http://hr-hrinfo-live.cast.addradio.de/hr/hrinfo/live/mp3/128/stream.mp3
48 kbit http://hr-hr3-live.cast.addradio.de/hr/hr3/live/mp3/48/stream.mp3
### hr info
[Livestream-Übersicht](http://www.hr-inforadio.de/livestream/index.html)
128 kBit/s http://hr-hrinfo-live.cast.addradio.de/hr/hrinfo/live/mp3/128/stream.mp3
48 kBit/s http://hr-hrinfo-live.cast.addradio.de/hr/hrinfo/live/mp3/48/stream.mp3
### radiobob
[Livestream-Übersicht](http://www.radiobob.de/radiobob/empfang/livestream)
MP3: http://bob.hoerradar.de/radiobob-live-mp3-hq
Mobile Nutzung: http://bob.hoerradar.de/aac-radiobob
### FFH
[Livestream-Übersicht](https://www.ffh.de/musik/webradios/stream-adressen.html)
128kbps http://mp3.ffh.de/radioffh/hqlivestream.mp3
48kbps http://mp3.ffh.de/radioffh/livestream.aac