Spotify Lovelace Card

Share your Projects! Dashboards & Frontend
,
186

I only know one api call to get the users playlists…
Can you try yourself with their developer console and feedback if you find a way (it is a Web UI to try out their apis)?

187

What I understand we need to add “playlist-read-collaborative” to the scope in order to get Collaborative Playlists.

188

Nice digging. Did you test it? If it works you can create a PR and I’ll make sure it us merged and released in the next release

189

is it somehow possible to limit or to auto select a specific spotify connected device?
and / or not show the chromecast devices?

thnx

190

You cam pre-select a device unless it’s a chromecast device. For the hiding the chromecast devices from the list, it is not currently.supported

191

Can you tell me how? It’s indeed a receiver, so not a Chromecast device

192

See the device option in https://github.com/custom-cards/spotify-card/blob/master/README.md#add-the-card-to-lovelace-config

193

perfect, somehow over looked thats settings
thnx its workings
seems it must included single quotes like

device: 'Denon AVR-X4000'

maybe because of the space

194

I’m having issues getting this setup. I’m using hass.io version 0.97.0 and have successfully installed HACS version 0.12.1. I have then installed version 1.9 of the Spotify Card in HACS. Then I use the “Raw config editor” to edit the lovelace configuration from the web UI, adding the lines shown below as indicated by the instructions in the Spotify Card within HACS.

resources:
  - url: /community_plugin/spotify-card/spotify-card.js
    type: module

I then restart home assistant and create a new “Manual” card from the web ui, adding the following:

cards:
  - type: 'custom:spotify-card'
    client_id: abcdefghijklmnopqrst...

I get an error when entering the above, saying “No card type found”. I have tried to empty my browser cache and reload and this doesn’t make a difference. I have confirmed that spotify-card.js exists at “config/www/community/spotify-card” on my system.

Also, if I click “Open” on the Spotify Card from within HACS it opens the following link, showing java script code:
https://myserver.duckdns.org/community_plugin/spotify-card/spotify-card.js

195

Ok, it seems all I had to do was change what I was entering into the “Manual Card” to the following and now it works:

type: 'custom:spotify-card'
client_id: abcdefghijklmnopqrst...

At one point I changed the resources to be the following, but I changed it back to what I posted earlier and it still works:

resources:
  - url: /community_plugin/spotify-card/spotify-card.js?v1
    type: js
1 Like
196

I understand now. Your question was what to enter i the UI not in the configuration. Great that you solved it, I haven’t tried the UI myself so your finding might help others…

197

@jonatanhost and perhaps others that are interested.
I added the new scope to get collaborative playlists in a branch if someone want to test.

if you want to test it use this link in your lovelace conf (or download it on your hass)
https://cdn.jsdelivr.net/gh/custom-cards/spotify-card@collaborate-playlists/dist/spotify-card.umd.js

make sure you don’t a valid old token (it expires after 1 hour). to make sure it is new you can remove the web storage keys auth_token and token_expires_ms using your web dev tools.

198

Nice work!

But i got an error if i want to use a cast device. the message ist: “Error calling service spotcast / start. Service not found.”
To play to my smartphone works fine.

I use V 1.9

199

You need to install and configure the spotcast custom component. It is available in HACS if you are using that. Otherwise you’ll find it here : https://github.com/fondberg/spotcast

200

hi @fondberg any idea how I would go about adding 2 different instances?

I would like to use my childs playlists for all the kids songs and not fill mine up (Spotify Family Plan :slight_smile:)

I added a local version of the card as well as the URL link:

  - url: /local/lovelace/spotify-card-1.9/dist/spotify-card1.js
    type: js
  - type: js
    url: >-
      https://cdn.jsdelivr.net/gh/fondberg/spotify-card@master/src/spotify-card.js

Sadly just renaming the card spotify-card1.js and in the UI_lovelace to custom:spotify-card1 didnt work :frowning:

could you point me to anything else that would need updating? Thanks

EDIT: Changed this as well but no dice:
customElements.define("spotify-card1",

201

Currently it is only possible to have one client-id oer browser instance. But maybe fetching the families playlists are done with one login? If not it will be a problem.

That said, it you use different browsers for your members they will get different logins and thus get their respective playlists displayed.

202

ah ok, thanks for the response. I was just trying to avoid baby shark appearing in my playlists lol

203

did you get anywhere with this?

204

To who was this question? If it was to me then the answer is that I haven’t looked because I don’t have family login but what I think is that playlists should appear only to their respective login. If “baby shark” appears in your login and you haven’t added it I would consider it a bug in the spotify apis.

You can play around here and see what data spotify returns: https://developer.spotify.com/console/get-current-user-playlists/

205

The reply was to another person on the thread (it shows who in the top right hand corner of the latest post).
It was actually regarding if they had looked any more into getting sonos devices to work with this. I started looking at switching out the spotcast devices with sonos media_player devices (but not great with writing code, only copying existing chunks so have got stuck :frowning: )

EDIT: Baby shark is a kids ‘song’ that is played a LOT, and other similar kids songs are being played from my Spotify account, whereas I have set up (under the spotify family account) an account for my child so we could use for all the children’s songs, and avoid filling my playlist with kids songs :wink: )