Eine Web -App, mit der Ihr aktueller Song auf Spotify angezeigt wird. Ermöglicht Sie, Songs zu überspringen, zu spielen/pausieren und mögen/im Gegensatz zu. Analysiert das Album -Kunstwerk, um Hintergrund- und Vordergrundfarbe für das Bild zu wählen. Umfragen alle zwei Sekunden, um das Display zu aktualisieren, um Ihren aktuell spielenden Song zu zeigen. Skalen auf die Größe Ihres Displays mit dynamischem Layout.
Ich habe mein Projekt gestartet, indem ich eine grundlegende Site einrichtete, um Raw JSON meiner Spotify -Daten mit Spotipy, einer Open -Source -Spotify -Python -API, anzuzeigen. Später schrieb ich ein JavaScript, um die Spotify -API alle zwei Sekunden zu befragen, um nach Änderungen zu suchen. Wenn sich das Lied geändert hat, wird die Seite mit den neuen Informationen aktualisiert.
Ich berechnet die Farbpalette mit einer JavaScript -Bibliothek namens Colorthief, die die dominierende Farbe für den Hintergrund und eine kontrastierende alternative Farbe aus der Palette für den Text greift. Die Textfarbe ist nicht nur schwarz oder weiß, sondern auch einige alternative Farben, um eine ganze Palette zu bilden, und findet eine Farbe aus der Palette, die sich mit der ausgewählten Hintergrundfarbe im Kontrast stellt.
Ich verwende Google -Material -Symbole für die Wiedergabesteuerungssymbole. Dies ermöglicht eine einfache Skalierung zu verschiedenen Bildschirmgrößen, ohne separate Bilder zu benötigen.
Es war eine Herausforderung, die Anordnung von Elementen auf dem Bildschirm und die Skalierung für verschiedene Displays zu erhalten. Ich wollte, dass es auf irgendetwas von einem PC mit einem Landschaftsbildschirm zumindest tolerierbar aussieht. Es ist nicht perfekt, aber es ist ziemlich solide. Darüber hinaus war es schwierig, zu finden, an welchem Punkt der Text weiß anstelle von Schwarz sein sollte. Ich musste sicherstellen, dass die Songdetails leicht lesbar sein würden, egal welcher Song in diesem Moment spielte.
Es gibt viele verschiedene Möglichkeiten, wie Sie diese WebApp hosten können. Ich persönlich benutze fly.io. Sie müssen auch eine Spotify -Entwickleranwendung einrichten, um Ihre Spotify -Client -ID und Ihre Client -Geheimnis zu erhalten.
Erstellen Sie ein Spotify -Entwicklerkonto, wenn Sie keine haben, und erstellen Sie eine neue App. Sie müssen die Client -ID und das Client -Geheimnis zur Kenntnis nehmen. Hosten Sie die WebApp mithilfe einer der folgenden 3 Optionen:
Gehen Sie dann zurück zum Spotify Developer Dashboard und betreten Sie den Umleitungs -URI. Stellen Sie sicher, dass Sie alle nachverfolgenden Schrägstriche entfernen. Es sollte funktional sein!
Es gibt zusätzliche Informationen zum Einstellen der Umgebungsvariablen und zum lokalen Hosting in einem großen Kommentar oben in App.Py.
Ursprünglich war dies ein Projekt für den Harvard CS50 -Kurs. Seitdem habe ich eigene Funktionen hinzugefügt. Sie können die ursprüngliche CS50 -Version in einer separaten Filiale sehen. Seitdem habe ich den Farberkennungsalgorithmus massiv verbessert. Es gibt jetzt auch eine ausgewiesene "Raspi" -Ast, die zusätzliche Codezeilen enthält, um einen lokalen Webserver anzurufen, um den Bildschirm des Raspberry Pi auszuschalten, wenn Musik nicht abgespielt wird.
Ich beabsichtige immer noch, dies zu aktualisieren, um Fehler mit der Farberkennung und der Bildschirmskalierung, ein paar weiteren Schaltflächen und Bonusfunktionen zu beheben.