Lovelace: Mini Media Player

You are a legend. This should be stickied.

Here the code, first need this cards:

type: custom:layout-card
layout_type: masonry
layout: {}
cards:
  - type: custom:spotify-card
    account: default
    spotify_entity: media_player.spotify_NAME
    playlist_type: featured
    grid_covers_per_row: '5'
    limit: 10
    country_code: ES
    display_style: grid
  - type: entities
    entities:
      - type: custom:mini-media-player
        entity: media_player.spotify_NAME
        group: true
        source: icon
        info: short
        hide:
          volume: true
          power: true
      - type: custom:mini-media-player
        entity: media_player.echo_dot_NAME_1
        group: true
        hide:
          controls: true
      - type: custom:mini-media-player
        entity: media_player.echo_dot_NAME_2
        group: true
        hide:
          controls: true
      - type: custom:mini-media-player
        entity: media_player.echo_dot_NAME_3
        group: true
        hide:
          controls: true

So, you need to delete or duplicate all this block depending for number of speakers you have:

      - type: custom:mini-media-player
        entity: media_player.echo_dot_NAME_X
        group: true
        hide:
          controls: true

I couldn’t find anything in the thread or in github issues, just wondering if this is expected behaviour when scaling?

I want to use the card on a tablet so I scaled everything up to 2 which is great except the volume slider is still tiny.

If I switch to volume buttons they are scaled but I really want access to a slider, is there anyway to get it to scale as well, even if it takes up more space?

Can i make these buttons like youtube and netflix invisible when the device is turned off?

image

You can use custom button card, or wrap everything inside custom:config-template-card

1 Like

Thanks a lot for this. Will habe a look to it at the weekend.

I am trying to use the Mini Media Player with Bluesound. It works interactivly with the built in buttons for source but to ease the use i am teying to create buttons to trigger presets. No way i get this to work. If anyone have tips on hos to create buttons to select presets or other services directly it would help s lot

Have you tried:

tap_action:
                  action: call-service
                  service: media_player.play_media
                  service_data:
                    entity_id: media_player.xxxxxxx
                    media_content_type: favorite
                    media_content_id: 'xx'

I have a problem with my basic Mini Media Player setup.
I’m sure that I have just done something silly, but the power button for each zone is not visible.
It shows as a shadow if you hover the mouse over it, and it appears if it is switched on.

My Code is

entities:
  - entity: media_player.attic_bath
    group: true
    hide:
      controls: true
    icon: mdi:speaker
    type: custom:mini-media-player
  - entity: media_player.kitchen_sitting
    group: true
    hide:
      controls: false
    icon: mdi:speaker
    type: custom:mini-media-player
  - entity: media_player.front_room
    group: true
    hide:
      controls: false
    icon: mdi:speaker
    type: custom:mini-media-player
  - entity: media_player.kitchen_cooking
    group: true
    hide:
      controls: false
    icon: mdi:speaker
    type: custom:mini-media-player
  - entity: media_player.main_bath
    group: true
    hide:
      controls: false
    icon: mdi:speaker
    type: custom:mini-media-player
  - entity: media_player.tv_room
    group: true
    hide:
      controls: false
    icon: mdi:speaker
    type: custom:mini-media-player
show_header_toggle: false
title: Rooms
type: entities

Try…

hide:
  power: false

Thank you for your suggestion. I have changed the settings to power: false, but the power icon is still invisible.

entities:
  - entity: media_player.attic_bath
    group: true
    hide:
      power: false
    icon: mdi:speaker
    type: custom:mini-media-player
  - entity: media_player.kitchen_sitting
    group: true
    hide:
      power: false
    icon: mdi:speaker
    type: custom:mini-media-player
  - entity: media_player.front_room
    group: true
    hide:
      power: false
    icon: mdi:speaker
    type: custom:mini-media-player
  - entity: media_player.kitchen_cooking
    group: true
    hide:
      power: false
    icon: mdi:speaker
    type: custom:mini-media-player
  - entity: media_player.main_bath
    group: true
    hide:
      power: false
    icon: mdi:speaker
    type: custom:mini-media-player
  - entity: media_player.tv_room
    group: true
    hide:
      power: false
    icon: mdi:speaker
    type: custom:mini-media-player
show_header_toggle: false
title: Rooms
type: entities

what if you add hide_controls: false ?

What is above line entities: defined?

Thank you.

The code listed is the entire code from SHOW CODE EDITOR for an Entities Card Configuration.
Do I need something else ?

type: entities, right? Because wh I copy your code I get a properly working group card.
Have you checked if your entities are correct?

Thank you again.
Entities are correct. I have tried with just one source and the behaviour is the same.
The power button works, but it’s just not visible. Everything works, except the fact that the power button isn’t visible. It is the same on mobile devices and on browser.
I am using Version core-2022.2.2

I’m still using 2.1, so this will be the problem.

Make sure you clear your browser cache.

What media integration(s)

Hi,
Is it possible to set custom artwork for when TV is set to a HDMI?

Thanks.
I’ve cleared the browser cache, but no effect.
The HA companion on Iphon/Ipad similarly hides the power button.
I am just using for multi-room audio.