TERRIS® Stereo Internetradio (Teil 4 – fsapi-remote)

Nachdem ich meine fsapi soweit hatte, das die Basics funktionierten fehlte mir ein Anwendungsfall.

Als sich dann auf github jemand meldete, der gerne Beispielcode hätte, habe ich mich dazu entschlossen eine GUI zu bauen.

Eine Website auf einem Gerät, die ein anderes Gerät steuert ist zwar etwas umwegig, für ein erstes Beispiel aber nützlicher als eine lose Scriptsammlung.

Ich fing also an die GUI dafür zu bootstrappen in dem ich mich erst einmal an gängigen Playern orientiert habe:

fsapi_mockup

Dazu benutzte ich bootstrap und jquery.

Nachdem ich mich wieder dem Code zugewendet habe, musste ich einige Elemente streichen, da diese vom Radio überhaupt nicht unterstützt wurden. Das letzte Ergebnis sah dann so aus:

fsapi_bootstrap

Um die Funktion hinter den Buttons und Listen zu implementieren, habe ich mich für xajax entschieden.

Jedes klickbare Element hat dafür 2 klassen bekommen. Die erste Klasse enthällt den Typ (Button, Freitext, Image-SRC usw) die zweite Klasse enthällt den Node (z.B. netRemote.sys.info.version).

So kann ich z.B. alle Elemente in denen Inhalte aus netRemote.sys.info.version benutzt werden updaten und anhand ihres Typs anders behandeln.

Die Nächste Aufgabe war nun nur noch das generieren von Listen und das bestimmen von Aktiven Listen-Elementen.

Dies ging aber dank Vorarbeit in der fsapi problemlos.

Fork me on GitHub