Achtung: Die folgenden Informationen behandeln die Konsole v3, welche seit Februar 2020 nicht mehr unterstützt wird. 

Technische Dokumentation: Die Konsole anpassen

Diese Dokumentation richtet sich an Webentwickler und Techniker, die den JavaScript-Code der Konsole verändern wollen, um sie anzupassen und neue Funktionen und Inhalte hinzuzufügen.

Theme

Das Logo des Senders und das Hintergrundbild bzw. die -farbe können im style/theme.css verändert werden. Wenn Sie einen dunklen Hintergrund wählen, müssen Sie die Bedienelemente auf die helle Variante umstellen. Um dies zu tun, öffnen Sie index.html und scrollen Sie zu der Zeile, die mit <div class="Radioplayer"> beginnt. Hier sehen Sie das dunkle Theme als voreingestellt und können dies auf das helle Theme ändern.

Außerdem müssen Sie das Sender Logo aktualisieren um zu Ihrer Website zu verlinken und den Text, der Ihren Sendernamen beinhaltet. Um diese Anpassungen vorzunehmen, gehen zur Zeile < a class="stn-logo&qu> und aktualisieren Sie den ‚href' parameter mit der URL zu Ihrer Website. Zudem ersetzten Sie die zwei Instanzen von ‚Your Station Name' mit Ihrem Sendernamen.  

Einstellungen

Diese finden Sie relativ weit oben in der index.html. currentStationID und currentStationName müssen Ihre Radioplayer ID und Ihr Sendername sein. Kontaktieren Sie uns über sender@radioplayer.de, wenn Sie Ihre Radioplayer ID nicht wissen. nowPlayingSource können Sie ‚default' lassen. Diese Einstellung verändert das Verhalten im ‚now playing' Balken.

Die Konsole wird den Balken mit folgenden Inhalten, sofern nicht anders eingestellt, in dieser Reihenfolge befüllen:

  • Der aktuell gespielte Titel, bereitgestellt als PE (Programme Event) für Radioplayer.
  • Das aktuelle Programm On-Air, bereitgestellt als PI (Programme Information) für Radioplayer.
  • Die Metadaten, die vom live audio stream kommen.
  • Die Beschreibung des Senders, bereitgestellt in SI (Service Information) für Radioplayer.
  • Der Name des Senders, bereitgestellt in SI (Service Information) für Radioplayer

Wenn Sie wünschen, können die Inhalte des Balkens an eine bestimmte Quelle gebunden werden. Andere Optionen für nowPlayingSource beinhaltet:

  • ‚default-no-stream' - dies verwendet die default-Einstellungen, welche oben gelistet sind, ausgenommen dem Stream mit den Metadaten
  • ‚stream' - dies verwendet ausschließlich die Metadaten des Streams "
  • ‚SI' - dies verwendet entweder die Beschreibung des Senders (wenn bereitgestellt) oder den Namen, der von Ihrer SI für Radioplayer zur Verfügung gestellt wird "
  • ‚PI' - dies verwendet den Namen des Programms, der via PI für Radioplayer zur Verfügung gestellt wird 

xDomainProxyUrl muss auf die volle URL in der xdomainproxy.html-Datei gesetzt sein. Per default können Sie diese im preroll-framework directory finden. Diese Datei wird genützt, wenn eine preroll-Überlagerung aktiviert ist.

initOption beinhaltet 3 Optionen, welche, wenn sie aktiviert sind, zugehörige Einstellungen im Radioplayer Zentralsystem überschreiben. Alle Details bezüglich dieser Optionen finden Sie unter "Kommerzielle Einstellungen".

 

Stream

Für HTML5, beachten Sie bitte folgende Punkte:

1. In der index.html Datei sollte das Setting preferHtml5Audio folgendermaßen aussehen:

 // -- Set preferHtml5Audio to true to give preference to HTML audio playback over Flash

var preferHtml5Audio = true;

 2. In der index.html-Datei sollte der HTML5-Audio-Stream so aussehen (am Beispiel von 1live):

 var audioHTML = [

{

audioType: 'http',

audioUrl: 'http://1live.akacast.akamaistream.net/7/706/119434/v1/gnl.akacast.akamaistream.net/1live'}

];

Sind beide Einstellungen richtig gesetzt und Ihr Audio-Stream ist mit HTML5 kompatibel, dann wird auch Flash nicht verwendet. Es sei denn, der verwendete Browser unterstützt kein HTML5.

Für alles andere gilt:

  • Die Einstellungen für den Stream oder On-Demand Audio finden Sie recht weit oben im index.html.
  • audioLive soll für Live Streams true und für On-Demand Audio false sein.
  • audioFlash beinhaltet die Optionen für den Stream.
  • audioType kann ‚playlist‘, ‚http‘, ‚httpmp4m4a‘, ‚rtmp‘ sein.
  • audioURL soll für die Playlist, http und httpmp4m4a gesetzt sein.
  • audioServer und audioEndpoint sollen für rtmp gesetzt sein.
  • bufferTime kann, wenn nötig, angepasst werden.

Für audioType ‚playlist‘ werden folgende Playlist-Formate unterstützt: SMIL, ASX, XSPF, PLS, M3U. Links zu ‚playlist within playlists‘ werden ebenfalls unterstützt.

RTMP Streams mit ‚server-endpoint‘ Konfigurationen sind in Playlists nur dann konfigurierbar, wenn sie das XSPF und SMIL Format verwenden.

Wenn Sie einen Stream haben, der von Browsern, die Audio ohne Verwendung des Adobe Flash Players abspielen können, unterstützt wird, können Sie die Parameter für audioHTML spezifizieren. Das RTMP-Format wird bei diesem Szenario nicht unterstützt. Der audioHTML-Stream wird von einem Browser verwendet werden, der keinen Flash benützt, oder auf einem Gerät auf welchem die Installation von Flash nicht möglich ist (z.B.: iPad).

Einige Streams/Playlisten werden nicht abgespielt, wenn Security Errors aufgrund nicht implementierter Adobe crossdomain policy permissions Ihres Streaminganbieters auftreten.

Erhalten Sie den Security Error können Sie Ihrem Streaminganbieter diese Beispieldatei für eine Adobe cossdomain policy senden. Sie finden diese ebenfalls in der kompletten Radioplayer.zip.

<?xml version="1.0" ?>
<!DOCTYPE cross-domain-policy (View Source for full doctype...)>
<cross-domain-policy>
<site-control permitted-cross-domain-policies="all" />
<allow-access-from domain="*.example.com" secure="false" />
<allow-http-request-headers-from domain="*.example.com" headers="*" secure="false" />
</cross-domain-policy>

Mehr Informationen dazu finden Sie hier:
http://www.adobe.com/devnet/adobe-media-server/articles/cross-domain-xml-for-streaming.html

Bitte beachten Sie: HTTPS wird unterstützt, bitte achten Sie darauf, keinen Mixed-Content zu erstellen (Bilder, URL, Werbung).

Metadaten an den Radioplayer übermitteln

Übermitteln Sie uns am besten alle Songinformationen, Metadaten etc. via Ingest. Damit funktioniert auch die Suche einwandfrei. Die Grundlagen

Die Radioplayer-Metadaten sind eine Erweiterung der DAB EPG specification. Diese teilen sich in folgende Bereiche auf:

SI (Service Information)

Dies sind die grundlegenden Daten zu Ihrer Station. Sie beinhalten zum Beispiel den Sendernamen, das Logo, die Beschreibung, etc. Sie spezifizieren jedoch noch nicht, welche Sendung gerade on air ist, oder welcher Song läuft.

https://ingest.radioplayer.de/ingestor/metadata/v1/si/

PI (Programme Information)

Sie können Beginn, Ende und Beschreibung einer Sendung an uns übermitteln. Zusätzlich kann zum Beispiel eine URL angegeben werden, unter der die Sendung nach Ausstrahlung als On Demand Inhalt zur Verfügung steht.https://ingest.radioplayer.de/ingestor/metadata/v1/pi/

OD (On Demand)

In diesem Zusammenhang bezieht sich On Demand nicht auf komplette vergangene Sendungen, sondern auf Inhalte, die in Ergänzung hierzu zur Verfügung gestellt werden sollen. Zum Beispiel Podcasts von Ihrer Comedy, etc..

https://ingest.radioplayer.de/ingestor/metadata/v1/od/

PE (Programme Event)

Programme Events werden genutzt, um Informationen über den aktuellen Song zu übermitteln. 

https://ingest.radioplayer.de/ingestor/metadata/v1/pe/

Der Ablauf

Radioplayer stellt die aktuellen XML-Spezifikationen auf dieser Seite zum Download bereit.

Die Übermittlung der XML-Metadaten erfolgt mittels HTTP-POST (cURL). Unsere Implementation weicht dabei etwas von den üblichen Systemen ab. Dies ist darin begründet, dass unsere Systeme die Daten asynchron verarbeiten. Anstelle einer direkten Rückmeldung erhalten Sie nur eine URL als Rückgabe. Unter dieser URL kann der Verarbeitungs-Status im Anschluss abgefragt werden.


Ein PI-XML-Dokument kann mittels des folgenden Befehls an die Schnittstelle übermittelt werden:

curl -X POST -H "Content-Type:APPLICATION/OCTET-STREAM" --data-binary @<filename> -u "ingestuser:ingestpassword" "https://ingest.radioplayer.de/ingestor/metadata/v1/pi"


Eine Sonderstellung nehmen die PE (Programme Events) ein. Diese müssen nicht zwingend als XML übermittelt werden, sondern können direkt als HTTP-Aufruf übermittelt werden. Zum Beispiel mittels cURL:

curl -k -v -u "ingestuser:ingestpassword" -X POST --data "rpId=99&startTime=2014-10-13T10:44:00&duration=600&title=Postcards&artist=James+Blunt" "https://ingest.radioplayer.de/ingestor/metadata/v1/np/"


Folgende Parameter müssen dabei übermittelt werden
:

  • RPID: ID des jeweiligen Kanals (siehe Konsole)
  • StartTime: Start-Zeitpunkt des aktuellen Songs. Hinweis: Die startTime muss in ISO8601 mit der Zeitzone UTC angegeben werden. Empfohlen wird das Format: YYYY-MM-DDThh:mm:ss
  • Duration: Die Dauer des aktuellen Songs in Sekunden. Angabe in vollen Sekunden, ohne Nachkommastellen.
  • Title: Titel des aktuellen Songs (max. 128 Zeichen)
  • Artist: Interpret des aktuellen Songs (max. 128 Zeichen)
  • Description (optional): Eine Beschreibung (max. 180 Zeichen)
  • Image Url (optional): Eine absolute URL zu einem Bild, welches in den Suchergebnissen angezeigt wird. (Das Bild muss eine Größe von 86x48 Pixel aufweisen)


Hierbei ist zu beachten
:

Die Daten müssen zwingend mittels POST übergeben werden. Ist dies in Ihrer technischen Umgebung nicht möglich, haben wir ein kleines PHP-Skript erstellt. Es nimmt die Daten mittels GET entgegen und leitet sie per POST weiter. Es steht hier zum Download bereit.

Die Werte der title- und artist-Parameter müssen urlencoded übermittelt werden

Kommt es bei Ihren Streamingservern zu einem zeitlichen Delay (z.B. durch Transcoding, Ad-Injection etc.), empfehlen wir, die Startzeit entsprechend um das Delay zu erhöhen. Ansonsten erscheinen die PE nicht mehr synchron zu den Songs in der Konsole und den Apps.

Hinweis zu den Einstellungen bei Zenon Metadata Export

Eingabe im Fenster "Destination"

  • Type: HTTP POST
  • Destination: Die URL so wie im obigen Beispiel verwenden: https://ingest.radioplayer.de/ingestor/metadata/v1/np/
  • Encoding: UTF-8
  • Im Format String: rpId=<ID der Station>&startTime=%"%UTC%Y-%m-%dT%H:%M:%S"NOW&duration=%"S"PACKET.LENGTH&title=%{urlutf8(%PACKET.TITLE)}&artist=%{urlutf8(%PACKET.NAME)}
    (<ID der Station> mit der ID der Station ersetzen, z.B. rpId=1115)

Rückgabewerte auslesen

Nach jeder Anfrage erhalten Sie eine direkte Rückmeldung über den HTTP-Status-Code:

202 Accepted

Die Anfrage / das Dokument wurde erfolgreich entgegengenommen und wird von unseren Systemen nun verarbeitet.

Sie erhalten zudem ein HTTP-Header-Feld "Location", in welchem die URL zur Abfrage des Verarbeitungsstatus mitgeteilt wird.

< HTTP/1.1 202 Accepted 
< Server: Apache 
< Set-Cookie: JSESSIONID=625071D14AE4F16E4A8E26466F5E9BD5; Path=/ingestor/; Secure; HttpOnly 
< Location: https://ingest.radioplayer.de/ingestor/metadata/v1/946142 
< Content-Length: 0 
< Connection: close 
< Content-Type: text/plain; charset=UTF-8

Unter dieser URL erhalten Sie dann die jeweiligen Informationen im JSON-Format:

{
 "id":"261702",
 "timestamp":"30Mar2012 17:17:04 BST",
 "protocol":"Http",
 "type":"PI",
 "scope":" RpIds:308 startTime:20120120T00:00:00Z, stopTime:20120121T00:00:00Z",
 "downstreamStatuses":[
   {
     "downstream":"solr",
     "status":"accepted"
   }
  ]
}

503 RetryAfter

Es befinden sich zu viele Anfragen / Dokumente von Ihnen in der Warteschlange. Sollten Sie diesen Fehler sehr oft erhalten, kontaktieren Sie bitte unser Support-Team.

Podcast-Kategorien für XML-API

·      Comedy

·       urn:radioplayerde:metadata:cs:Category:2014:1

·       Hörspiel

·       urn:radioplayerde:metadata:cs:Category:2014:7

·       Kultur/Talk

·       urn:radioplayerde:metadata:cs:Category:2014:6

·       Nachrichten/Sport/Info

·       urn:radioplayerde:metadata:cs:Category:2014:2

·       Pop/Charts

·       urn:radioplayerde:metadata:cs:Category:2014:3

·       Ratgeber/Wissen

·       urn:radioplayerde:metadata:cs:Category:2014:5

·       Unterhaltung/Lifestyle

·       urn:radioplayerde:metadata:cs:Category:2014:4

RSS Podcasts / Erweiterung der Spezifikationen

Hier finden Sie die RSS-Schemaerweiterung, die es Radioplayer Search Ingest ermöglicht, Podcast-Dateien direkt in den Suchindex aufzunehmen.

Neues Element (optional)

Element

Parent-Element

Beschreibung

<player>

<item>

Dieses Element in RSS wird abgebildet als <radioplayer:player> Element im OD Format.

Extra Validierung

1. Entweder <title> oder <description> sollte in jedem <item> Element stehen.

2. Folgende Elemente sind ebenfalls erforderlich in <item>

· pubDate

3. Das Element <pubDate> sollte das RFC-822 Format haben

 (java pattern: “EEE, dd MMM yyyy HH:mm:ss Z”)

Optionale Verarbeitung

Ist das <player> Element vorhanden, wird es vom Suchsystem auch verwendet. Sucht ein User nach einem Begriff, der zum Content der Podcasts passt, wird die Player-URL im href für die Suchergebnisse an den User zurückgegeben

Wird kein Player Element zur Verfügung gestellt, errechnen wir den href Wert anhand der Daten, die dem Radioplayer über das Self Service Portal (SSP) übermittelt wurden, unter Einbeziehung der URL für den Podcast.

Wurde etwa im SSP eine Basis On-Demand-URL eingestellt:

http://www.myradiostation.com/ondemandplayer

Im Podcast etwa Folgende:

http://www.mycdn.com/ondemand/20120101-a.mp3

Dann würde diese URL entstehen:

http://www.myradiostation.com/ondemandplayer?rpAodUrl=http://www.mycdn.com/ond emand/20120101-a.mp3

Der Sender muss eine Version der Radioplayer Konsole hosten, die die o.g. URL lesen und korrekt streamen kann.

Die Radioplayer Referenzkonsole besitzt einen integrierten Support für den oben geschilderten Prozess, um On-Demand Audioinhalte abzuspielen, wenn die Audioinhalte in mp3-over-http ausgegeben werden.

Element-Beschreibungen

Element

Parent Element

Entsprechender OD XML Tag

Description

Example

<title>

<item>

<shortName> and <mediumName>

Wenn dieses Element vorhanden ist, wird sein Wert nach dem Zuschneiden auf die erforderliche Länge auf <shortName> und <mediumName> abgebildet.

Venice Film Festival Tries to Quit Sinking

<description>

<item>

<mediumName> and <longName>

Wenn dieses Element vorhanden ist, wird sein Wert nach dem Zuschneiden auf die erforderliche Länge auf die Werte <mediumName> und <longName> abgebildet.

Some of the most heated chatter at the Venice Film Festival this week was about the way that the arrival of the stars at the Palazzo del Cinema was being staged.

<pubDate>

<item>

<epg:ondemand> <radioplayer:availability> <radioplayer:scopestartTi me>

Dieser Elementwert wird als Startzeit des On-Demand-Programms genommen und die Stoppzeit wird nach den projektierten Parametern in Station List Manager berechnet.

Sun, 19 May 2002 15:21:36 GMT

<player>

<item>

<radioplayer:player>

Dieses Element wird als Radio-Player-Konsolen-URL für das Programm verwendet.

http://sampleradio.com player/od

 

Ein Beispielpodcast

<?xml version="1.0" encoding="utf-8"?>
<?xml-stylesheet title="XSL_formatting" type="text/xsl" href="/core/podcasts/rss.xsl"?>
<rss xmlns:atom="http://www.w3.org/2005/Atom">
<channel>
<title>The Dummy Channel Title</title> <link>http://www.dummychannel.co.uk/artists/dummychannel/</link>
<description>The dummy channel description</description>
<language>en</language>
<pubDate>Wed, 26 Oct 2011 16:28:41 +0100</pubDate>
<item>
<description>The Red Guitar, We Will Rock You, 40 years of Queen and more</description> <pubDate>Thu 6 Oct 2011 10:50:16 +0100</pubDate> <link>http://www.dummyLink.co.uk/podcasts/dummyprogramme/2011-10-06/</link>
<enclosure url="http://podcast.net/dummy/20111006105016.mp3" length="0" type="audio/mpeg" /> <player>http://www.dummyLink.co.uk</player>
</item>
</channel>
</rss> 

Werbung in der Konsole

Die responsive Radioplayer-Konsole bietet die Möglichkeit, auch über der grauen Menü-Leiste Werbeflächen zu schaffen. Dazu kann der gesamte Player per CSS nach unten verschoben werden.

Um zum Beispiel einen Megabanner oder Wallpaper mit 90px Höhe über die Radioplayer-Konsole zu positionieren kann folgende CSS-Definition genutzt werden:

.console-wrapper { 
      padding-top: 90px; 
      height: 100%; 
      box-sizing: border-box; 
}

Das eigentliche Werbemittel kann innerhalb des Body-Tags eingefügt werden:

<body>
<div id="adLayerTop">
      <script type="text/javascript">adCode();</script>
</div>
...

Der Container muss entsprechend “absolute” positioniert werden:

#adLayerTop { 
      position: absolute; 
      left: 0px; 
      top: 0px; 
      width: 735px; 
      height: 90px; 
}

Soll ein Skyscraper oder Wallpaper rechts oder links von der Radioplayer-Konsole eingefügt werden, kann auf eine ähnliche Art und Weise verfahren werden. Der gesamte Player muss dann in der Breite beschränkt werden:

.console-wrapper { 
      padding-top: 90px; 
      height: 100%; 
      box-sizing: border-box; 
      max-width: 1000px; 

#adLayerRight { 
      position: absolute; 
      left: 1010px; 
      top: 98px; 
}

Bitte beachten Sie: Es muss über entsprechende CSS-Media-Queries sichergestellt werden, dass diese Werbemittel nur auf den entsprechenden Bildschirmgrößen angezeigt werden, für die Sie geeignet sind.

So darf zum Beispiel auf einem Smartphone mit einer Display-Breite von 320px kein Banner mit 720px Breite ausgespielt werden.

Weiter zum Changelog mit der Liste aller Änderungen und neuen Features.

PlugIn Space

Der Platz für das Plug-in kann vollkommen individualisiert werden. Sie finden dies nahezu am Ende der index.html Datei. Der Bereich ist durch Anfangs- und Endkommentare klar ersichtlich.

Audio Clips abspielen

Ein Audio Clip kann in der Konsole durch das einfache Hinzufügen der Konsolen URL ?rpAodUrl= followed abgespielt werden. Die Konsole wird versuchen, sich die ‚now playing‘ Informationen vom Zentralsystem oder beim Durchsuchen auf sämtliche ID3 Metadaten in den Audiodateien, zu beschaffen.

Kommerzielle Einstellungen

Das initOptions Objekt, welches Sie im head-Bereich des index.html finden, erlaubt Ihnen 3 kommerzielle Einstellungen für Ihre Konsole auszuwählen. Diese Optionen können ebenfalls im Zentralsystem von Radioplayer aktiviert werden.

Interstitial

Ändern Sie enabled auf true um ein Interstitial zu aktivieren und vervollständigen Sie die URL mit der URL Ihrer Interstitial-Seite. Das Interstitial wird erscheinen sobald die Konsole gelaunched ist, aber nicht, wenn von einem zum anderen Radioplayer navigiert wird.

Sie können das Template, welches im Pre-roll-Framework/index.html bereitgestellt wird verwenden. Fügen Sie einen Skip Button hinzu und bearbeiten Sie das redirecting zurück zu Ihrer Konsole ohne dass das Interstitial erneut angezeigt wird.

Song Action

Ein Song Action ist ein kleiner Button der, während ein Song gespielt wird, auf der rechten Seite des ‚now playing‘ Streifens zu finden ist.  Der Button kann zu einer URL Ihrer Wahl verlinken (z.B. Affiliate bei Amazon zum Kauf des Songs), und den Künstler und/oder Titel in dem Query String mitliefern.

Ändern Sie enabled zu true um eine Song Action zu aktivieren. type soll den Text des Buttons beinhalten. baseurl soll die URL, welche in dem neuen Browserfenster bei Klick auf den Button geöffnet wird, beinhalten.

Wenn Sie artist oder title des gespielten Songs zur URL hinzufügen wollen, können Sie diese in den Platzhaltern [artist] und [title] hinzufügen. Zum Beispiel:

http://www.song-retailer.com/buy.php?artist=[artist]&title=[title]

Wenn Sie artist und title in ‚URL within a URL‘ einfügen, benötigen Sie eine doppelte Zeichencodierung. In diesem Fall können Sie dies so verwenden: [[artist]] und [[title]]

API Dokumentation

Generieren Sie eine Konsole mit dem Konsolen-Generator im Station Control Panel. Im Quellcode sind die Javascript-Sourcen alle unverschlüsselt und unkomprimiert enthalten. In den Kommentaren sind die einzelnen Funktionen genauer beschrieben.

Hilfreich ist es, wenn Sie sich die vorhandenen Javascript Objekte einfach im Browser anschauen: Sie beginnen alle mit Radioplayer…

Die wichtigsten sind:

Radioplayer.emp = Flash/HTML5 Player-Komponente
Radioplayer.controls = GUI-Elemente wie Start/Stop-Buttons oder Lautstärkeregler
Radioplayer.playing = Statuszeile/Ticker

In den radioplyer.emp.*.js-Dateien finden Sie zudem diverse Events, die der Player erzeugt.

Ein Hinweis: Genutzt wird in der Konsole das minimized Script.

Stream für eigene Audios /Audiowerbespots unterbrechen:

Möchten Sie mittels Javascript die Wiedergabe des aktuellen Streams unterbrechen, so bieten sich die folgenden beiden Funktionen an:

radioplayer.emp.stop();
radioplayer.emp.resume();

Möchten Sie unmittelbar nach dem Aufruf der Konsole den Autostart des radioplayers für einen Prestream-Spot unterdrücken, empfehlen wir den Player nur auf stumm zu schalten. Dies hat den Vorteil, dass die Zeit der Wiedergabe des Prestream-Spots dafür genutzt werden kann, den eigentlichen Audiostream schon zu laden:

radioplayer.controls.mute();

Hinweis: Bei der Funktion mute() handelt es sich um einen Toggle. Den aktuellen Status können Sie mit Hilfe der Variablen radioplayer.controls.currentVolume sowie radioplayer.controls.muted auslesen.

Mittels Setzen der Variable radioplayer.controls.volumeLocked  auf den Wert true  können Sie zudem den Lautstärkebutton für Benutzereingaben sperren. So können Sie sicherstellen, dass ein Nutzer Ihren Prestream-Spot nicht überspringen kann und den Audiostream bereits vor Ablauf des Spots laut schaltet.

Bitte beachten Sie: Von der Verwendung der Funktion radioplayer.emp.setVolume() wird abgeraten! Hintergrund: Die radioplayer-Konsolen hinterlegen die zuletzt gewählte Lautstärkeeinstellung eines Benutzers in einem Cookie, sodass dieser Wert über alle Sender-Konsolen hinweg erhalten bleibt. Überschreiben Sie mittels der oben genannten Funktion nun diesen Wert, sinkt die Usability der Konsolen erheblich.

Eigene Titelanzeige implementieren

Übermitteln Sie bereits mittels Programm-Events (PE) Metadaten an die Radioplayer-Plattform, wird der aktuelle Song automatisch in der Statusleiste der Konsole angezeigt. Dazu sendet die Konsole alle 20 Sekunden ein AJAX-Request an die Radioplayer-Plattform, um die Daten zu aktualisieren.

Möchten Sie darüber hinaus eigene (zusätzliche) Titelinformationen, wie Cover oder Hooks, in Ihrem Plug-in-Space darstellen, empfehlen wir, diese beiden Anzeigen zu synchronisieren:

var lastArtist = “;
var lastTitle = “;
function checkStationSonginfos() {
if(Radioplayer.playing.showingPlayingType == ‚PE‘) {
if(Radioplayer.playing.artist && Radioplayer.playing.artist != lastArtist &&
Radioplayer.playing.title && Radioplayer.playing.title != lastTitle) {
lastArtist = Radioplayer.playing.artist;
lastTitle = Radioplayer.playing.title;
updateEigeneSonginfos();
}
}
}
checkStationSonginfos();
window.setInterval(‚checkStationSonginfos();‘, 1000);

So wird die Statusleiste des Radioplayers jede Sekunde auf eine mögliche Änderung hin überprüft. Sofern sich die Daten ändern, werden dann über die von Ihnen zu implementierende Funktion updateEigeneSonginfos() Ihre weiterführenden Titelinformationen abgefragt. So sparen Sie zudem Traffic-Kosten und vermeiden unnötige AJAX-Requests auf Ihre Server.

jQuery

Radioplayer bindet die Javascript-Bibliothek jQuery auf bekannte Art und Weise ein. Der „noconflict“-Modus wird nicht genutzt.

Zögern Sie nicht unser Support-Team unter sender(at)radioplayer.de zu kontaktieren.

 

Seitliche Navigation

Wenn Sie einen Link in Ihrem Plug-in Space zum Navigieren von einer Konsole zu einer anderen haben, gibt es ein Attribut data-newstationid, welches Sie zu Ihrem Link-Tag hinzufügen können. Dieses kann dadurch für Analytics getracked werden. Hier sehen Sie einen Beispiellink, bei dem XXXX durch die destination player’s Radioplayer ID ersetzt werden soll.

<a href=“http://player.example.com/“ data-newstationid=“XXXX“>My other station</a>