Lovelace: Mini Media Player


Ok, I haven’t been paying enough attention to know about the ‘bundle’… what is the difference?


Idk, it works for me at least.
Try using ?v=0.9.1 instead of ?ver=0.9.1 maybe?

Here are some information about the bundle update


oh shit! that will be it! Never noticed before. My other ones have v= but I must have made it ver for this card. I’ll change that and see what happens next update. Thanks.


Doh, that was me. I didn’t remove the reference to the non-bundled version. :flushed:


@kalkih thank you very much for sharing this card. I manually updated to the bundle card so Im on 0.9.1.
I use it with Bose Soundtouch speakers and recently (not sure since which release) I have the following behaviour.
If I select a preset (via automation) the speaker starts playing but the card does nothing.
I have to manually go and turn the power button on to display the artwork, volume, play/pause etc.

I remember it would start once a preset was selected. Would this be as a result of a recent option? Thank you.


Interesting, what does your card configuration look like for that speaker?


Thank you; this is one:

- id: bose02  # Automatically created id
  type: custom:vertical-stack-in-card #vertical-stack
  - id: bose03
    type: custom:mini-media-player
    entity: media_player.masterroom
    name: Master SoundTouch
    artwork: cover
    power_color: true
    show_progress: true
    show_source: true
    group: true
    toggle_power: true
  - id: bose04
    type: glance
    columns: 6
    show_state: false
    show_name: false
    - entity: input_boolean.master_preset_1
      tap_action: toggle
    - entity: input_boolean.master_preset_2
      tap_action: toggle
    - entity: input_boolean.master_preset_3
      tap_action: toggle
    - entity: input_boolean.master_preset_4
      tap_action: toggle
    - entity: input_boolean.master_preset_5
      tap_action: toggle
    - entity: input_boolean.master_preset_6
      tap_action: toggle


Thank you, I’ll try to reproduce this.

Also, would be awesome if you could check and tell me the state of media_player.masterroom when it doesn’t update like it should.
You can find this by pressing the “< >” icon at the bottom of the sidebar and then searching for the entity.


My apologies. Not sure what was the issue, but I suspect cache related.
Didnt do anything and it’s now working as it should.
Many thanks for your time.


That’s great!
I know that if you leave the web app open for longer periods of time or if your connection is bad the frontend can sometimes lose the connection to the backend, resulting in the UI not updating correctly.


Thank you again


New version: v0.9.2

Pretty minor update, nonetheless, here is the changelog:

  • Changed: volume button icons, to not confuse with mute #26

  • Changed: adjusted scroll speed for (scroll_info)

  • Fixed: improved browser compatibility by removing object spread syntax #25 #27

  • Fixed: alignment of shuffle button while volume_stateless set to true

  • Fixed: alignment of source button in HA > 0.81.6


Updated perfectly today… it was the ver= instead of v=



Are you using the -bundle card? Or media only?
Mine is not updating and I’m using -bundle.
Thank you

Edit. Never mind. Saw your earlier post


Did you get it working?
If not, make sure the user you are running HA as has write permission to the .js file/files.



The plex component unfortunatly doesn’t create the media_players when my Nvidia Shield is not active. Resulting in his uggly red box. Would it be possible to just not show the box when the entry doesn’t exist.



thank you very much for your help.
Re-assigined permissions as suggested, but it still doesnt update the tag.
The file is updating, but the tag is stuck.


Ok, make sure your card reference in ui-lovelace.yaml has the following ending: ...?v=0.9.2.
Also update the custom_updater component if you’re not already on the latest version.


That card config shouldn’t work even if the entity shield_android_tv_... would exist, you need to specify the entity beginning with media_player, here’s an example: entity: media_player.shield_android_tv .

As long as the entity you specify is within the media_player domain the red error box should not render, even if the entity doesn’t exist.


You have a typo in the instructions


  • url: /local/mini-media-player-bundle.js?v=0.9.2
    type: module

However the file name is actually

You have an extra “-bundle”, I got stuck for a while trying to get it to work. Looks amazing! Thank you!