Ok, so I’ve made some changes, and It would be great if you could try this version.
Don’t forget to change your card reference in ui-lovelace.yaml and add something like ?ver=0.8-beta at the end. Alternatively clear the browser cache
Ok, so I’ve made some changes, and It would be great if you could try this version.
I run it with both default and custom theme but never seen the icons disappear.
I love this component!
Made some changes so that when a media player is paused, the media info text is grayed out (“disabled”) and the volume slider/buttons are removed. Found it easier to get an overview.
Feel free to use it, merge it, change it. Here is the committed changed:
(first time I change any home assistant component. Bear with a simple copy-paster)
4 Likes
That’s awesome! nice tweaks.
I actually did something similar with the artwork_border option, changes color if the player is playing
Thanks.
Here is what I did: I created a new file with your beta code and saved it as mini-media-player?ver=0.8-beta.js in www. Then I changed the resource in the ui-lovelace to the same name.
The answer I get is "Custom element doesn’t exist: mini-media-player.
If it works with the others on their default theme, then I guess it must be something on my end.
This is the code that I am using in ui-lovelace:
- type: custom:mini-media-player
entity: media_player.bad
icon: 'mdi:cast'
hide_power: true
show_source: true
title: Sonos Badezimmer
more_info: false
Anything that may seem wrong here?
Your yaml code for the card looks good.
Try replacing your current mini-media-player.js with this version. and then change your reference as below (make sure the path matches the location of your mini-media-player.js):
resources:
- url: /local/mini-media-player.js?ver=0.8-beta
type: module
That should clear out the cache and let you try the fixes.
using those fixes above, still does not work.
I get the same error.
resources:
- url: /local/mini-media-player.js?ver=0.8-beta
type: module
Yep, same error here.
I’m sorry but I don’t know what to say more than to double check your files and paths. The only changes done to the card are style changes and can’t cause this error.
/local/mini-media-player.js equals /config/www/mini-media-player.js etc
Maybe try skipping the ?ver=* at the end, that is just to make sure you’re not loading the old version from cache.
1 Like
The funny thing is that is seems to have nothing to do with the background color. With the midnight theme, it still looks like this:
Ok, I think, I found a solution.
Setting
artwork: color
does not show the cover as a background but it brings up the controls!
I have this code in my ui-lovelace.yaml:
- type: custom:mini-media-player
entity: media_player.bad
icon: 'mdi:cast'
artwork: color
show_source: true
more_info: false
hide_power: true
name: Badezimmer
This results in this view:
This is good. However, it would be nice to have the icon back with the cover thumbnail.
1 Like
Ok, that’s great, I’m still not sure what’s causing this issue though.
Thanks for all the information, hopefully I’ll figure this out sooner than later.
1 Like
2nd option for me too. Thanks
Thank you for the hide_power. Looks better now. 
1 Like
hi @kalkih, I have artwork_border set to true, but I’m not seeing the border or I’m not understanding how to use it properly. Also, adding a title still leaves the old title on the card - is that by design?
Thanks
Clear your browser cache perhaps?
Thanks, Works a charm.
Any way we could have an artwork for a group?
Trying to have a pic of a google mini for my GHM devices…
Hey,
artwork_border doesn’t work with artwork: cover, that’s on purpose, I should clarify that in the instructions though.
As for the title, in your example it looks like you wrap mini-media-players inside an entities card with a title set. If you don’t want that outer title, remove it from your entities card.
The mini-media-player can’t alter things outside it’s own card, so this is by design.