WIP: Touchscreen Jukebox für den Junior ("Sonos Kids Controller")

[Thyraz]

Hallo zusammen.

Nachdem der junge Herr (4 Jahre) der bisherigen Toniebox-Kopie mit RFID Karten (http://phoniebox.de) langsam entwächst,
versuche ich mich gerade an einem altersgerechten Nachfolger.

Er hört mittlerweile recht viele Hörspiel-Serien und nicht mehr nur einzelne Lieder und Geschichten, wodurch wir mit RFID-Karten bedrucken und konfigurieren längst nicht mehr hinterherkommen und die meiste Zeit über unsere Handys Hörspiele von Spotify in sein Zimmer streamen.

Es musste also eine neue Lösung her.

Am besten erstmal runterscrollen und die angehängten Fotos anklicken, damit der Text nicht so trocken ist.

Update 12.08.2020
Interessierte können das ganze schonmal testen unabhängig von der finalen Hardware.
Einfach die Software wie auf Github beschrieben installieren und dann das Frontend in einem Browser auf dem Desktop oder am Handy öffnen.

Projektseite auf Github:
https://github.com/Thyraz/Sonos-Kids-Controller


Eckdaten:
- Raspberry als Hirn
- kapazitiver Touchscreen, damit die Bedienung auch Spaß macht
- hübsches und kompaktes Gehäuse
- Ausgabe über Sonos
- Sowohl Spotify als auch die lokale Sonos Library als Quelle möglich

- Softwareseitig eine Webapp die im Kiosk Mode eines Browsers läuft
- Umsetzung in Node.js (Backend) und Ionic/Angular (Frontend)
- Hauptmenu als Artist-Übersicht (Rabe Socke, Pipi Langstrumpf, Urmel, ...)
- Untermenu dann die einzelnen Alben zum Artist
- Ein Klick auf den Namen des Artists oder eines Albums gibt diesen per Text2Speech aus (4 jährige haben es mit dem Lesen meist noch nicht so )

Damit das Hinzufügen neuer Alben / Serien möglichst einfach ist, wird die Spotify Web API angezapft. Damit können neue Einträge in Klarnamen statt als kryptische ID eingegeben (und mit Such-Querys auch Folgen ganzer Serien auf einmal hinzuzufügt) werden. Auch Cover-Bilder werden dann automatisch von Spotify geladen.

Die Hardware hab ich mittlerweile soweit fertig, als Gehäuse hab ich eine kleine Bambus/Melanin Küchenaufbewahrungsbox gefunden.
Die schwerste Arbeit (für einen mechanischen DAU ohne anständiges Werkzeug) war die Aussparung für den Touchscreen in den Deckel zu bekommen. Hat mich einige Stunden und Nerven gekostet.
Mangels besserer Werkzeuge habe ich zuerst grob das Rechtecke mit der guten (ur)alten Laubsäge aus dem Bambusdeckel herausgetrennt.
Dann mit Feilen und immer wieder Display einpassen langsam die endgültige Form erarbeitet (und die Unebenheiten vom Sägen entfernt).
Zum Schluss dann mit Schleifpapier von sehr grob bis letztendlich Körnung 320 das Finish gemacht.
Den Lack an der Oberfläche des Deckels dann auch etwas angeschliffen und danach das Holz für einen einheitlichen Look mit Holzöl von unserem Parkett geölt.
Das Resultat sieht wider erwarten überhaupt nicht selbstgebastelt aus. Das sehr feine Schleifen und das Ölen haben hier am Ende wirklich Wunder bewirkt.

Danach Display rein, HDMI und USB für Power + Touch an den Raspy.
Diesen dann noch mit einem Unterdeckel eines alten Raspberry Gehäuses und einem Tesa PowerStrip im Gehäuse befestigt.

Zum Schluss dann an der Rückseite noch ein Loch gebohrt, den Stecker vom USB-Ladekabel abgezwickt, Kabel durch das Loch geführt und Stecker wieder angelötet.

Links zu den verwendeten Teilen, sowie Installationsanleitung für den Betrieb des Kiosk-Browsers findet sich hinter dem Github Link.

Hoffe damit ein paar Leidensgenossen helfen zu können, da im Netz schon oft der Wunsch nach einem "Sonos Controller für Kids" geäußert wurde.
Auch die Ankündigung der Spotify App für Kids hatte mir da große Hoffnungen gemacht, die Spotify aber mit ihrer Umsetzung dann auf beeindruckende Weise das Klo runtergespült hat.

Falls jemand noch coole Ideen hat (sei es Hardware oder auch Softwarefeatures), immer heraus damit.

[Thyraz]

Die Software ist soweit in einer ersten Version nutzbar, auch wenn sich noch einiges tun wird:
https://github.com/Thyraz/Sonos-Kids-Controller
Siehe Readme dort.

Wer Kinder, Sonos und evtl. sogar Spotify Premium hat, kann das bei Interesse auch erstmal ohne Hardware testen.
Einfach auf einem Rechner mit Node.js einrichten und im Browser auf dem Laptop oder dem Handy öffnen.
Habe das zu Testzwecken neben der eigentlichen Box vom Junior auch als weitere Instanz noch komplett auf dem Laptop laufen.

[Thyraz]

So, erster Post ist nun auch überarbeitet (Zusammenfassung was nun wirklich verwendet wird, statt der Vorab-Ideen).

[Thyraz]

Die oben verlinkte Github Anleitung ist mittlerweile fertig gestellt.

Die Kapitel zu den verwendeten Hardwarekomponenten sowie der Installation der Hardware-Jukebox mit Browser im Kiosk Modus sind nun auch mit drin.

[der-Lolo]

Hallo Thyraz,
schöner Thread hier - aktuell arbeitet bei der kleinen ein ESP32 welcher IDs von magnetischen iButtons ausliest...
Fhem linkt dann die Id zur passenden Sonos Playlist.
(Also ähnlich Deiner RFID Lösung)
Die gleichen Probleme wie du haben wir auch - Hörspiele sind nun im Kinderzimmer angekommen...

Wir nutzen aber Apple Music und nicht Spotify.
Könnte man das System mit einfachen handgriffen anpassen sodass nicht bei Spotify gestreamt wird?

[Thyraz]

Unter der Haube wird https://github.com/jishi/node-sonos-http-api für die Sonos Anbindung verwendet.
Das kann auch Apple Music.

Man wird also wie bereits jetzt für lokale Medien (z.B. auf dem NAS) auch für Apple Music als Source hinzufügen können.

Für Spotify habe ich halt noch eine sehr komfortable Möglichkeit eingebaut, damit man mit einer Suchabfrage ganze Hörbuchserien hinzufügen kann.
"artist:Benjamin Blümchen" als Query bringt hier halt alle Benjamin Blümchen Alben auf einmal auf die Box.
Dazu hab ich noch separat die Spotify Web API angezapft.

Sowas gibt es halt leider bei keinem anderen Streaming Anbieter.

Du müsstest halt die Alben alle als einzelne Einträge hinzufügen, was je nach Hörspielserie doch so einige sind.
Immerhin kann die oben verlinkte Sonos Bibliothek bei Apple Music auch Alben über Klartext Suche abspielen.
Im Gegensatz zu Amazon Music, wo man für jedes Album die AlbumID herausfinden muss, ist das schonmal weit bequemer.

Das Erweitern für Apple Music kann ich auf alle Fälle machen wenn du die Box wirklich nachbauen willst.
Ich kann es nur nicht testen mangels eigenem Account, das vorher reinzubasteln hat daher für mich wenig Sinn gemacht.
Ich habe mittlerweile gesehen, dass das original Pi Display (etwas größer mit 7") die gleiche Auflösung zu haben scheint wie mein 5" Display.

Will man weniger basteln, wäre also auch so ein Originaldisplay + das passende offizielle Gehäuse für Display + Pi sicher mit meiner Software kompatibel...

[laberlaib]

Jetzt macht Dir Sonos das SNIPS-Modul kaputt und du entwickelst weiter für die...
Die Phoniebox hab ich auch gebaut, die kommt so "mittel" an.

Ich finde das Projekt super, nur leider auf dem falschen System, wir haben Squeezeserver und Squeezeboxen.
Aber dafür habe ich keinerlei kinderfreundliche GUI als App oder als Website gefunden habe. Und bis ich gelernt habe, so etwas zu designen, sind die Kleinen ausgezogen.

Trotzdem werd' ich mir mal Gehäuse und auch die Autostartthematik für den Browser ansehen - das sieht gut aus.

[KingKahn]

Das Erweitern für Apple Music kann ich auf alle Fälle machen wenn du die Box wirklich nachbauen willst.

@Thyraz: Planst Du die Umsetzung noch? Habe mir schon alle Teile bestellt und eine Testumgebung mit Spotify am Laufen. Würde aber gerne auf Apple Music wechseln, weil ich nicht zwei Abos laufen lassen will. Danke fürs Feedback!

[Thyraz]

Oh sorry den Thread voll verpennt.

Ja kann ich gern machen, bin gerade nur anderweitig auch noch ziemlich eingespannt.
Ich schau mal ob ich die Tage dazukomme. An sich sollte das nur ein weiterer Tab im Add-Music Screen sein,
sowie ein Apple Music spezifischer Sonos Aufruf zum abspielen.

[KingKahn]

Das wäre super! Mit Spotify klappt das schon sehr gut und meine Kinder sind bis jetzt sehr begeistert.

[SouzA]

Hi,
Funktioniert das nur mit Sonos oder auch mit anderen Netzwerkplayern (Chromecast, usw.)
Ich bin auch schon lange auf der Suche nach was vernünftiges für die Kleine.

Und ich bin auch deiner Meinung, dass Spotify die Spotify-Kids echt verkackt hat...

Bis denn
SouzA

[Thyraz]

Das wäre super! Mit Spotify klappt das schon sehr gut und meine Kinder sind bis jetzt sehr begeistert.

So habs endlich geschafft Apple Music und Amazon Music Unlimited hinzuzufügen.

Nachteil ist halt, dass man die Spotify API für Album-Massensuche und Artwork-Suche hat.
Es müssen dann eben alle Alben einzeln über die jeweilige Album-ID hinzugefügt werden.
Auch das Cover-Artwork muss händisch eingetragen werden.

Hoffe es funktioniert alles, habe leider keine Accounts bei den Musikdiensten um es zu testen.
Aber die Kommandos, die an den Sonos-Dienst geschickt werden sehen auf den ersten Blick zumindest korrekt aus.

Hinweise zum Content hinzufügen siehe hier:
https://github.com/Thyraz/Sonos-Kids-Controller#apple-music-or-amazon-music-unlimited

[Thyraz]

Funktioniert das nur mit Sonos oder auch mit anderen Netzwerkplayern (Chromecast, usw.)
Ich bin auch schon lange auf der Suche nach was vernünftiges für die Kleine.

Hi SouzA, das ganze ist ja nur ein hübsches Frontend für node-sonos-http-api.
Somit funktioniert das leider auch nur mit Sonos.

Natürlich könnte man so etwas einbauen.
Alles was mit node-sonos-http-api kommuniziert ist in player.service.ts drin.
Das ist sehr wenig Code...
https://github.com/Thyraz/Sonos-Kids-Controller/blob/master/src/app/player.service.ts
Der Rest der Software ist völlig unabhängig von Sonos.

Man könnte also die server/config/config.json erweitern:
https://github.com/Thyraz/Sonos-Kids-Controller/blob/master/server/config/config-example.json
Um eine Section für andere Playertypen als node-sonos-http-api.

in der player.service.ts müsste man dann eben die Fallunterscheidung machen, wie der Service angesprochen werden muss.
Am schönsten wäre es da wahrscheinlich den Aufbau der eigentlich nötigen HTTP-URLs dann eine chromecast-service.ts und eine sonos-service.ts auszulagern die dann eben Funktionen für Content-Laden, Play, Pause, ... haben.
Diese würden dann je nach konfiguriertem Service von player.service.ts angesprochen werden.

Ich muss aber zugeben aktuell genug andere Baustellen zu haben als mir so etwas ans Bein binden zu wollen (abgesehen davon, dass ich selbst eben nur Sonos nutze für diese Zwecke).
Wenn das jemand aber sauber umsetzt, freue ich mich jederzeit über einen Pull Request.

[Thyraz]

Hier hat jemand einen zu node-sonos-http-api kompatiblen Service geschrieben, der direkt die Spotify API anspricht um die Musik dann auf Spotify Connect Devices auszugeben.
https://github.com/amueller-tech/spotifycontroller

Man kann den Sonos-Kids-Controller dann anstatt mit Sonos Geräten auch mit anderen Spotify Connect fähigen Geräten betreiben.
Evtl. wird es damit ja für den einen oder anderen interessanter.

Auch diverse Eigenbau Streamingboxen wie die Squeezeboxen sind ja soweit ich weiß mit Spotify Connect kompatibel.
Wie das mit Chromecast aussieht weiß ich nicht...

[gloob]

Vielen Dank für das tolle Tool. Hab es gerade in einem LXC Container unter Proxmox installiert und konnte direkt Radiosender auf meiner Box auswählen.
Die Anzeige auf einem Pi mit Touch kommt als nächstes