Bedienoberfläche für Webradio
ulrich
2018-01-27 08bce7465c912525729d3e82a3b304ff3fc35fd6
README.md
@@ -12,13 +12,18 @@
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.
Das Abspiel-Ziel ist konfigurierbar: Ein Radionsender kann entweder auf dem Gerät abgespielt werden, auf dem das radio-ui im Browser 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.
## Beispielcharakter
## Nutzung von Vorlagen
Neben dem praktischen Nutzen veranschaulicht das radio-ui verschiedene Aspekte des Baus von Webanwendungen:
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.
+ app-layout
+ Vorlagen
+ app-menu
+ CRUD-Muster (Create, Read, Update, Delete)
Wie in der Anwendung radio-ui die obigen Themen umgesetzt sind, ist auf der [Beispielseite](beispiel.md) näher betrachtet.
## Abhängigkeiten
@@ -31,7 +36,6 @@
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>
@@ -40,38 +44,110 @@
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
## Zusammenspiel mit dem Raspberry Pi
Nachfolgend die Adressen einiger Radiostreams
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.
### hr3
Auf der Seite [Kombination von pirc und radio-ui](pirc.md) ist beschrieben, wie pirc aus dem radio-ui heraus genutzt werden kann.
[Livestream-Übersicht](http://www.hr3.de/service/hr3-online-hoeren,webradio-100.html)
## Schnittstellenbeschreibung
128 kbit http://hr-hrinfo-live.cast.addradio.de/hr/hrinfo/live/mp3/128/stream.mp3
Für den Prototyp des radio-ui können verschiedene Arten des Umgangs mit Sendern und Abspielern hergestellt werden. Die folgenden Angaben zeigen die Punkte auf, an denen eine konkrete Implementierung ansetzen kann.
48 kbit http://hr-hr3-live.cast.addradio.de/hr/hr3/live/mp3/48/stream.mp3
### Sender
### hr info
#### Senderliste lesen
[Livestream-Übersicht](http://www.hr-inforadio.de/livestream/index.html)
Aufruf
128 kBit/s http://hr-hrinfo-live.cast.addradio.de/hr/hrinfo/live/mp3/128/stream.mp3
````
data/sender.json
````
48 kBit/s http://hr-hrinfo-live.cast.addradio.de/hr/hrinfo/live/mp3/48/stream.mp3
Antwort
### radiobob
````
{
  "senderliste": {
    "titel": "Senderliste",
    "inhalt":  [
      {
        "senderid": 1,
        "sendername": "hr info",
        "senderurl": "http://hr-hrinfo-live.cast.addradio.de/hr/hrinfo/live/mp3/128/stream.mp3",
        "senderlogo": "../bilder/hr-info.png"
      },
      {
        "senderid": 2,
        "sendername": "radiobob",
        "senderurl": "http://bob.hoerradar.de/radiobob-live-mp3-hq",
        "senderlogo": "../bilder/radio-bob-logo-80.png"
      },
      usw.
    ]
  }
}
````
[Livestream-Übersicht](http://www.radiobob.de/radiobob/empfang/livestream)
#### Neuen Sender speichern
MP3: http://bob.hoerradar.de/radiobob-live-mp3-hq
Noch nicht realisiert.
Mobile Nutzung: http://bob.hoerradar.de/aac-radiobob
#### Änderungen an einem Sender speichern
### FFH
Noch nicht realisiert.
[Livestream-Übersicht](https://www.ffh.de/musik/webradios/stream-adressen.html)
#### Sender löschen
128kbps http://mp3.ffh.de/radioffh/hqlivestream.mp3
Noch nicht realisiert.
48kbps http://mp3.ffh.de/radioffh/livestream.aac
### Abspieler
#### Abspielerliste lesen
Aufruf
````
data/abspieler.json
````
Antwort
````
{
  "abspielerliste": {
    "titel": "Abspielerliste",
    "inhalt":  [
      {
        "abspielerid": 1,
        "abspielername": "dieses Gerät",
        "abspielerurl": "",
        "abspielertyp":"lokal",
        "abspielerbild": "",
        "abspielerzustand":""
      },
      {
        "abspielerid": 2,
        "abspielername": "Raspberry Pi Wohnzimmer",
        "abspielerurl": "",
        "abspielertyp":"pirc",
        "abspielerbild": "",
        "abspielerzustand":"selected"
      },
      usw.
    ]
  }
}
````
#### Neuen Abspieler speichern
Noch nicht realisiert.
#### Änderungen an einem Abspieler speichern
Noch nicht realisiert.
#### Abspieler löschen
Noch nicht realisiert.