SpotifyBigPicture

SpotifyBigPicture

Eine sehr anpassbare Schnittstelle, die Ihren aktuellen Wiedergabestatus auf Spotify auf einer schönen kleinen Browserseite anzeigt!

Möglicherweise möchten Sie dies über Spotify's Own verwenden (meiner Meinung nach eher überwältigend) Vollbildmodus, oder Sie können ihn für Ihr Fernseher verwenden, um diesen veralteten OSD mit niedriger Auflösung einen frischen Lackierjob zu verleihen!

Diese Schnittstelle ist in erster Linie schreibgeschützt. Insbesondere bedeutet dies, dass Sie Ihre Musik nicht tatsächlich kontrollieren können , über einige grundlegende Befehle wie Spielen, Pause und Überspringen hinaus (muss zuerst in den Einstellungen aktiviert werden). Dies liegt sowohl an Einschränkungen für die Spotify -API als auch daran, diese App einmal einzurichten, und es wird dann dauerhaft als reine Informationsanzeige ausgeführt.

Ein Beispiel, bei dem dies nützlich ist, wäre eine Party, auf der Sie Ihre Gäste jederzeit sehen möchten, welche Songs vor uns liegen, indem Sie einen Monitor in der Nähe der Tanzfläche stellen, die Sie mit einem Raspberry Pi verbinden.

Screenshots

Diese beiden Beispiele zeigen nur Beispiele für das Standardvoreinsatz von SpotifyBigPicture. Weitere Screenshots finden Sie in den anderen Voreinstellungen!

Albumansicht

Wiedergabeliste

Anpassung

Klicken Sie oben links in der Schnittstelle auf das Zahnradsymbol, um die Einstellungen für visuelle Einstellungen zu öffnen. Hier können Sie das Styling der Schnittstelle aus einer Reihe von Optionen mit nur wenigen Klicks anpassen!

Ihre Einstellungen werden automatisch lokal gespeichert, sodass Sie sich bei jeder Wiedereröffnung der Website keine Sorgen machen müssen, alles neu zu konfigurieren.

• Eine vollständige Liste aller Voreinstellungen finden Sie hier: Presets.md
• Allgemeine Informationen zu den Einstellungen finden Sie hier: Einstellungen.MD

Installation

(Wenn Sie ein Video -Tutorial bevorzugen, klicken Sie hier)

Schritt 1: Spotify -App erstellen

1. Erstellen Sie eine App im Spotify Developers Dashboard (Sie müssen möglicherweise zuerst ein Konto erstellen).
2. Kopieren Sie die Client -ID und das Client -Geheimnis und speichern Sie sie für später
3. Gehen Sie zu "Benutzer und Zugriff" und fügen Sie dort Ihr Konto hinzu (Name und E -Mail -Adresse).

Von hier aus können Sie zwischen zwei Möglichkeiten wählen, um mit der Installation fortzufahren.

Schritt 2 - Variante A: Manuelle Java -Installation

1. Klicken Sie nach dem Erstellen der Spotify-App auf "Einstellungen bearbeiten" und fügen Sie den Umleitungs-URI für diese App hinzu: http://localhost:8183/login-callback (Stellen Sie sicher, dass Sie vor dem Speichern auf die Schaltfläche "Little Green hinzufügen" klicken!)
2. Laden Sie die aktuelle Version herunter
3. Fügen Sie die Client -ID und das Client -Geheimnis ein, das Sie früher in den jeweiligen Feldern in der Datei spotifybot.properties gespeichert haben
4. Öffnen Sie ein Terminal im selben Ordner wie die JAR-Datei (einfach durch Halten von Schicht und mit der rechten Maustaste und dann "Open Terminal hier" ausgewählt). Dann starten Sie die App mit java -jar SpotifyBigPicture.jar

Schritt 2 - Variante B: Docker -Bild ziehen

1. Klicken Sie nach dem Erstellen der Spotify -App auf "Einstellungen bearbeiten" und fügen Sie den Umleitungs -URI für diese App hinzu. Abhängig davon, wo Sie die App ausführen möchten, müssen Sie einen URI bereitstellen, der von außen erreichbar ist. Zum Beispiel http://ip-of-docker-machine:8183/login-callback . Der Login-Rückruf muss mit /login-callback enden! Stellen Sie außerdem sicher, dass Sie vor dem Speichern auf die Schaltfläche "Little Green" klicken
2. Ziehen Sie das Docker -Bild: docker pull ghcr.io/selbi182/spotifybigpicture
3. Führen Sie das Docker -Bild aus. Fügen Sie die Client -ID , das Client -Geheimnis ein und leiten Sie URI, Sie haben Sie früher in die jeweiligen Felder angegeben, um sie als Umgebungsvariablen zu übergeben: docker run --name spotifybigpicture -d -p 8183:8183 -e client_id=CLIENTID -e client_secret=CLIENTSECRET -e redirect_uri=REDIRECTURI ghcr.io/selbi182/spotifybigpicture
4. Führen Sie dann docker logs -f spotifybigpicture aus, damit Sie die für den nächste Schritt erforderliche URL sehen können

Schritt 3: Login

1. Sie werden aufgefordert, sich anzumelden. Die App versucht, den Browser selbst zu öffnen. Wenn sie jedoch fehlschlägt, schauen Sie sich die Konsolenausgabe an und kopieren Sie die angezeigte URL manuell in Ihren Browser. Es sollte Folgendes gefallen: https://accounts.spotify.com:443/authorize?client_id=[...]&response_type=code&redirect_uri=[...]&scope=[...]
2. Wenn alles funktioniert hat, sind Sie fertig! Wenn Sie die Variante A ausgewählt haben, ist die App unter http: // localhost: 8183/und wenn Sie sich für Variante B entschieden haben, ist es jeder Server, den Sie bereitgestellt haben

Anforderungen

• Java 11 oder neuer:
  • Laden Sie hier herunter (offensichtlich nur erforderlich, wenn Sie die manuelle Java -Installation durchführen)
• Der Monitor sollte 16: 9 -Seitenverhältnis haben:
  • Während es einen speziell optimierten Voreinsatz für den Porträtmodus gibt, wurde diese App hauptsächlich für den Landschaftsmodus optimiert. Während jedes Seitenverhältnis theoretisch funktionieren sollte, ist 16: 9 das einzige Seitenverhältnis, das zu 100% unterstützt und getestet wird
• Ein moderner Browser:
  • Mit dieser App sind viele ausgefallene Schnickschnack und Pfeifen verbunden, die einfach nicht in älteren Browsern funktionieren. Ich habe es hauptsächlich für Mozilla Firefox entwickelt und optimiert, aber es funktioniert auch bei Google Chrome. Nicht auf anderen Browsern getestet, daher garantiere ich dort keine volle Stabilität
• Spotify Premium:
  • Sie können diese App weiterhin als kostenlosen Benutzer verwenden, erhalten jedoch nicht die volle Funktionalität. Zum Beispiel ist das Erhalten Ihrer aktuellen Warteschlange nur für Spotify -Premium -Benutzer verfügbar. Für kostenlose Benutzer kann nur der aktuelle Lied angezeigt werden. Für Alben ist mehr als eine gute Vermutung, welcher Song als nächstes kommt, leider nicht möglich

Schnittstelle aktualisiert nicht?

Die Informationen werden von der API von Spotify abgerufen, indem sie sie einmal in einer Sekunde befragten. Leider gibt es keine "richtige" Möglichkeit, dies zu tun, da Webhooks für Songänderungen (wie zum Beispiel Discord sie verwendet) für die öffentliche API nicht verfügbar sind.

Infolgedessen kann die Verbindung von Zeit zu Zeit stecken bleiben. Die App versucht automatisch, Verbindungen nach Möglichkeit wiederherzustellen, was normalerweise nur einige Sekunden dauert. Um das Aussehen der Schnittstelle so reibungslos wie möglich zu halten, simuliert der Timer die Wiedergabe, indem sie weiterhin Sekunden für sich genommen wird, wenn derzeit ein Lied spielt.

Wenn die Schnittstelle jedoch völlig nicht mehr reagiert, probieren Sie diese Ansätze aus:

1. Ändern Sie den aktuellen Wiedergabebeducker (zB wechseln Sie von einer Wiedergabeliste zu einem Album).

2. Aus irgendeinem bizarrem Grund klicken Sie einfach auf die Schaltfläche Geräte in Spotify auf Ihrem PC (nicht einmal die Auswahl eines anderen Geräts, buchstäblich nur den Dropdown -Bereich), zwingt die Schnittstelle manchmal, um nachzuholen. Dies war meine Anlaufstelle für die Behebung von steckigen Bildschirmen, und es funktioniert überraschend gut:

Unterstützung

Wenn Sie Probleme haben, schreiben Sie ein Ausgabe -Ticket auf Github und ich werde es mir gerne ansehen :)

Alternativ senden Sie mir eine Nachricht über Zwietracht. Mein Benutzername ist: Selbi