Dynamic background for media player

Hello!

I would like my media player to dynamically display the radio station logo as background.
When I click on the radio station button, I have a script that saves the logo URL into an Input_text, and I would like this input_text to be read by the media player.

Here is how I coded it, but it doesn’t seem to work…

type: grid
cards:

  • type: custom:mini-media-player
    volume_stateless: false
    toggle_power: true
    hide:
    controls: false
    power: false
    group: false
    artwork: full-cover
    entity: media_player.vlc
    background: {{ states(‘input_text.background’) }}

When I check the input_text state in developper tools, it contains the logo URL.

image

Maybe it’s coming from the way I pass it to the background.
If I copy paste the link to background it works fine…

Any idea?

Thanks!

have you tried it with quotes ?

background: "{{ states('input_text.background') }}"

I’ve just tried. It’s not working.
I’ve tested multiple syntaxes without success so far :frowning:

I’m not even sure that it will be able to read the input_text state.

Thanks anyway.

Found this, there’s a link in there to do it with config-template-card.

2 Likes

It worked!
The example explained in your link is pretty much what I was trying to achieve.
Thanks a lot.