DISCLAIMER: This project is a private open source project and doesn't have any connection with Spotify.
Web component card which can be used as a Lovelace Home Assistants card.
Forum thread: https://community.home-assistant.io/t/spotify-lovelace-card/103525
This card supports listing the users currently available devices and the users top playlists on Spotify. Choose an online media player and click on a playlist to play it on the device. This component will query the current playback from the Spotify Web API and tries to reflect the current status wrt to device and playlist if something is playing.
The component uses the Spotify Web API.
New from version 1.5 The card can make use of My Spotify Chromecast custom component if it is installed, to initiate playback on idle chromecast devices. Please read that README for any limitations. This release also adds a limit configuration property to make the number of playlists retrieved configurable.
New from version 1.6 Add device as a parameter (thanks Maxence Dunnewind @maxenced).
New from version 1.8 Removed need for custom sensor from My Spotify Chromecast custom component. Fixed the reauth problem and added support for stopping pollimg Spotify APIs when the browser tab is hidden. Added transfer playback support and fixed a lot of bugs (amongst others security issues with dependencies).
New in version 1.9 Support for HACS.
New in version 1.10
- Support for showing featured playlists instead of users playlists. Use configuration parameter
featuredPlaylistsand set it to true. - Define which account should be used when calling spotcast. This should be the account key name as defined in the configuration for spotcast. Default is to use default account.
- Possibility to set height with scrolling. New configuration parameter
heightwhich takes an integer value and renders the playlist element that height in pixels.
New in 1.11
- Bump packages to get security updates
- Limit number of requests to spotify api to not get 429
- Limit to vertical scroll if height is smaller than number of items
- Fix minor bugs with auth
New in 1.20
- Add support for dailyMixes using spotcast 2.6.0
This should now work in all newer major browsers. If it does not work for you please provide detailed reports in an issue ticket.
Create a new app at Spotify developer console or use the one created for the HA Spotify component (see below). Make sure you edit the settings and adds the redirect URL for the tab the card has.
Example: https://<your public home assistant hostname>:8123/lovelace/media.
For more information about how to create an app see Home Assistant Spotify Component documentation.
Add the resource in lovelace config:
Follow the configuration the instructions when installing it.
- type: module
url: >-
https://cdn.jsdelivr.net/gh/custom-cards/[email protected]/dist/spotify-card.umd.js
Now add the card like this:
cards:
- type: 'custom:spotify-card'
client_id: <YOUR CLIENT ID>
limit: <optional number of playlists to retrieve (default 10)>
device: <optional name of a device to pre-select>
player: <optional use this player only, value should be the same name as the displayname of the player>
featuredPlaylists: <optional show featured playlists instead of users playlists>
height: <optional pixels height for the playlist element. If content is larger scrolling will be enabled>
If you add the device setting, the card will select it by default and will not display the dropdown menu.
This library can of course also be used on other websites or projects other than Home Assistant
Please contribute and help.Before creating a large PR make sure to sync about it with me.
If you like this and want to buy me a coffee
This library is licensed under Apache 2.0, see LICENSE