Hey folks,
I'm back and trying to get my dashboard looking nice for a wall-mounted tablet.
I've got a number of SONOS speakers and the option to use either the DLNA Player or built in SONOS driver to control them.
What I'd like to do is have the current album art (available from the DLNA Driver) set as the background image for the Media Player widget.
Is this even possible without faffing around with css and z-index?
Doesn't look like there is an easy way but here's a link you can read on.
Thanks, I've had a read through that and it's not quite what I'm after.
I'm basically looking to recreate this in Hubitat Dashboard (Not my choice of music, just a random image I found on the internet!):
Hi @proffalken
Yes, according to this post it should be possible (but there will be some faffing):
Thanks, I've removed the checkbox marking your post as the "solution", because all it does it get me an attribute I can use to display the album art, not details on how to set it up so it looks like the example image.
I'm already playing around with @tomw's drivers, I'll keep plugging away and see what I can come up with.
Technically it's exactly what your ask for 
place the attribute above your media player and you have recreated your example. To make it as your media player background, place the attribute tile behind the music player and make the background of the music player transparent (yes, a bit CSS will be involved, I could help you with that).
In that same post somebody says: "...incorporate my sharptools dashboard into hubitat as sharptools makes it easy to have cover art" I haven't use sharptools, but it might be worth looking at?
PS If you manage to get it to work, would you be so kind to share it? I have a sonos too 
Responding to @proffalken's question on GitHub:
You need to do two things:
Add config entry on the server side in settings.json: { "webhook" : "http://<Hubitat IP>:39501" }
Manually set the device network id (dni) on the Hubitat virtual device to the MAC address of the server, in all caps with no colons.
Heh, fair enough, I'll meet you half-way on this one - your answer doesn't "solve it", but it does put me on to the right track...
OK, here we go - some CSS trickery thanks to smartly and hacking in the advance settings.
In this case, the AlbumArtwork tile is tile 0, and the media player (Standard HE Sonos Driver) is tile 12:
The CSS:
#tile-0 .tile-title {
visibility: hidden;
z-index: -1;
}
#tile-12 .tile-contents,
#tile-12 .tile-primary,
#tile-12 .tile-primary:after,
#tile-12 .tile-primary:before {
color: rgba(255, 255, 255, 1) !important
}
#tile-12 {
background-color: rgba(0, 0, 0, 0.5) !important;
border-color: rgba(255, 255, 255, 0.0) !important;
border-style: solid !important;
border-width: 1px;
color: rgba(255, 255, 255, 1.0) !important
}
and here's the result:
Unfortunately, as you can see from the difference between the background and the media player detail, the Webhook for the SONOS Buttons setup isn't working 
Awesome, it seems you're almost there!
(Probably just a typo but: Tile-0 = Media Player and tile-12 = Album Art)
Do you have multiple speakers? Maybe it has the last state of another sonos?
Is the Album Art changing after a few minutes? or does it change when you skip to the next song? if so it's probably a parameter you need to change.
Maybe @tomw can help you further with why it isn't working..
Let's continue the discussion here, @proffalken .
Quoting you from GitHub:
Thanks @tomwpublic - not sure if you want to continue the discussion here or on the forums thread, but this is my current settings.json:
{
"spotify": {
"clientId": "IKNOWWHOIAM",
"clientSecret": "SHHHHHHHHHHHHHHH"
},
"webhook": "http://:39501"
}
On the hub, I've made sure that the MAC Address is set correctly along with the other settings, however the only time that the AlbumArtwork URI updates is if I click the "refresh" button in the console:
That all seems correct. What environment are you running the node server in?
I think we need to figure out whether the webhook is not being sent or if it is being sent but not properly received.
Please open a Hubitat Logs view in another tab or window. Then change the track on the Sonos side. What shows up in the logs, if anything?
Edit: FYI @proffalken . I think my post snuck in before yours, so just making sure you didn't miss this.
Yeah, it's nearly there isn't it...
The album art is correct for this device, it's just not automatically updating when the track changes (in this case the artwork is the album cover for the previous track, but unless I refresh it in the device it won't update at all)
Another idea: maybe my advice to use MAC of the server for the DNI was an issue, depending on your networking setup. You could also try IP of server as described here: Sonos Move - #2 by mike.maxwell
I don't see anything in the logs, that's part of the issue, I'm wondering where the settings are within Hubitat to debug the webhook receivers (or if that's even possible!)
The node server is running on a central server that has full access through to the hubitat hub even though they're on different VLANs - a curl to the ip/port for the hubitat hub from the server returns a server 200 status code so that should be fine.
Thanks, I'll give that a go as well.
This fixed it, thanks!
I put the IP address of the server (not the sonos speaker) into IP to Hex Converter - Convert IP to Hexadecimal - Online - Browserling Web Developer Tools and then put that into my settings in the node-sonos-http-api server MAC field, saved the settings and it's now working perfectly, thanks!
Download the Hubitat app
