SpotifyPlus Card Dashboard

@schwing
I have a Spotify Password Changes checklist that I use for when I change my Spotify password. I have so many different test scenarios, that I had to put this together a few months ago.

Hope it helps!

In step 3 I get 127.0.0.1 this site cant be reached…
It did not generate a file…

This is what I get…

(access_denied) An authorization response was not returned, which usually indicates the server timed out waiting for a response from the user to authorize the request
Traceback (most recent call last):
File “/usr/lib/python3.12/site-packages/spotifywebapipython/oauthcli/authclient.py”, line 1022, in AuthorizeWithServer
raise AccessDeniedError(‘An authorization response was not returned, which usually indicates the server timed out waiting for a response from the user to authorize the request’)
oauthlib.oauth2.rfc6749.errors.AccessDeniedError: (access_denied) An authorization response was not returned, which usually indicates the server timed out waiting for a response from the user to authorize the request
** Exception: (access_denied) An authorization response was not returned, which usually indicates the server timed out waiting for a response from the user to authorize the request

@thlucas Just reauthorized (password checklist helped) and tested the update. I can now see the controls but there is no queue and so I am unable to do things like shuffle. Is that due to the explanation you gave, it being a local queue?

@schwing
That is correct. Spotify is no longer in control of the device, so the Spotify Web API returns nothing for player state, queue info, etc. it’s all running on the Sonos device itself.

@Faecon
There is a 2 minute timeout on the request. Are you responding to the request within 2 minutes?

Did the browser appear with step 1 and 2?

I’m betting there is something in Firefox security settings that is preventing cross-site responses. The auth request goes to Spotify.com, but the response is sent to localhost 127.0.0.1.

I just tried it in edge, but it is the same. I press the "continue to the app " instantly…

@Faecon
Can I ask what operating system you are using? e.g. Windows 11, Mac, Linux, etc

I’m wondering if it could be a firewall issue, in that IP 127.0.0.1 (localhost) port 4381 is being blocked maybe?

I just tried it on Firefox (Windows 11 Pro) and it worked for me. I used the following steps, as I had to ignore the Chrome browser window that opened automatically and open a Firefox browser window instead:

  1. from the console window, execute the AuthTokenGenerator.py script and follow the prompts.
  2. when it opens the browser window, ignore it and switch back to the console.
  3. in the console, you should see a url that starts with the following:
    https://accounts.spotify.com/authorize?response_type= ...
  4. copy that entire url (probably 3 lines long) to your clipboard.
  5. open up a new Firefox browser window.
  6. paste the url from the clipboard and press enter
  7. it should display the authorize page, or possibly a Spotify Login page.
  8. verify that the Spotify account logged in is you (it will display your account name above the Not You? text just above the green button.
  9. if it is your account then press the green button to authorize.

I tried it on 2 systems. maybe it has something to do with the firewall on both systems. I will try tomorrow


My port 4381 is not opened from my provider, I think that is the problem

2 Likes

How to increase font size? both in header and song and album title?
My diopters don’t help me! :slight_smile:

I tried to add this…but with no success

card_mod:
  style: |
    .title {
      font-size: 35px !important;
      font-weight: normal;
    }
1 Like

@Ector73
Unfortunately there is no way to do that currently.

Please submit a Feature Request so I can keep it on my radar for a future enhancement.

can I use something else than 127.0.0.1 ?
Do I have to change something in the script ?

@Faecon
The 127.0.0.1 is the machine (localhost in this case) where the AuthTokenGenerator.py python script is running from, or should be. That cannot be changed in the script.

Hi Todd,

I second everything that the all the community members have mentioned previously in that the development and your willingness to implement this card for the wider community is welcomed.

I’ve been tinkering with the custom card and love what you’ve achieved here and know it is a work in progress still.

I use the Custom Sonos Card in my dashboard at the moment which allows local visibility of Sonos Queues (useful for your card and how it comes together especially around local queue management).

Would a collaboration between you and the developer(s) of that card be perhaps on the cards? I think a blend of your development and theirs would be a very powerful addition to the community, especially since your card allows for searching functionality which is sorely lacking on the default configuration within HA.

I think and hope other community members would agree that a coming together of your two custom development cards would entirely negate the need to leave the HA environment when using Spotify and Sonos, for which there is a large community globally. I know I would be so happy if I could leave behind the native Spotify and Sonos Apps and just live within HA for full playback.

Anyway, would welcome your thoughts on this overall?

Regards,
Peter

1 Like

One final point before I sign off for the evening…

When searching using your search functionality on a tablet, the tablet’s native keyboard comes up absolutely fine, but when I click on Go to complete the search, the tablet keyboard stays up until I close it. Would it be possible to hide the on screen keyboard when the search is started?

1 Like

@psjnr84
I have not been in contact with the developers of the Custom Sonos Card, so not sure where that would lead. I can say that all of the functionality in my SpotifyPlus Card is made possible by service calls to the underlying SpotifyPlus Integration. These are publicly available services, and could be easily called by the Custom Sonos Card to do the same things.

My SpotifyPlus Integration (and Card) originally started out to just support the Spotify Web API commands / player / functionality. It has evolved over time to support some of the player features of Sonos devices, but not the full functionality. In other words, the primary focus of the integration is to support the Spotify Web API player. It has taken quite a bit of work to get the existing features supported for Sonos, as Sonos is considered a “restricted device” and does not fully implement the native Spotify Web API support for the player. It took a LOT of special code in the integration to make the user think that it’s seamless, but it’s not (very complicated under the covers).

With that said, I have no problem helping the Custom Sonos Card developer(s) with questions and support for the SpotifyPlus integration services if they wish to utilize them in their card, but my focus needs to remain on supporting the Spotify Web API at this time. Who knows, that may change in the future; never say never right? :smiley:

All the best,
Todd

I don’t think I can help with that, as that appears to be a function of your tablet software. Unless you are aware of a JavaScript function (or code) that can be called to close the keyboard.

I know on my iPhone / iPad, the popup keyboard automatically closes once I click on “Go”.

Thanks Todd for your reply. Fully understand the feedback.

This is a view of what I’ve put together between your card and that of the Custom Sonos Card:

While its looking and good and doing what I need for the most part, is there a way in which your card can send music from the Spotify Web API to different rooms at the same time (in essence different music being played in different rooms)…

The standard Spotify integration within the Media Browser in Home Assistant with the Custom Sonos Card supports this, so it would be good to be able to support multiple individual streams as well to each speaker in your card…

Great work overall and with these two developments I can indeed see the benefits of your card merged with the Sonos Card in a nirvana future state…

Keep up the good work!

It’s just a Samsung Tablet wall mounted. I guess the behaviour of the interface differs from the iPad / iPhone’s world. I know its a pain to handle multiple development environments.