I have been using my dashboard to play music to my Echo speakers for sometime, and recently updated my “jukebox” dashboard after the Album Art tile release to give it a visual upgrade. So I am sharing my setup here for those who may be interested, and I am also including the steps for Sonos speaker too.
Jukebox dashboard with album art, media player control and music tiles to change the playlist/station
SmartThings no longer supports Echo Speaks since Sep 2020. See the SmartThings announcement for details.
Here are the instructions :
Add Sonos or Echo speakers to SmartThings/Hubitat hub and SharpTools
- SmartThings: follow the steps here.
- Hubitat: Install the “Sonos Integration” app in your Hubitat admin page, and follow the steps in the app to complete the setup.
- Echo Speaks (Hubitat): Since the Amazon Echo is not directly supported in Hubitat as a playback device, you can use Echo Speaks, which is a popular community smartapp/device driver for integrating echo devices.
Echo Speaks originated in the SmartThings community, but was shutdown leading up to the shut down of Groovy on SmartThings.
Authorize to SharpTools
Once you’ve added your Sonos or Echo Speaks device to your hub, you can now sync the device to SharpTools in your SharpTools User Page → Manage Connections.
Add Music Player and Album Art tiles to the dashboard
- Create or edit a dashboard and add the newly authorized Sonos/Echo device to the dashboard twice from the “Add Item” list.
We’ll leave one tile as the default music player control and change the other into an album art display
- By default, both tiles are added as a ‘Music Player Tile’ layout. Change one of the tiles to the ‘Album Art Tile’ layout by tapping Change Layout from the tile’s edit menu.
(You can of course change the dimension, colors, and other customization settings like other tiles in the way you prefer.)
Create rules to change the music/station/playlist
- Create a new rule. Leave the Trigger section empty and add an action in the Flow with Echo device selected.
- Select “searchSpotify” command (or other streaming service you prefer)
- Toggle the Advanced option at top right corner, input the music search term in the “String” field and delete the two “Number” fields, since we don’t need to change the play volume or restore volume. Save the action and save rule.
- Create a new rule. Leave the Trigger section empty and add an action in the Flow with Sonos device selected.
- Select the
- Get the preset number from the device details:
- Open your SharpTools User Page, tap the
...next to your desired location, scroll down and tap on the device in question.
- Review the
presetsattribute and make note of the ‘id’ for each preset.⚠️ The 'preset' information is not live data, so make sure to perform a fresh sync of the device details if you've changed your Sonos presets since the last time you synced devices to SharpTools. As a reminder, you can do this from your SharpTools User Page → Manage Connections
- Since Hubitat’s Sonos integration doesn’t support the “playPreset” command, you will need to use the “playTrack” command with a specific uri of the song/playlist you want. The easiest way to find the uri is to play the desired song/playlist first and check the uri displayed in the Sonos device page at the Hubitat admin site (though even this can be hit-or-miss).
- Save the action and rule
Add the newly created rule to dashboard (see the update below)
- Edit the dashboard and add the newly created rules from the Rules section in the “Add Item” Iist
- Adjust the position, dimensions or icon as you prefer.
(Repeat the last couple steps to create multiple music rules and rule tiles for different ‘stations’)
- Now you can tap on these rule tiles to change the music being played on your Echo or Sonos devices.
Your jukebox dashboard is ready to rock now!
– Update –
I updated my jukebox dashboard to take advantage of the recently released
$.runRule("RuleID") syntax support in the Media Tile to show the artist profiles and to execute each individual rule created above when tapped. So if you prefer this artist image style over the icon, you can skip the step 4 above and do the following steps.
With the release of Custom Icons, you could use that to upload custom images for use with your Rule Tiles for a more ‘integrated’ experience, but I still prefer using Media Tiles with an external image host so I can get the full bleed (edge-to-edge) look with the playlist tiles that I was going for.
Create Media Tiles for artist profile images
Find the image you want to use or upload your preferred image to any image hosting site with public access, such as imgur.com, and get the URL address of the image.
Create a media tile using the URL address from previous step
Add this media tile to the jukebox dashboard and set this media tile’s tap action to “Open Hyperlink” and fill in
$.runRule("RuleID")in the Hyperlink field. (“RuleID” is the last part of the URL when you edit the rule in the rule editor page, and please note the double quotes cannot be the slanted style double quotes, if you are editing this on an iOS device.)
Adjust the position or dimension you prefer.
(Repeat these steps to create multiple media tiles which can execute rule when tapped.)
Now you can tap on these media tiles to change the music being played on your Echo or Sonos devices.