Lovelace: Mini Media Player

This is achieving using the beta version 4.0 of https://github.com/Apipa169/Assistant-Relay-for-Hassio

It’s just not documented well. I was only able to see it could broadcast to specific devices by the new GUI that it ships with. I was then able to work out what the commands from HA had to be to send to specific devices.

Don’t think I’m doing anything special. What does yours show?

A link to share my experience with an Echo device and this custom component :slight_smile:

I did encounter another state that I would like to account for… “unavailable.” Although as it’s not a valid playing state, I’m not sure it’s something that can be accounted for easily.

I keep a few of my Sonos speakers powered off using a Z-wave appliance module because I don’t use them often. I would like to show them as unavailable, or–even better–show a button that would allow me to turn on the relevant appliance module instead!

I’ve just added your code to a conditional Lovelace card so that when the power is off, it displays only a button to turn it on; and if the power is on and the device_tracker shows it is “home”, then it shows your display instead:

type: vertical-stack
cards:
  - type: conditional
    conditions:
      - entity: switch.sonos_casita_power_current_value
        state: 'off'
    card:
      type: button
      tap_action:
        action: toggle
      entity: switch.sonos_casita_power_current_value
      show_state: true
      icon: 'mdi:power'
      name: Sonos Casita
  - type: conditional
    conditions:
      - entity: device_tracker.sonoszp_8
        state: home
      - entity: switch.sonos_casita_power_current_value
        state: 'on'
    card:
      cards:
        - cards:
            - entities:
                - height: 1
                  size: 5
              type: 'custom:gap-card'
            - entity: media_player.sonos_casita
              group: true
              artwork: cover
              source: full
              info: short
              type: 'custom:mini-media-player'
            - entity: media_player.sonos_casita
              hide:
                name: true
                controls: true
                icon: true
                info: true
                mute: true
                power: true
                source: true
                volume: true
                progress: true
              shortcuts:
                buttons:
                  - data:
                      entity_id: script.sonos_casita_talking_heads
                    icon: 'mdi:radio'
                    id: script.turn_on
                    name: Talking Heads
                    type: service
                  - data:
                      entity_id: script.sonos_casita_van_morrison
                    icon: 'mdi:radio'
                    id: script.turn_on
                    name: Van Morrison
                    type: service
                  - data:
                      entity_id: script.sonos_casita_flogging_molly
                    icon: 'mdi:radio'
                    id: script.turn_on
                    name: Flogging Molly
                    type: service
                  - data:
                      entity_id: script.sonos_casita_line_in
                    icon: 'mdi:ethernet-cable'
                    id: script.turn_on
                    name: Line-in
                    type: service
                columns: 1
              show_group_count: true
              show_progress: true
              type: 'custom:mini-media-player'
              volume_stateless: true
            - cards:
                - color_type: icon
                  aspect_ratio: 2/1
                  color: auto
                  entity: media_player.sonos_living_room
                  name: Living Room
                  show_name: true
                  tap_action:
                    action: call-service
                    service: script.turn_on
                    service_data:
                      entity_id: script.sonos_living_room_join_unjoin_living_room
                  show_state: false
                  state:
                    - color: '#00FF00'
                      icon: 'mdi:speaker-wireless'
                      value: playing
                    - color: '#8C8C8C'
                      icon: 'mdi:speaker'
                      value: paused
                    - color: '#FF0000'
                      icon: 'mdi:speaker-off'
                      value: idle
                  styles:
                    card:
                      - height: 50px
                    name:
                      - font-size: 12px
                  type: 'custom:button-card'
                - color_type: icon
                  aspect_ratio: 2/1
                  color: auto
                  entity: media_player.sonos_upstairs
                  name: Upstairs
                  show_name: true
                  tap_action:
                    action: call-service
                    service: script.turn_on
                    service_data:
                      entity_id: script.sonos_upstairs_join_unjoin_living_room
                  show_state: false
                  state:
                    - color: '#00FF00'
                      icon: 'mdi:speaker-wireless'
                      value: playing
                    - color: '#8C8C8C'
                      icon: 'mdi:speaker'
                      value: paused
                    - color: '#FF0000'
                      icon: 'mdi:speaker-off'
                      value: idle
                  styles:
                    card:
                      - height: 50px
                    name:
                      - font-size: 12px
                  type: 'custom:button-card'
                - color_type: icon
                  aspect_ratio: 2/1
                  color: auto
                  entity: media_player.sonos_portable
                  name: Portable
                  show_name: true
                  tap_action:
                    action: call-service
                    service: script.turn_on
                    service_data:
                      entity_id: script.sonos_portable_join_unjoin_living_room
                  show_state: false
                  state:
                    - color: '#00FF00'
                      icon: 'mdi:speaker-wireless'
                      value: playing
                    - color: '#8C8C8C'
                      icon: 'mdi:speaker'
                      value: paused
                    - color: '#FF0000'
                      icon: 'mdi:speaker-off'
                      value: idle
                  styles:
                    card:
                      - height: 50px
                    name:
                      - font-size: 12px
                  type: 'custom:button-card'
                - color_type: icon
                  aspect_ratio: 2/1
                  color: auto
                  entity: media_player.sonos_basement
                  name: Basement
                  show_name: true
                  tap_action:
                    action: call-service
                    service: script.turn_on
                    service_data:
                      entity_id: script.sonos_basement_join_unjoin_living_room
                  show_state: false
                  state:
                    - color: '#00FF00'
                      icon: 'mdi:speaker-wireless'
                      value: playing
                    - color: '#8C8C8C'
                      icon: 'mdi:speaker'
                      value: paused
                    - color: '#FF0000'
                      icon: 'mdi:speaker-off'
                      value: idle
                  styles:
                    card:
                      - height: 50px
                    name:
                      - font-size: 12px
                  type: 'custom:button-card'
              type: horizontal-stack
          type: vertical-stack
      mode: vertical
      style: |
        ha-card {
          font-variant: small-caps;
          --ha-card-background: rgba(34, 34, 34, .2);
          background-repeat: no-repeat;
          background-color: rgba(50,50,50,0.3);
          background-size: 100% 68px;
          border-radius: 5px;
          }
        .card-header {
          font-size: 20px;
        }


          
      type: 'custom:stack-in-card'

This actually works just fine as a valid state:

                - color: '#FF0000'
                  icon: 'mdi:close-circle-outline'
                  value: unavailable

Now, powering on the appliance module from this button will likely take some scripting. I might try it, but as it stands that’s over my head.

EDIT: I can’t believe this worked. This may seem really straightforward for most of you, but I don’t code. This script does exactly what I was shooting for:

# Sonos Casita Join/Unjoin Living Room
sonos_casita_join_unjoin_living_room:
  alias: Sonos Casita Join/Unjoin Living Room
  sequence:
  - choose:
    - conditions:
      - condition: state
        entity_id: media_player.sonos_casita
        state: playing
      sequence:
      - service: sonos.unjoin
        data:
          entity_id: media_player.sonos_casita
    - conditions:
      - condition: state
        entity_id: media_player.sonos_casita
        state: paused
      sequence:
      - service: sonos.join
        data:
          entity_id: media_player.sonos_casita
          master: media_player.sonos_living_room
    - conditions:
      - condition: state
        entity_id: media_player.sonos_casita
        state: idle
      sequence:
      - service: sonos.join
        data:
          entity_id: media_player.sonos_casita
          master: media_player.sonos_living_room
	- conditions:
      - condition: state
        entity_id: media_player.sonos_casita
        state: unavailable
      sequence:
      - service: switch.turn_on
        data:
          entity_id: media_player.sonos_casita
    default: []
  mode: single

…I’m using this card and scripts in two areas, for two different Sonos devices. Now I need to figure out a smooth way to unjoin the master from another device while it’s playing, and what that UI will look like…

1 Like

Thanks for posting!

Im trying to set the buttons up to change radio stations on a squeezebox system.
I have the stations saved in ‘Playlists’ in LMS but cant get the stations to change.

In Dev tools I can use:

service: squeezebox.call_method
data:
  entity_id: media_player.portable_radio
  command: playlist
  parameters:
    - play
    - Radio_2

Ive tried two ways but still not working:

shortcuts:
  columns: 2
  buttons:
    - name: Radio 2
      type: service
      id: media_player.play_media
      data:
        entity_id: media_player.portable_radio
        command: playlist
        parameters:
          - play
          - Radio_2
    - name: Radio 2
      type: playlist
      id: Radio_2

Any help where I’m going wrong on this?

I believe that if you are calling the ‘playlist play’ method of the Logitech Media Server CLI, you need to include the folder name as well as the playlist name. So if you have saved the playlist to a folder called ‘Playlists’, the second parameter should be:

- /Playlists/Radio_2

If you were really going belt and braces, you could include the full directory path to your playlist folder as well as the playlist name.

In that case your second parameter should be:

- /<path-to-your-playlist-folder>/Playlists/Radio_2

PS You can find your setting for the Playlists folder under ‘Basic Settings’ in LMS

I tried what you suggested Chris but it still won’t select a station coming up with the same errors as before, either:
Failed to call service media_player/play_media. Expecting Value 1 line 1 (char0)
Or
Failed to call service media_player/play_media. extra keys not allowed @ data [‘command’ ]

Sorry, I didn’t think to check the rest of your code, which is not the correct way to call a service from the shortcut object on the mini media card. Does this work?

shortcuts:
  columns: 2
  buttons:
    - name: 'Radio 2'
      type: service
      id: squeezebox.call_method
      data:
        entity_id: media_player.portable_radio
        command: playlist
        parameters:
          - play
          - /Playlists/Radio_2

The most important part is to assign the shortcut type to service and the shortcut id to squeezebox.call_method.

That did it, thank you, been working on this for a while. Thanks again.

Am I correct to conclude that the icon state color only reacts on ‘off’ to ‘playing’? Chromecast device properly changes on these status changes. However my SONOS media player icon color always stays on when it returns from ‘playing’ to ‘paused’. Unless I have overlooked one of the configuration options, can’t we have the icon color react to ‘playing’=ON and ‘something else-off,idle, paused’ = OFF?

Sorry to bring back an old topic. but, is there a way to not have an idle_view ie. always full view?
Also, Is there a way to have the media browser icon directly on the card?

I just noticed that the state is not idle but off.
Is there a way to keep the controls on the card even when off?

Hi All, I am using HACS to load the player but it is not loading. i already deleted the cache, reloaded. deleted the app restarted has and tried again but with the same result.

does anyone know what I should do next? By the way the player is working!

Thanks

Hi,
I know i am a little out of topic, but I got here searching for answers (which i found, thanks to this post)
but i am really interested in your ui, the look of it, could you let me know what “theme” it is that you are using or its completely custom?

thanks

Please don’t ask for private answers.

when did I do that?

maybe it’s my bad english, I speak french normally…

fixed it, wasn’t intentional.

It is a custom theme. It’s here. It is out of date due to recent card-mod updates and I won’t be in a position to update it for at least three weeks.

Hey thanks! I am just starting into theming my HA, I was concentrating on making it work properly first :wink:

Thank you!