-
-
Notifications
You must be signed in to change notification settings - Fork 1
Card Features
Card features and functionality index.
Card layout is comprised of header, content, and footer areas.
This area is used to display a title that represents the card as a whole (e.g. "SpotifyPlus Card UI"). When displayed in the player section, the background color is a gradient that will match the cover art displayed; otherwise, it's just the card background color.
The header will not be shown if the title option is empty or not configured.
This area is used to display selected section content. Please refer to the Section Content topic below for more details about the different sections.
This area is used to display section selection icons if multiple sections of the card are enabled.
The footer will not be shown if only one section is selected. When displayed in the player section, the background color is a gradient that will match the cover art displayed; otherwise, it's just the card background color.
Sections are enabled / disabled via Card Configuration settings.
Multiple sections can be enabled in the card, but only one section is displayed at a time in the content area. A section is selected for display by clicking on its icon located in the footer area. In most cases, the section content is not refreshed automatically when you switch to the section; use the section refresh button to refresh the content.
A single section can be enabled in the card, which will only show content for that section. This configuration allows you to show the different sections next to each other (in a horizontal stack lets say) by adding multiple instances of the card with different sections enabled.
By default, all sections of the card are enabled.
The following are detailed explanations of the individual sections.
- Album Favorites
- Artist Favorites
- Audiobook Favorites
- Devices
- Player
- Playlist Favorites
- Recently Played
- Search Spotify Media
- Show Favorites
- Show Episode Favorites
- Track Favorites
- User Presets
This section will display information about the media content that is currently playing, as well as the ability to control playback, adjust volume, mute, add / remove favorites, and more.
Configuration options can be changed to hide / display individual controls, as well as set title and sub-title text with nowPlaying information.
The Player section is divided into 4 separate parts:
-
A header area, used to display nowPlaying media information.
-
A body area, used to display action / information details.
-
A media controls area, used to display transport control buttons.
-
A volume controls area, used to display volume and power control buttons.
The following controls are available for controlling playback: play / pause, next track, previous track, shuffle, repeat, and actions / information details. Seek is also available via the progress bar. The player controls area can be completely hidden, or individual control buttons can be shown / hidden as desired.
The following volume related controls are available: mute, and a slider control to adjust volume to any amount between 0 - 100 percent. The volume controls area can be completely hidden, or individual control buttons can be shown / hidden as desired.
A power on / off button is also available to turn the media player on / off as desired. When power off is selected, the underlying Spotify Player is placed in a paused state.
You can also control the background opacity of the header status area and the controls area.
The actions / information details control will display details about the playing track, audiobook chapter, or podcast show episode. It will also allow you to add / remove favorites based on the playing media context.
Track information details displayed include the track name, the album name, the artist name, track #, it's duration, when the track was released, etc. Note that only the first artist name is listed, in the event the track has multiple artists defined.
You can also add / remove track favorite, add / remove album favorite, and add / remove artist favorite. You can also click the icon image preceding the track / album / artist name, which will open up a web-browser tab to the Spotify content page.
Podcast episode details displayed include the podcast episode name, podcast show name, episode release date, duration, etc.
For podcast episodes, you can add / remove podcast episode favorite, and add / remove podcast show favorite. You can also click the icon image preceding the podcast episode / podcast show name, which will open up a web-browser tab to the Spotify content page.
Audiobook chapter details displayed include the audiobook chapter name, audiobook name, chapter release date, duration, authors, the publisher, narrators, etc.
For audiobook chapters, you can add / remove audiobook favorite, and add / remove audiobook chapter favorite. You can also click the icon image preceding the audiobook chapter / audiobook name, which will open up a web-browser tab to the Spotify content page.
Queue information details include the queue position, title, and artist name. You can also click the icon image preceding the title, which will play the selected item. Note that this will reset the queue to just the selected item!
Queue information details include the queue position, title, and show name. You can also click the icon image preceding the title, which will play the selected item. Note that this will reset the queue to just the selected item!
Custom images can be specified for the player background image when the player is in various states. Please refer to the customImageUrls
configuration options for more details.
-
customImageUrls - playerBackground
configuration option specifies the Player section background image to use when the player is powered on. This will override the entity_picture attribute of the media player; the background image will remain constant, and will not change as track / episodes change. -
customImageUrls - playerOffBackground
configuration option specifies the Player section background image to use when the player is powered off.
This section will display a list of Spotify Connect Zeroconf Devices that have been discovered on the local network.
Use the Devices Card Configuration Editor to change the look and feel of the section.
The results are displayed in a media list that supports both icon and list formats based on card configuration settings. The size of the icons is also responsive, in that they will expand / shrink in size to fill the available space. The list of results also supports custom image url's based on the item title, so that you can manually override the image that is displayed for a list item if you like.
The SpotifyPlus integration get_spotify_connect_devices
service is called to retrieve the list of available Spotify Connect Zeroconf devices found on the local network. It gathers detailed information about each device, including Zeroconf details (IP Address, port, cpath, etc) and device details (manufacturer, model, firmware version, etc).
Results are presented to the user in a media browser list format. You can filter the list (by name) if necessary, as well as refresh the list content.
You can transfer playback to a device by clicking a media list tile image. Actions / information details can be displayed by click-holding the selected media list tile image; click the back button to return to the media list.
There are currently no actions available for this section.
Information details displayed include the following:
-
Device Name
- Spotify Connect device name value (e.g. "Bose-ST10-1"). -
Brand Name
- brand name of the hardware device (e.g. "Bose"). -
Model Name
- model name of the hardware device (e.g. "Soundtouch"). -
Device ID
- Unique device ID used for ZeroConf logins (e.g. "30fbc80e35598f3c242f2120413c943dfd9715fe"). -
Device Name
- Zeroconf discovery device name (e.g. "Bose-ST10-1"). -
Device Type
- Type of the device (e.g. "SPEAKER"). -
Product ID
- an integer enumerating the product for this partner (e.g. 70001). -
Voice Support
- Indicates if the device supports voice commands (e.g. "YES"). -
IP DNS Alias
- Server name at which the host can be reached (e.g. "Bose-SM2-341513fbeeae.local."). -
IP Address
- IP address at which the host can be reached (e.g. "192.168.1.81"). -
Zeroconf IP Port
- Port number for the Spotify Connect Zeroconf service on the host (e.g. 8200). -
Zeroconf CPath
- Spotify Connect Zeroconf CPath property value (e.g. "/zc"). -
Is Dynamic Device
- True if the device is a dynamic device; otherwise, False.
Dynamic devices are Spotify Connect devices that are not found in Zeroconf discovery process, but still exist in the player device list. These are usually Spotify Connect web or mobile players with temporary device id's. -
Auth Token Type
- Authorization Token type provided by the client (e.g. "accesstoken") -
Cliend ID
- Client id of the application (e.g. "79ebcb219e8e4e123456789000123456"). -
Library Version
- Client library version that processed the Zeroconf action (e.g. "3.88.29-gc4d4bb01").
This section will display a list of Spotify recently played track content.
Note that Spotify does not return playlists, audiobook, or podcast episodes in this list (tracks only). Spotify currently limits the maximum number of items returned to 50.
Use the Recently Played Card Configuration Editor to change the look and feel of the section.
The results are displayed in a media list that supports both icon and list formats based on card configuration settings. The size of the icons is also responsive, in that they will expand / shrink in size to fill the available space. The list of results also supports custom image url's based on the item title, so that you can manually override the image that is displayed for a list item if you like.
The SpotifyPlus integration get_player_recent_tracks
service is called to retrieve the list of Spotify recently played tracks.
Results are presented to the user in a media browser list format. You can filter the list (by name) if necessary, as well as refresh the list content.
You can select an item for playing by clicking a media list tile image. Actions / information details can be displayed by click-holding the selected media list tile image; click the back button to return to the media list.
Note - a solid heart following an item indicates the item is currently a Spotify favorite; an outlined heart indicates the item is currently NOT a Spotify favorite.
Track Actions available:
- click icon that preceeds Track name to view Spotify details web-page.
- click heart icon following Track name to add / remove Spotify Track Favorite.
Album Actions available:
- click icon that preceeds Album name to view Spotify details web-page.
- click heart icon following Album name to add / remove Spotify Album Favorite.
Artist Actions available:
- click icon that preceeds Artist name to view Spotify details web-page.
- click heart icon following Artist name to add / remove Spotify Artist Favorite.
Information details displayed include the following:
-
Track #
- number of the track as listed on the album. -
Duration
- track length. -
Released
- date the album was first released. -
Disc #
- disc number (usually 1 unless the album consists of more than one disc). -
Explicit?
- whether or not the track has explicit lyrics. -
Links
- external links.
This section will display a list of user-defined presets. Note that these presets are not part of your Spotify profile, but are part of the SpotifyPlus Card configuration. They allow you to define frequently used link to Spotify content for quick and easy access.
Use the User Presets Card Configuration Editor to change the look and feel of the section.
These presets can be defined directly in the card configuration, or defined in a JSON-formatted file that can be shared among cards.
The results are displayed in a media list that supports both icon and list formats based on card configuration settings. The size of the icons is also responsive, in that they will expand / shrink in size to fill the available space. The list of results also supports custom image url's based on the item title, so that you can manually override the image that is displayed for a list item if you like.
The SpotifyPlus Card retrieves the list of presets from the card configuration, as well as from the specified JSON-formatted file.
Results are presented to the user in a media browser list format. You can filter the list (by name) if necessary, as well as refresh the list content.
You can select an item for playing by clicking a media list tile image. Actions / information details can be displayed by click-holding the selected media list tile image; click the back button to return to the media list.
There are currently no actions available for this section.
Information details displayed include the following:
-
Name
- Friendly name to display that represents the media item. -
Sub-Title
- Friendly subtitle to display that represents the media item. -
Type
- Item type (e.g. "playlist", "album", "artist", etc). -
URI
- Spotify URI value that uniquely identifies the item (e.g. spotify:album:xxxxxx, etc) -
Origin
- Origin location of the content item (e.g.config
,<JSON file path>
).
This section will display a list of Spotify Playlist Favorites.
Note that Spotify does not return playlists, audiobook, or podcast episodes in this list (tracks only). Spotify currently limits the maximum number of items returned to 50.
Use the Playlist Favorites Card Configuration Editor to change the look and feel of the section.
The results are displayed in a media list that supports both icon and list formats based on card configuration settings. The size of the icons is also responsive, in that they will expand / shrink in size to fill the available space. The list of results also supports custom image url's based on the item title, so that you can manually override the image that is displayed for a list item if you like.
The SpotifyPlus integration get_playlist_favorites
service is called to retrieve the list of Spotify Playlist favorites.
Results are presented to the user in a media browser list format. You can filter the list (by name) if necessary, as well as refresh the list content.
You can select an item for playing by clicking a media list tile image. Actions / information details can be displayed by click-holding the selected media list tile image; click the back button to return to the media list.
Note - a solid heart following an item indicates the item is currently a Spotify favorite; an outlined heart indicates the item is currently NOT a Spotify favorite.
Playlist Actions available:
- click icon that preceeds Playlist name to view Spotify details web-page.
- click heart icon following Playlist name to add / remove Spotify Playlist Favorite.
Information details displayed include the following:
-
# Tracks
- number of tracks in the list. -
Collaborative?
- true if the owner allows other users to modify the playlist; otherwise, false. -
# Followers
- total number of followers. -
Public?
- playlist's public/private status - true if public; otherwise, False -
Snapshot ID
- version identifier for the current playlist; can be supplied in other requests to target a specific playlist version. -
Owned By
- user who owns the playlist; click to view Spotify user details web-page.
The Playlist description is displayed below the details.
A list of tracks contained in the Playlist is also displayed. Track information includes the track number, title, artist, album, and duration. You can click an item's play icon to start playing the associated content.
This section will display a list of Spotify Album Favorites.
Use the Album Favorites Card Configuration Editor to change the look and feel of the section.
The results are displayed in a media list that supports both icon and list formats based on card configuration settings. The size of the icons is also responsive, in that they will expand / shrink in size to fill the available space. The list of results also supports custom image url's based on the item title, so that you can manually override the image that is displayed for a list item if you like.
The SpotifyPlus integration get_album_favorites
service is called to retrieve the list of Spotify Album favorites.
Results are presented to the user in a media browser list format. You can filter the list (by name) if necessary, as well as refresh the list content.
You can select an item for playing by clicking a media list tile image. Actions / information details can be displayed by click-holding the selected media list tile image; click the back button to return to the media list.
Note - a solid heart following an item indicates the item is currently a Spotify favorite; an outlined heart indicates the item is currently NOT a Spotify favorite.
Album Actions available:
- click icon that preceeds Album name to view Spotify details web-page.
- click heart icon following Album name to add / remove Spotify Album Favorite.
Artist Actions available:
- click icon that preceeds Artist name to view Spotify details web-page.
- click heart icon following Artist name to add / remove Spotify Artist Favorite.
Information details displayed include the following:
-
Released
- date the album was released. -
# Tracks
- total number of tracks on the album. -
Label
- record label that released the album. -
Copyright
- copyright information.
A list of tracks contained in the Album is also displayed. Track information includes the track number, title, artist, and duration. You can click an item's play icon to start playing the associated content.
This section will display a list of Spotify Artist Favorites.
Use the Artist Favorites Card Configuration Editor to change the look and feel of the section.
The results are displayed in a media list that supports both icon and list formats based on card configuration settings. The size of the icons is also responsive, in that they will expand / shrink in size to fill the available space. The list of results also supports custom image url's based on the item title, so that you can manually override the image that is displayed for a list item if you like.
The SpotifyPlus integration get_artists_followed
service is called to retrieve the list of Spotify Artists followed.
Results are presented to the user in a media browser list format. You can filter the list (by name) if necessary, as well as refresh the list content.
You can select an item for playing by clicking a media list tile image. Actions / information details can be displayed by click-holding the selected media list tile image; click the back button to return to the media list.
Note - a solid heart following an item indicates the item is currently a Spotify favorite; an outlined heart indicates the item is currently NOT a Spotify favorite.
Artist Actions available:
- click icon that preceeds Artist name to view Spotify details web-page.
- click heart icon following Artist name to add / remove Spotify Artist Favorite.
Information details displayed include the following:
-
# Followers
- total number of artist followers. -
Genres
- various genres this artist is known for.
A list of albums offered by the Artist is also displayed. Album information includes the album number, title, release date, and the type of release (album, compilation, solo, etc). You can click an item's play icon to start playing the associated content.
This section will display a list of Spotify Track Favorites.
Use the Track Favorites Card Configuration Editor to change the look and feel of the section.
The results are displayed in a media list that supports both icon and list formats based on card configuration settings. The size of the icons is also responsive, in that they will expand / shrink in size to fill the available space. The list of results also supports custom image url's based on the item title, so that you can manually override the image that is displayed for a list item if you like.
The SpotifyPlus integration get_track_favorites
service is called to retrieve the list of Spotify Track favorites.
Results are presented to the user in a media browser list format. You can filter the list (by name) if necessary, as well as refresh the list content.
You can select an item for playing by clicking a media list tile image. Actions / information details can be displayed by click-holding the selected media list tile image; click the back button to return to the media list.
Note - a solid heart following an item indicates the item is currently a Spotify favorite; an outlined heart indicates the item is currently NOT a Spotify favorite.
Track Actions available:
- click icon that preceeds Track name to view Spotify details web-page.
- click heart icon following Track name to add / remove Spotify Track Favorite.
Album Actions available:
- click icon that preceeds Album name to view Spotify details web-page.
- click heart icon following Album name to add / remove Spotify Album Favorite.
Artist Actions available:
- click icon that preceeds Artist name to view Spotify details web-page.
- click heart icon following Artist name to add / remove Spotify Artist Favorite.
Information details displayed include the following:
-
Track #
- number of the track as listed on the album. -
Duration
- track length. -
Released
- date the album was first released. -
Disc #
- disc number (usually 1 unless the album consists of more than one disc). -
Explicit?
- whether or not the track has explicit lyrics. -
Links
- external links.
This section will display a list of Spotify Audiobook Favorites.
Use the Audiobook Favorites Card Configuration Editor to change the look and feel of the section.
The results are displayed in a media list that supports both icon and list formats based on card configuration settings. The size of the icons is also responsive, in that they will expand / shrink in size to fill the available space. The list of results also supports custom image url's based on the item title, so that you can manually override the image that is displayed for a list item if you like.
The SpotifyPlus integration get_audiobook_favorites
service is called to retrieve the list of Spotify Audiobook favorites.
Results are presented to the user in a media browser list format. You can filter the list (by name) if necessary, as well as refresh the list content.
You can select an item for playing by clicking a media list tile image. Actions / information details can be displayed by click-holding the selected media list tile image; click the back button to return to the media list.
Note - a solid heart following an item indicates the item is currently a Spotify favorite; an outlined heart indicates the item is currently NOT a Spotify favorite.
Audiobook Actions available:
- click icon that preceeds Audiobook name to view Spotify details web-page.
- click heart icon following Audiobook name to add / remove Spotify Audiobook Favorite.
Information details displayed include the following:
-
Authors
- author name(s) for this content. -
Narrators
- narrator name(s) for this content. -
Publisher
- publisher of the audiobook. -
Copyright
- copyright information. -
Edition
- edition of the audiobook. -
Released
- date the audiobook was released.
A list of chapters contained in the Audiobook is also displayed. Chapter information includes the title, status, and duration. You can click an item's play icon to start playing the associated content from the status resume point.
This section will display a list of Spotify Show (aka. Podcast) Favorites.
Use the Show Favorites Card Configuration Editor to change the look and feel of the section.
The results are displayed in a media list that supports both icon and list formats based on card configuration settings. The size of the icons is also responsive, in that they will expand / shrink in size to fill the available space. The list of results also supports custom image url's based on the item title, so that you can manually override the image that is displayed for a list item if you like.
The SpotifyPlus integration get_show_favorites
service is called to retrieve the list of Spotify Show favorites.
Results are presented to the user in a media browser list format. You can filter the list (by name) if necessary, as well as refresh the list content.
You can select an item for playing by clicking a media list tile image. Actions / information details can be displayed by click-holding the selected media list tile image; click the back button to return to the media list.
Note - a solid heart following an item indicates the item is currently a Spotify favorite; an outlined heart indicates the item is currently NOT a Spotify favorite.
Show Actions available:
- click icon that preceeds Show name to view Spotify details web-page.
- click heart icon following Show name to add / remove Spotify Show Favorite.
Information details displayed include the following:
-
# Episodes
- number of episodes in the show. -
Explicit?
- whether or not the show has explicit content. -
Publisher
- publisher of the show. -
Copyright
- copyright information.
The Show description is displayed below the details.
A list of episodes contained in the Show is also displayed. Episode information includes the title, status, and duration. You can click an item's play icon to start playing the associated content from the status resume point.
This section will display a list of Spotify Show (aka. Podcast) Episode Favorites.
Use the Episode Favorites Card Configuration Editor to change the look and feel of the section.
The results are displayed in a media list that supports both icon and list formats based on card configuration settings. The size of the icons is also responsive, in that they will expand / shrink in size to fill the available space. The list of results also supports custom image url's based on the item title, so that you can manually override the image that is displayed for a list item if you like.
The SpotifyPlus integration get_episode_favorites
service is called to retrieve the list of Spotify Episode favorites.
Results are presented to the user in a media browser list format. You can filter the list (by name) if necessary, as well as refresh the list content.
You can select an item for playing by clicking a media list tile image. Actions / information details can be displayed by click-holding the selected media list tile image; click the back button to return to the media list.
Note - a solid heart following an item indicates the item is currently a Spotify favorite; an outlined heart indicates the item is currently NOT a Spotify favorite.
Episode Actions available:
- click icon that preceeds Episode name to view Spotify details web-page.
- click heart icon following Episode name to add / remove Spotify Episode Favorite.
Show Actions available:
- click icon that preceeds Show name to view Spotify details web-page.
- click heart icon following Show name to add / remove Spotify Episode Favorite.
Information details displayed include the following:
-
Duration
- episode length. -
Released
- date the episode was released. -
Explicit?
- whether or not the episode has explicit content. -
Links
- external links.
The Episode description is displayed below the details.
This section will search Spotify catalog information about the selected type that match a keyword string. The search type can be any of the following: Albums, Artists, Audiobooks, Episodes, Playlists, Shows, or Tracks.
Use the Search Card Configuration Editor to change the look and feel of the section.
The results are displayed in a media list that supports both icon and list formats based on card configuration settings. The size of the icons is also responsive, in that they will expand / shrink in size to fill the available space. The list of results also supports custom image url's based on the item title, so that you can manually override the image that is displayed for a list item if you like.
This example shows the Playlist search results; other search types are similar.
The following SpotifyPlus integration services are called to search Spotify for content:
search_albums
search_artists
search_audiobooks
search_episodes
search_playlists
search_shows
search_tracks
Results are presented to the user in a media browser list format. You can filter the list (by name) if necessary, as well as refresh the list content.
You can select an item for playing by clicking a media list tile image. Actions / information details can be displayed by click-holding the selected media list tile image; click the back button to return to the media list.
Actions and information details are the same as displayed by the individual sections. Please refer to the individual Section Content types for their respective actions / information details.