kalkih / mini-media-player

Minimalistic media card for Home Assistant Lovelace UI
MIT License
1.48k stars 206 forks source link

Question - Use Sonos Favorite Sensor as dropdown in mini-media-player #670

Open 03397 opened 2 years ago

03397 commented 2 years ago

After the upgrade to 2022.5.x, as you know, the dropdown in mini-media-player does not bring the favorites of Sonos anymore, since this has been removed under the Sonos entity and a sensor has been created that has all the listing of the favorites.

IS there a way to incorporate this sensor under the listing of the mini-media-playyer and have the same functionality as before?

hawkeyeP commented 2 years ago

Hope this helps, I posted about it here: https://community.home-assistant.io/t/lovelace-mini-media-player/68459/2637?u=hawkeyep

03397 commented 2 years ago

@hawkeyeP Won't this create only a zillion buttons? I have a lot of favourites. Can be this added in a list?

hawkeyeP commented 2 years ago

Just use the list option instead of buttons if that is what you want.
Screenshot_20220514-093027_Chrome

03397 commented 2 years ago

I managed to do the list using the following

type: vertical-stack
cards:
  - type: custom:auto-entities
    card:
      type: entities
    filter:
      template: |

        {
          'entity': 'media_player.sonos_beam',
          'type': 'custom:mini-media-player',
          'source': 'icon',
          'info': 'scroll',
          'hide': {
            'power': 'true',
            'shuffle': '',
            'runtime': '',
            'volume_level': '',
            },
          'shortcuts':{
            'label': 'Favourites', 
            'list':
              [
                {%- for media_id, station in state_attr("sensor.sonos_favorites", "items").items()  -%}
                  {{ {
                    'name': station,

                    'type': 'service',
                    'id': 'media_player.play_media',
                    'data':

                        {
                          'entity_id': 'media_player.sonos_beam',
                          'media_content_id': media_id,
                          'media_content_type': 'favorite_item_id'
                        }

                  } }},
                {%- endfor -%}
            ],

            }

        },
  - type: custom:mini-media-player
    entity: media_player.sonos_beam
    source: null
    artwork: full-cover
    hide:
      icon: true
      name: true
      volume: true
      power: true
      source: true
      controls: true
      info: true
  - type: custom:auto-entities
    card:
      type: entities
    filter:
      template: |

        {
          'entity': 'media_player.sonos_one',
          'type': 'custom:mini-media-player',
          'source': 'full',
          'info': 'scroll', 
          'hide': {
            'power': 'true',
            'shuffle': '',
            'runtime': '',
            'volume_level': '',
            },
          'shortcuts':{
            'label': 'Favourites', 
            'list':
              [
                {%- for media_id, station in state_attr("sensor.sonos_favorites", "items").items()  -%}
                  {{ {
                    'name': station,

                    'type': 'service',
                    'id': 'media_player.play_media',
                    'data':

                        {
                          'entity_id': 'media_player.sonos_one',
                          'media_content_id': media_id,
                          'media_content_type': 'favorite_item_id'
                        }

                  } }},
                {%- endfor -%}
            ],

            }

        },
  - type: custom:mini-media-player
    entity: media_player.sonos_one
    source: null
    artwork: full-cover
    hide:
      icon: true
      name: true
      volume: true
      power: true
      source: true
      controls: true
      info: true

But now when I select something from the favorite's playlist and then select source TV from the other dropdown list as seen from the picture(picture 1), the next time I try to select TV while something is being played, TV is highlighted and I cannot select it again(picture 2). I need to change tab and come back or refresh.

image image

svb91 commented 2 years ago

@03397

Could you please help me by finding a solution to remove the padding between the media player and the auto-entities container? None of my style worked at that point...

StanDaMan0505 commented 1 year ago

I managed to do the list using the following

type: vertical-stack
cards:
  - type: custom:auto-entities
    card:
      type: entities
    filter:
      template: |

        {
          'entity': 'media_player.sonos_beam',
          'type': 'custom:mini-media-player',
          'source': 'icon',
          'info': 'scroll',
          'hide': {
            'power': 'true',
            'shuffle': '',
            'runtime': '',
            'volume_level': '',
            },
          'shortcuts':{
            'label': 'Favourites', 
            'list':
              [
                {%- for media_id, station in state_attr("sensor.sonos_favorites", "items").items()  -%}
                  {{ {
                    'name': station,

                    'type': 'service',
                    'id': 'media_player.play_media',
                    'data':

                        {
                          'entity_id': 'media_player.sonos_beam',
                          'media_content_id': media_id,
                          'media_content_type': 'favorite_item_id'
                        }

                  } }},
                {%- endfor -%}
            ],

            }

        },
  - type: custom:mini-media-player
    entity: media_player.sonos_beam
    source: null
    artwork: full-cover
    hide:
      icon: true
      name: true
      volume: true
      power: true
      source: true
      controls: true
      info: true
  - type: custom:auto-entities
    card:
      type: entities
    filter:
      template: |

        {
          'entity': 'media_player.sonos_one',
          'type': 'custom:mini-media-player',
          'source': 'full',
          'info': 'scroll', 
          'hide': {
            'power': 'true',
            'shuffle': '',
            'runtime': '',
            'volume_level': '',
            },
          'shortcuts':{
            'label': 'Favourites', 
            'list':
              [
                {%- for media_id, station in state_attr("sensor.sonos_favorites", "items").items()  -%}
                  {{ {
                    'name': station,

                    'type': 'service',
                    'id': 'media_player.play_media',
                    'data':

                        {
                          'entity_id': 'media_player.sonos_one',
                          'media_content_id': media_id,
                          'media_content_type': 'favorite_item_id'
                        }

                  } }},
                {%- endfor -%}
            ],

            }

        },
  - type: custom:mini-media-player
    entity: media_player.sonos_one
    source: null
    artwork: full-cover
    hide:
      icon: true
      name: true
      volume: true
      power: true
      source: true
      controls: true
      info: true

But now when I select something from the favorite's playlist and then select source TV from the other dropdown list as seen from the picture(picture 1), the next time I try to select TV while something is being played, TV is highlighted and I cannot select it again(picture 2). I need to change tab and come back or refresh.

image image

@03397 In your screenshot, you show a drop-down list for the different players (like TV), but I can't find that configuration in your code.. I copied your code and adjusted it according to my media_players, but I don't get a drop down-list for the players..

Can you shed some light?

Thanks.