SpotifyPlus Card Dashboard

Hi Todd, would it be possible to add any background to the speaker selection for each individual device? Maybe there is interest? Best regards
Stefan

1 Like

@Richi
The customImageUrls support will probably satisfy this request, though I did find a bug in the image processing for devices. I released a v1.0.43 update to fix that.

To start, find the images that you wish to display for a device and upload them to your HA <config>/www location. I would suggest creating a special directory under the HA <config>/www location for these custom images - e.g. <config>/www/spotifypluscard/customimages. The images in this location can then be easily referenced using the /local/spotifypluscard/customimages/filename.jpg (or .png) syntax in the configuration editor. PNG images with transparent backgrounds look the best in the UI, in my experience.

Next, you will need to update the custom image url’s table in the card configuration. Custom Image URL’s must be manually configured in the Configuration Editor using the “Show Code Editor” option (e.g. no UI editor). Once in the code editor, just add custom image url’s for your device names, like so:

customImageUrls:
  Bose-ST10-1: /local/spotifypluscard/customimages/device-speaker.png
  Bose-ST10-2: /local/spotifypluscard/customimages/device-speaker.png
  Bose-ST300: /local/spotifypluscard/customimages/device-soundbar.png
  Nest Audio 01: /local/spotifypluscard/customimages/device-speaker.png

And this is what it will look like. Note that I use a different location in my config folder to store my images (e.g. /local/images/spotifyplus_card_customimages/...)

1 Like

Great, you’ve thought of everything! Many thanks for the great integration!

1 Like

Hi thlucas,

Regarding your comment about an Amazon Echo device, I can get the card to play on my Amazon Echo Dot by clicking play twice. After inactivity the first time I click play on the card, I get this popup error:

"Failed to perform the action media_player/media_play. Validation error: not found."

If I then immediately press the play button a second time, the music begins to play without error. Do you find it odd that it works after the second play button click without me having to open my spotify app and activate from there?

I was wondering if possibly the error occurs on the first button click because I might need a slight delay for the validation to occur before playing the music?

To be honest I don’t really mind clicking play twice if it were not for the fact I have to manually close the popup error message to get rid of it.

EDIT: I also just want to mention that the same behavior occurs after inactivity if I go to Settings>Integrations>SpotifyPlus>entity and click the play button. A second click of the play button, the music starts. Perhaps, I should be asking about this on the SpotifyPlus integration’s page instead of here?

@PlayedIn
Do you have the Spotify Web Player Cookie Credentials configured in the Spotifyplus Integration (not the SpotifyPlus Card) configuration options? You might try setting those first before we do anything else.

The next step would be to setup an advanced SmartInspect trace. But give the above a try first.

Note that I don’t have any Amazon Echo devices to test with, so the advanced trace would be the only way I could try and diagnose the problem.

1 Like

Thanks for your help. Yes, I have the Spotify Web Player Cookie Credentials configured in the Spotifyplus Integration. I would be glad to setup SmartInspect.

Should I follow the instructions here?:

Here is a link to the encrypted sil file:

I enabled the log, clicked play once to get the error. Clicked play again, music started. Disabled the log.

Will pm the encryption code.

1 Like

It’s working nicely. Thank you! If I was to nitpick it would be that the design now is a bit “dull”. But I don’t really have a good suggestion on how to improve it. :yum:

Design on top is the normal media player.

@Quacked
You can change the text that is displayed by setting the playerHeaderNoMediaPlayingText configuration option.

It also supports title formatting options, which allow you to display various integration attributes. For example, if you just wanted to display the player name like the HA Spotify player does, use the following:

playerHeaderNoMediaPlayingText: {player.name}

I will see if I can add some background color options, though it might be a few days before I get to it.

Personally I don’t think I need background color options. It matches my UI neatly already. By comparing to the default player I was thinking more of the transparent music icon to the right and the larger play button. They make the card look more symmetrical and elaborate. I’m no designer but adding some style like this could work? Obviously not that horrid box and that color, but maybe something indicating music? And maybe even making it clickable if there’s something logical missing a button. :grin:

1 Like

@Quacked
Thanks for the feedback. I am not a graphic designer either, so any tips are appreciated.

There are various theming options you can configure to change control button sizes and colors.

I am in the process of updating the card to add background capabilities for the off | idle state. This will allow you to tailor it more to your taste; you could also set a solid color image to simulate a background color as well.

Will keep you posted.

Some idle / off backgrounds I have been experimenting with …

All of the above backgrounds were downloaded from pixabay.com.

2 Likes

I expect many to appreciate that but I would still use the default so it doesn’t break with all my other cards. :slight_smile:

1 Like

hi @thlucas

Im wondering if I can use the Home Assistant Voice as a media player for this as I connected a speaker via 3.5mm aux. if not, is there a way for me to use this as a media player?

Thank you!

@hassuser95
The SpotifyPlus Card is just a controller UI; it does not handle the actual playing of the media.

Depending on your hardware, you will want something like the Spotify Connect AddOn installed. Once you have that running, then you can use the SpotifyPlus Card to control the play.

If you get time, do you mind sharing those idle/off backgrounds?

Thanks!

1 Like

DM’ed you, but will post here as well …

All of the above idle / off backgrounds were downloaded from pixabay.com.

1 Like

hi @thlucas

Would it be possible to use the Home Assistant Voice as the output media player so I can just plug a speaker using aux?

Thank you

@hassuser95
I don’t think that would work, as the SpotifyPlus Integration only routes to Spotify Connect Player devices. I don’t think the HA Voice registers itself with Spotify Connect, but not sure. I am currently not using HA Voice.

@hassuser95
There are a few ways to turn your HA System into a Spotify Connect media player (based on type of hardware and operating system), though not sure how that would relate to HA Voice. Here are some options:

Spotify Connect AddOn

raspotify Service Helpful Links

SpoCon Service Helpful Links

spotifyd Service Helpful Links

librespot Helpful Links