Lovelace: Mini Media Player

Alex_Yeoman · January 29, 2020, 5:56pm

Hi there, how did you get the larger artwork cover?

kalkih · January 29, 2020, 7:53pm

Hello,

You could utilize conditional cards to decide what cards to render depending on different states.
E.g. if the speaker group is playing you could use conditional cards to hide the individual speaker cards and vice versa.

You could also try creating a universal media player of the three entities, start with the speaker group as the first child followed by the two individual google speakers.

Then use the universal media player entity in the mini media player card.

artwork: full-cover or artwork: full-cover-fit

deamon · January 30, 2020, 1:04am

Hello,
Is it possible to use something like this?

icon: ‘{% if source(“Netflix”) %}mdi:netflix{% else %}mdi:pc{% endif %}’

I have a chrome cast where multiple content is played (youtube / netflix / spotify / etc)

Can the card detect the source and adjust the icon - or can we implement something like above?

(I’ve tried

source: icon

but it does not work on netflix )

heartkingz · February 4, 2020, 8:39am

Hi @kalkih

Thanks for the update! As far is i can see I should be able to theme the buttons now.
I have tried to put the following line to my theme.yaml file. (Addition to the theme I am using) and it seems it does not theme the buttons.
I use:

paper-card-background-color: 'rgba(46, 46, 46, 0.5)'
mini-media-player-button-color: 'var(--paper-card-background-color)'

Can you point me in the right direction?
Tried to refresh the theme, rebooted Home Assistant, cleared cache, etc.

Thanks a bunch!

Rutger

iophobia · February 6, 2020, 4:42pm

Seconding heartkingz request for button theming. Similarly added the line to the theme.yaml, reloaded HA and cleared cache but to no avail so far.

Sadly, this makes the picons unreadable on a light theme. Other than that a great card and pretty easy to customize even for somebody with little coding experience.

Kedryn · February 6, 2020, 5:54pm

Is there a way to keep it “always on”?
I have a LG TV without a way to know if it’s on or off, and i have the TV and the MMP in the opposite state (one off and one on). I prefer to have MMP always on, showing the commands.

kalkih · February 6, 2020, 6:49pm

What state is your TV reporting?
Try creating a universal media player and map the on state attribute to be always on.

kalkih · February 8, 2020, 9:40pm

I double checked and theming of the button works fine for me through the new theme variable.
Did you perhaps install the card through HACS? HACS is having serious issues with updating cards, it will display the updated version but in reality the file on disk isn’t updated.

Try reinstalling the card through HACS or try to install it manually.

Yoinkz · February 9, 2020, 10:23am

Hey,

Have any one else experienced when casting your Spotify Content to a Chromecast and wants to use the “Buttons”, to start a Playlist, then nothing happens. But, this is only the case when casting. If I listen to music on my phone and then presses the button, then it changes just fine.

I know for sure that it has worked before, but I’m not sure when exactly this stopped working

heartkingz · February 9, 2020, 10:49am

Did installed it via HACS. Reinstalled the media player and it starts working. Stupid I haven’t tried that ;D

heartkingz · February 9, 2020, 10:57am

While this works, lower buttons does not theme the same way. Do I need to use another variable to theme these?

Thanks!

iophobia · February 9, 2020, 10:58am

Reinstall obviously did it. Thanks.

Kabala · February 10, 2020, 5:30am

How did you make the round corners on the buttons?
Thank you.

kalkih · February 10, 2020, 4:43pm

Ok, will look into it.

Edit: found the issue, fix in next release.

They should be rounded by default: border-radius: 4px

heartkingz · February 10, 2020, 6:02pm

Thanks again! @Kabala, indeed, didn’t change a thing Maybe the variable —ha-card-border-radius is overwritten by another value in your theme? Must say that i don’t know for sure if this value also affects the rounded corners for these buttons.

craggy · February 10, 2020, 10:27pm

Hi

I use 4 buttons to play preset internet radio stations on my Linkplay ceiling speakers. Problem is that no cover art/logo or media info is displayed and i have no idea what station i’m listening to.
If I play spotify or use my phone app to play the same stations from Tunein then the artwork and info is displayed correctly.

Is there any way to show the station logo from the internet stream like the way Tunein shows?
Or is there even a way to manually specify stations logos for the 4 buttons so when a particular stream is playing a specified logo is shown instead of the cast icon in the player?

Kabala · February 11, 2020, 5:43am

I am currently using Google Dark Theme and border-radius: 15px is the default. But apparently not for the buttons

What could be the reason?
Thank you

kalkih · February 11, 2020, 7:32pm

Media metadata such as artwork and track/station/artist is handled in the component. What component are you using? The card is simply exposing the attributes coming from the component.

Not really, you could try to achieve it with config-template-card by dynamically changing the card’s background option, but if the component doesn’t expose what’s playing I don’t know how you could know what’s playing.

ha-card-border-radius has nothing to do with the buttons, it’s the border radius of the card itself.
But your buttons doesn’t look like they have a border radius at all, should be 4px in later version of this card.
Try updating/reinstalling the card maybe?

Kabala · February 11, 2020, 8:38pm

that was it…

Thank you.

k2v1n58 · February 13, 2020, 2:17pm

On HA 0.105 with the new Spotify integration, I’m having a problem with the progress bar.
The duration of the media is the right one but I have a factor of approx. 2 between the real position of the media and the one indicated by the card.
(The “media_position” shown by the media_player entity is the correct one)

spotfiy