Skip to content

Media player card - background image changes to blank when buffering #1414

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
u8915055 opened this issue Apr 22, 2025 · 1 comment
Open
Labels
bug Something isn't working

Comments

@u8915055
Copy link

For any feature request you can open a new discussion here:
https://github.com/Clooos/Bubble-Card/discussions/categories/feature-requests

For any question you can open a new discussion here:
https://github.com/Clooos/Bubble-Card/discussions/categories/q-a

Describe the bug
I am working on a auto-expanding media card. one thing i noticed which i think is a bug is that when i go to play music on the media player, media players usually follow a state sequence of idle-buffering-playing and sometimes there are two buffering steps. I noticed, using chrome tools, that the background image for the music source appears when state is idle or playing, but disappears when state is 'buffering'. I did look at the dev tools in home assistant and the media_player attribute for background image does NOT change when in buffering state.

For my self collapsing card (and the default media card), this causes a blinking of the background image in the button during these buffering states.

To Reproduce
Play any media using a bubble card media player card and watch the CSS for background image

Expected behavior
There is probably a conditional statement in the code for displaying the actual background image that needs to have added the state of buffering.

Screenshots
If applicable, add screenshots to help explain your problem.

YAML
If applicable, add any relevant YAML code.

Your code here

Informations (please complete the following information):
home assistant 2025.4.3

Additional context
Add any other context about the problem here.

Thank you! 🍻

@u8915055 u8915055 added the bug Something isn't working label Apr 22, 2025
@u8915055
Copy link
Author

I just want to add that i may have solved my problem (still testing) by just overriding the background-image attribute with the following style code:

        .bubble-background {
            background-image: url(${hass.states[entity].attributes.entity_picture_local}) !important;
        }

Using this code, it just grabs the attribute for the image URL and just overrides the auto-determined one which i assume is determined in the module. With this style code above, the background image continues to show even when the state changes to buffering.. however it would be great to solve this without needing this style code

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working
Projects
None yet
Development

No branches or pull requests

1 participant