Skip to content

Media player: sonos

NOTE This card is under review and is not ready to use!

Sonos

Usage ## Example
- type: "custom:button-card"
  template: card_media_player_chromecast_with_controls
  variables:
    ulm_card_media_player_with_controls_name: "Chromecast"
    ulm_card_media_player_with_controls_entity: media_player.my_chromecast
## Variables
Variable Example Required Explanation
ulm_card_media_player_with_controls_name Chromecast Yes Name shown in lovelace
ulm_card_media_player_with_controls_entity media_player.my_chromecast Yes Entity id

Template Code
custom_card_chromecast.yaml
---
card_media_player_chromecast:
  size: "20px"
  show_icon: true
  show_entity_picture: false
  show_state: false
  show_name: true
  template:
    - "icon_info"
    - "blue_not_unavailable"
    - "ulm_translation_engine"
  label: "[[[ return variables.ulm_translation_state ]]]"
card_media_player_chromecast_with_controls:
  variables:
    ulm_card_media_player_with_controls_name: "No name set"
  triggers_update:
    - "[[[ ulm_card_media_player_with_controls_entity ]]]"
  styles:
    grid:
      - grid-template-areas: "'item1' 'item2'"
      - grid-template-columns: "1fr"
      - grid-template-rows: "min-content  min-content"
      - row-gap: "12px"
    card:
      - border-radius: "var(--border-radius)"
      - box-shadow: "var(--box-shadow)"
      - padding: "12px"
  custom_fields:
    item1:
      card:
        type: "custom:button-card"
        template:
          - "card_media_player_chromecast"
        tap_action:
          action: "more-info"
        entity: "[[[ return variables.ulm_card_media_player_with_controls_entity ]]]"
        name: "[[[ return variables.ulm_card_media_player_with_controls_name ]]]"
        styles:
          card:
            - box-shadow: "none"
            - padding: "0px"
    item2:
      card:
        type: "custom:button-card"
        template: "list_items"
        custom_fields:
          item1:
            card:
              type: "custom:button-card"
              template: "widget_icon"
              tap_action:
                action: "call-service"
                service: "media_player.toggle"
                service_data:
                  entity_id: "[[[ return variables.ulm_card_media_player_with_controls_entity ]]]"
              icon: "mdi:power"
          item2:
            card:
              type: "custom:button-card"
              template: "widget_icon"
              entity: "[[[ return variables.ulm_card_media_player_with_controls_entity ]]]"
              tap_action:
                action: "call-service"
                service: "media_player.media_play_pause"
                service_data:
                  entity_id: "[[[ return variables.ulm_card_media_player_with_controls_entity ]]]"
              icon: "mdi:pause"
              state:
                - value: "paused"
                  icon: "mdi:play"
                - value: "off"
                  icon: "mdi:play"
          item3:
            card:
              type: "custom:button-card"
              template: "widget_icon"
              tap_action:
                action: "call-service"
                service: "media_player.toggle"
                service_data:
                  entity_id: "[[[ return variables.ulm_card_media_player_with_controls_entity ]]]"
              icon: "mdi:video-input-hdmi"

blue_not_unavailable:
  state:
    - styles:
        icon:
          - color: "rgba(var(--color-blue),1)"
        img_cell:
          - background-color: "rgba(var(--color-blue), 0.2)"
      value: "unavailable"
      operator: "!="