Tweak my remote hide / show functionality

I have the below remote that I hide and show the remote when it’s on watch TV. And I’m hiding and showing each button based on the “Watch TV” activity. What I would like to do is hide the whole remote (buttons not pulldowns) in one shot if possible when the Activity is Watch TV. I’d also like to duplicate the buttons two more times and have one set show when Listening To Music and the other when Watching Movies. So the current remote borrowed from here and tweaked:

And when the TV is off:

image

The code is below. Any help with redoing this cleaner and as I wanted to above with two more remotes that can be switched between?

cards:
  - entities:
      - entity: sensor.familyroom_tv
        icon: 'mdi:power'
        name: Shut Off Current Activity
        tap_action:
          action: call-service
          service: script.turn_off_activity
      - input_select.harmonytvsource
      - input_select.favorite_channels
    show_header_toggle: false
    title: Family Room Remote
    type: entities
  - cards:
      - card:
          color: var(--primary-text-color)
          color_type: icon
          icon: 'mdi:exit-to-app'
          name: TV
          show_icon: false
          size: 25%
          styles:
            card:
              - border-radius: 30px
              - height: 52px
            label:
              - color: gray
              - font-size: 9px
              - justify-self: start
              - padding: 0px 5px
            name:
              - font-weight: bold
              - font-size: 15px
              - padding: 0px 0px
          tap_action:
            action: call-service
            service: remote.send_command
            service_data:
              command: PowerToggle
              device: Panasonic TV
              entity_id: remote.familyroom_hub
          type: 'custom:button-card'
        conditions:
          - entity: input_select.harmonytvsource
            state: Watch TV
        type: conditional
      - card:
          color: var(--primary-text-color)
          color_type: icon
          icon: 'mdi:chevron-up'
          name: XBox
          show_icon: false
          size: 25%
          styles:
            card:
              - border-radius: 30px
              - height: 52px
            label:
              - color: gray
              - font-size: 9px
              - justify-self: start
              - padding: 0px 5px
            name:
              - font-weight: bold
              - font-size: 15px
              - padding: 0px 0px
          tap_action:
            action: call-service
            service: remote.send_command
            service_data:
              command: PowerToggle
              device: Microsoft Xbox 360
              entity_id: remote.familyroom_hub
          type: 'custom:button-card'
        conditions:
          - entity: input_select.harmonytvsource
            state: Watch TV
        type: conditional
      - card:
          color: var(--primary-text-color)
          color_type: icon
          icon: 'mdi:menu'
          name: Denon
          show_icon: false
          size: 25%
          styles:
            card:
              - border-radius: 30px
              - height: 52px
            label:
              - color: gray
              - font-size: 9px
              - justify-self: start
              - padding: 0px 5px
            name:
              - font-weight: bold
              - font-size: 15px
              - padding: 0px 0px
          tap_action:
            action: call-service
            service: remote.send_command
            service_data:
              command: PowerToggle
              device: Denon AV Receiver
              entity_id: remote.familyroom_hub
          type: 'custom:button-card'
        conditions:
          - entity: input_select.harmonytvsource
            state: Watch TV
        type: conditional
      - card:
          color: var(--primary-text-color)
          color_type: icon
          icon: 'mdi:volume-plus'
          name: Shield
          show_icon: false
          size: 25%
          styles:
            card:
              - border-radius: 30px
              - height: 52px
            label:
              - color: gray
              - font-size: 9px
              - justify-self: start
              - padding: 0px 5px
            name:
              - font-weight: bold
              - font-size: 15px
              - padding: 0px 0px
          tap_action:
            action: call-service
            service: remote.send_command
            service_data:
              command: PowerToggle
              device: NVidia Shield-----
              entity_id: remote.familyroom_hub
          type: 'custom:button-card'
        conditions:
          - entity: input_select.harmonytvsource
            state: Watch TV
        type: conditional
    type: horizontal-stack
  - cards:
      - card:
          color: var(--primary-text-color)
          color_type: icon
          icon: 'mdi:rewind'
          size: 25%
          styles:
            card:
              - border-radius: 30px
              - height: 52px
            label:
              - color: gray
              - font-size: 9px
              - justify-self: start
              - padding: 0px 5px
            name:
              - font-size: 12px
              - padding: 0px 0px
          tap_action:
            action: call-service
            service: remote.send_command
            service_data:
              command: Rewind
              device: Microsoft Xbox 360
              entity_id: remote.familyroom_hub
          type: 'custom:button-card'
        conditions:
          - entity: input_select.harmonytvsource
            state: Watch TV
        type: conditional
      - card:
          color: var(--primary-text-color)
          color_type: icon
          double_tap_action:
            action: call-service
            service: remote.send_command
            service_data:
              command: Pause
              device: Microsoft Xbox 360
              entity_id: remote.familyroom_hub
          icon: 'mdi:play-pause'
          size: 25%
          styles:
            card:
              - border-radius: 30px
              - height: 52px
            label:
              - color: gray
              - font-size: 9px
              - justify-self: start
              - padding: 0px 5px
            name:
              - font-size: 12px
              - padding: 0px 0px
          tap_action:
            action: call-service
            service: remote.send_command
            service_data:
              command: Play
              device: Microsoft Xbox 360
              entity_id: remote.familyroom_hub
          type: 'custom:button-card'
        conditions:
          - entity: input_select.harmonytvsource
            state: Watch TV
        type: conditional
      - card:
          color: var(--primary-text-color)
          color_type: icon
          icon: 'mdi:fast-forward'
          size: 25%
          styles:
            card:
              - border-radius: 30px
              - height: 52px
            label:
              - color: gray
              - font-size: 9px
              - justify-self: start
              - padding: 0px 5px
            name:
              - font-size: 12px
              - padding: 0px 0px
          tap_action:
            action: call-service
            service: remote.send_command
            service_data:
              command: FastForward
              device: Microsoft Xbox 360
              entity_id: remote.familyroom_hub
          type: 'custom:button-card'
        conditions:
          - entity: input_select.harmonytvsource
            state: Watch TV
        type: conditional
      - card:
          color: var(--primary-text-color)
          color_type: icon
          icon: 'mdi:volume-plus'
          size: 25%
          styles:
            card:
              - border-radius: 30px
              - height: 52px
            label:
              - color: gray
              - font-size: 9px
              - justify-self: start
              - padding: 0px 5px
            name:
              - font-size: 12px
              - padding: 0px 0px
          tap_action:
            action: call-service
            service: remote.send_command
            service_data:
              command: VolumeUp
              device: Denon AV Receiver
              entity_id: remote.familyroom_hub
          type: 'custom:button-card'
        conditions:
          - entity: input_select.harmonytvsource
            state: Watch TV
        type: conditional
    type: horizontal-stack
  - cards:
      - card:
          color: var(--primary-text-color)
          color_type: icon
          icon: 'mdi:skip-backward'
          size: 25%
          styles:
            card:
              - border-radius: 30px
              - height: 52px
            label:
              - color: gray
              - font-size: 9px
              - justify-self: start
              - padding: 0px 5px
            name:
              - font-weight: bold
              - font-size: 15px
              - padding: 0px 0px
          tap_action:
            action: call-service
            service: remote.send_command
            service_data:
              command: SkipBack
              device: Microsoft Xbox 360
              entity_id: remote.familyroom_hub
          type: 'custom:button-card'
        conditions:
          - entity: input_select.harmonytvsource
            state: Watch TV
        type: conditional
      - card:
          color: var(--primary-text-color)
          color_type: icon
          icon: 'mdi:chevron-up'
          size: 25%
          styles:
            card:
              - border-radius: 30px
              - height: 52px
            label:
              - color: gray
              - font-size: 9px
              - justify-self: start
              - padding: 0px 5px
            name:
              - font-size: 12px
              - padding: 0px 0px
          tap_action:
            action: call-service
            service: remote.send_command
            service_data:
              command: DirectionUp
              device: Microsoft Xbox 360
              entity_id: remote.familyroom_hub
          type: 'custom:button-card'
        conditions:
          - entity: input_select.harmonytvsource
            state: Watch TV
        type: conditional
      - card:
          color: var(--primary-text-color)
          color_type: icon
          icon: 'mdi:skip-forward'
          size: 25%
          styles:
            card:
              - border-radius: 30px
              - height: 52px
            label:
              - color: gray
              - font-size: 9px
              - justify-self: start
              - padding: 0px 5px
            name:
              - font-size: 12px
              - padding: 0px 0px
          tap_action:
            action: call-service
            service: remote.send_command
            service_data:
              command: SkipForward
              device: Microsoft Xbox 360
              entity_id: remote.familyroom_hub
          type: 'custom:button-card'
        conditions:
          - entity: input_select.harmonytvsource
            state: Watch TV
        type: conditional
      - card:
          color: var(--primary-text-color)
          color_type: icon
          icon: 'mdi:volume-minus'
          size: 25%
          styles:
            card:
              - border-radius: 30px
              - height: 52px
            label:
              - color: gray
              - font-size: 9px
              - justify-self: start
              - padding: 0px 5px
            name:
              - font-size: 12px
              - padding: 0px 0px
          tap_action:
            action: call-service
            service: remote.send_command
            service_data:
              command: VolumeDown
              device: Denon AV Receiver
              entity_id: remote.familyroom_hub
          type: 'custom:button-card'
        conditions:
          - entity: input_select.harmonytvsource
            state: Watch TV
        type: conditional
    type: horizontal-stack
  - cards:
      - card:
          color: var(--primary-text-color)
          color_type: icon
          icon: 'mdi:chevron-left'
          size: 25%
          styles:
            card:
              - border-radius: 30px
              - height: 52px
            label:
              - color: gray
              - font-size: 9px
              - justify-self: start
              - padding: 0px 5px
            name:
              - font-size: 12px
              - padding: 0px 0px
          tap_action:
            action: call-service
            service: remote.send_command
            service_data:
              command: DirectionLeft
              device: Microsoft Xbox 360
              entity_id: remote.familyroom_hub
          type: 'custom:button-card'
        conditions:
          - entity: input_select.harmonytvsource
            state: Watch TV
        type: conditional
      - card:
          color: var(--primary-text-color)
          color_type: icon
          icon: 'mdi:smoke-detector'
          size: 25%
          styles:
            card:
              - border-radius: 30px
              - height: 52px
            label:
              - color: gray
              - font-size: 9px
              - justify-self: start
              - padding: 0px 5px
            name:
              - font-size: 12px
              - padding: 0px 0px
          tap_action:
            action: call-service
            service: remote.send_command
            service_data:
              command: OK
              device: Microsoft Xbox 360
              entity_id: remote.familyroom_hub
          type: 'custom:button-card'
        conditions:
          - entity: input_select.harmonytvsource
            state: Watch TV
        type: conditional
      - card:
          color: var(--primary-text-color)
          color_type: icon
          icon: 'mdi:chevron-right'
          size: 25%
          styles:
            card:
              - border-radius: 30px
              - height: 52px
            label:
              - color: gray
              - font-size: 9px
              - justify-self: start
              - padding: 0px 5px
            name:
              - font-size: 12px
              - padding: 0px 0px
          tap_action:
            action: call-service
            service: remote.send_command
            service_data:
              command: DirectionRight
              device: Microsoft Xbox 360
              entity_id: remote.familyroom_hub
          type: 'custom:button-card'
        conditions:
          - entity: input_select.harmonytvsource
            state: Watch TV
        type: conditional
      - card:
          color: var(--primary-text-color)
          color_type: icon
          icon: 'mdi:arrow-up-bold'
          name: CH
          size: 25%
          styles:
            card:
              - border-radius: 30px
              - height: 52px
            label:
              - color: gray
              - font-size: 9px
              - justify-self: start
              - padding: 0px 5px
            name:
              - font-size: 12px
              - padding: 0px 0px
          tap_action:
            action: call-service
            service: remote.send_command
            service_data:
              command: ChannelUp
              device: Microsoft Xbox 360
              entity_id: remote.familyroom_hub
          type: 'custom:button-card'
        conditions:
          - entity: input_select.harmonytvsource
            state: Watch TV
        type: conditional
    type: horizontal-stack
  - cards:
      - card:
          color: var(--primary-text-color)
          color_type: icon
          icon: 'mdi:volume-off'
          size: 25%
          styles:
            card:
              - border-radius: 30px
              - height: 52px
            label:
              - color: gray
              - font-size: 9px
              - justify-self: start
              - padding: 0px 5px
            name:
              - font-size: 12px
              - padding: 0px 0px
          tap_action:
            action: call-service
            service: remote.send_command
            service_data:
              command: Mute
              device: Denon AV Receiver
              entity_id: remote.familyroom_hub
          type: 'custom:button-card'
        conditions:
          - entity: input_select.harmonytvsource
            state: Watch TV
        type: conditional
      - card:
          color: var(--primary-text-color)
          color_type: icon
          icon: 'mdi:chevron-down'
          size: 25%
          styles:
            card:
              - border-radius: 30px
              - height: 52px
            label:
              - color: gray
              - font-size: 9px
              - justify-self: start
              - padding: 0px 5px
            name:
              - font-size: 12px
              - padding: 0px 0px
          tap_action:
            action: call-service
            service: remote.send_command
            service_data:
              command: DirectionDown
              device: Microsoft Xbox 360
              entity_id: remote.familyroom_hub
          type: 'custom:button-card'
        conditions:
          - entity: input_select.harmonytvsource
            state: Watch TV
        type: conditional
      - card:
          color: var(--primary-text-color)
          color_type: icon
          icon: 'mdi:keyboard-return'
          size: 25%
          styles:
            card:
              - border-radius: 30px
              - height: 52px
            label:
              - color: gray
              - font-size: 9px
              - justify-self: start
              - padding: 0px 5px
            name:
              - font-size: 12px
              - padding: 0px 0px
          tap_action:
            action: call-service
            service: remote.send_command
            service_data:
              command: Back
              device: Microsoft Xbox 360
              entity_id: remote.familyroom_hub
          type: 'custom:button-card'
        conditions:
          - entity: input_select.harmonytvsource
            state: Watch TV
        type: conditional
      - card:
          color: var(--primary-text-color)
          color_type: icon
          icon: 'mdi:arrow-down-bold'
          name: CH
          size: 25%
          styles:
            card:
              - border-radius: 30px
              - height: 52px
            label:
              - color: gray
              - font-size: 9px
              - justify-self: start
              - padding: 0px 5px
            name:
              - font-size: 12px
              - padding: 0px 0px
          tap_action:
            action: call-service
            service: remote.send_command
            service_data:
              command: ChannelDown
              device: Microsoft Xbox 360
              entity_id: remote.familyroom_hub
          type: 'custom:button-card'
        conditions:
          - entity: input_select.harmonytvsource
            state: Watch TV
        type: conditional
    type: horizontal-stack
  - cards:
      - card:
          color: red
          color_type: icon
          icon: 'mdi:record-rec'
          size: 25%
          styles:
            card:
              - border-radius: 30px
              - height: 52px
            label:
              - color: gray
              - font-size: 9px
              - justify-self: start
              - padding: 0px 5px
            name:
              - font-size: 12px
              - padding: 0px 0px
          tap_action:
            action: call-service
            service: remote.send_command
            service_data:
              command: Record
              device: Microsoft Xbox 360
              entity_id: remote.familyroom_hub
          type: 'custom:button-card'
        conditions:
          - entity: input_select.harmonytvsource
            state: Watch TV
        type: conditional
      - card:
          color: var(--primary-text-color)
          color_type: icon
          icon: 'mdi:stop'
          size: 25%
          styles:
            card:
              - border-radius: 30px
              - height: 52px
            label:
              - color: gray
              - font-size: 9px
              - justify-self: start
              - padding: 0px 5px
            name:
              - font-size: 12px
              - padding: 0px 0px
          tap_action:
            action: call-service
            service: remote.send_command
            service_data:
              command: Stop
              device: Microsoft Xbox 360
              entity_id: remote.familyroom_hub
          type: 'custom:button-card'
        conditions:
          - entity: input_select.harmonytvsource
            state: Watch TV
        type: conditional
      - card:
          color: var(--primary-text-color)
          color_type: icon
          icon: 'mdi:television-guide'
          size: 25%
          styles:
            card:
              - border-radius: 30px
              - height: 52px
            label:
              - color: gray
              - font-size: 9px
              - justify-self: start
              - padding: 0px 5px
            name:
              - font-size: 12px
              - padding: 0px 0px
          tap_action:
            action: call-service
            service: remote.send_command
            service_data:
              command: Guide
              device: Microsoft Xbox 360
              entity_id: remote.familyroom_hub
          type: 'custom:button-card'
        conditions:
          - entity: input_select.harmonytvsource
            state: Watch TV
        type: conditional
      - card:
          color: var(--primary-text-color)
          color_type: icon
          icon: 'mdi:information'
          size: 25%
          styles:
            card:
              - border-radius: 30px
              - height: 52px
            label:
              - color: gray
              - font-size: 9px
              - justify-self: start
              - padding: 0px 5px
            name:
              - font-size: 12px
              - padding: 0px 0px
          tap_action:
            action: call-service
            service: remote.send_command
            service_data:
              command: Info
              device: Microsoft Xbox 360
              entity_id: remote.familyroom_hub
          type: 'custom:button-card'
        conditions:
          - entity: input_select.harmonytvsource
            state: Watch TV
        type: conditional
    type: horizontal-stack
  - cards:
      - card:
          color: red
          color_type: icon
          icon: ''
          name: CLEAR
          size: 25%
          styles:
            card:
              - border-radius: 30px
              - height: 52px
            label:
              - color: gray
              - font-size: 9px
              - justify-self: start
              - padding: 0px 5px
            name:
              - font-weight: bold
              - font-size: 12px
              - padding: 0px 0px
          tap_action:
            action: call-service
            service: remote.send_command
            service_data:
              command: Clear
              device: Microsoft Xbox 360
              entity_id: remote.familyroom_hub
          type: 'custom:button-card'
        conditions:
          - entity: input_select.harmonytvsource
            state: Watch TV
        type: conditional
      - card:
          color: var(--primary-text-color)
          color_type: icon
          icon: ''
          name: Recorded<br>TV
          size: 25%
          styles:
            card:
              - border-radius: 30px
              - height: 52px
            label:
              - color: gray
              - font-size: 9px
              - justify-self: start
              - padding: 0px 5px
            name:
              - font-weight: bold
              - font-size: 12px
              - padding: 0px 0px
          tap_action:
            action: call-service
            service: remote.send_command
            service_data:
              command: RecordedTv
              device: Microsoft Xbox 360
              entity_id: remote.familyroom_hub
          type: 'custom:button-card'
        conditions:
          - entity: input_select.harmonytvsource
            state: Watch TV
        type: conditional
      - card:
          color: var(--primary-text-color)
          color_type: icon
          icon: ''
          name: Live TV
          size: 25%
          styles:
            card:
              - border-radius: 30px
              - height: 52px
            label:
              - color: gray
              - font-size: 9px
              - justify-self: start
              - padding: 0px 5px
            name:
              - font-weight: bold
              - font-size: 12px
              - padding: 0px 0px
          tap_action:
            action: call-service
            service: remote.send_command
            service_data:
              command: LiveTv
              device: Microsoft Xbox 360
              entity_id: remote.familyroom_hub
          type: 'custom:button-card'
        conditions:
          - entity: input_select.harmonytvsource
            state: Watch TV
        type: conditional
      - card:
          color: var(--primary-text-color)
          color_type: icon
          icon: ''
          name: Media<br>Center
          size: 25%
          styles:
            card:
              - border-radius: 30px
              - height: 52px
            label:
              - color: gray
              - font-size: 9px
              - justify-self: start
              - padding: 0px 5px
            name:
              - font-weight: bold
              - font-size: 12px
              - padding: 0px 0px
          tap_action:
            action: call-service
            service: remote.send_command
            service_data:
              command: Media Center
              device: Microsoft Xbox 360
              entity_id: remote.familyroom_hub
          type: 'custom:button-card'
        conditions:
          - entity: input_select.harmonytvsource
            state: Watch TV
        type: conditional
    type: horizontal-stack
  - cards:
      - card:
          color: var(--primary-text-color)
          color_type: icon
          icon: ''
          name: Jump<br>30
          size: 25%
          styles:
            card:
              - border-radius: 30px
              - width: 98px
              - height: 50px
            label:
              - color: gray
              - font-size: 9px
              - justify-self: start
              - padding: 0px 5px
            name:
              - font-weight: bold
              - font-size: 12px
              - padding: 0px 0px
          tap_action:
            action: call-service
            service: script.turn_on
            service_data:
              entity_id: script.jump_30_xbox_360
          type: 'custom:button-card'
        conditions:
          - entity: input_select.harmonytvsource
            state: Watch TV
        type: conditional
      - card:
          color: var(--primary-text-color)
          color_type: icon
          icon: ''
          name: Recorded<br>TV
          size: 25%
          styles:
            card:
              - border-radius: 30px
              - height: 52px
            label:
              - color: gray
              - font-size: 9px
              - justify-self: start
              - padding: 0px 5px
            name:
              - font-weight: bold
              - font-size: 12px
              - padding: 0px 0px
          tap_action:
            action: call-service
            service: script.turn_on
            service_data:
              entity_id: script.recordedtv_xbox_360
          type: 'custom:button-card'
        conditions:
          - entity: input_select.harmonytvsource
            state: ABCDEFG
        type: conditional
      - card:
          color: var(--primary-text-color)
          color_type: icon
          icon: ''
          name: Live TV
          size: 25%
          styles:
            card:
              - border-radius: 30px
              - height: 52px
            label:
              - color: gray
              - font-size: 9px
              - justify-self: start
              - padding: 0px 5px
            name:
              - font-weight: bold
              - font-size: 12px
              - padding: 0px 0px
          tap_action:
            action: call-service
            service: script.turn_on
            service_data:
              entity_id: script.livetv_xbox_360
          type: 'custom:button-card'
        conditions:
          - entity: input_select.harmonytvsource
            state: ABCDEFG
        type: conditional
      - card:
          color: var(--primary-text-color)
          color_type: icon
          icon: ''
          name: Media<br>Center
          size: 25%
          styles:
            card:
              - border-radius: 30px
              - height: 52px
            label:
              - color: gray
              - font-size: 9px
              - justify-self: start
              - padding: 0px 5px
            name:
              - font-weight: bold
              - font-size: 12px
              - padding: 0px 0px
          tap_action:
            action: call-service
            service: script.turn_on
            service_data:
              entity_id: script.mediacenter_xbox_360
          type: 'custom:button-card'
        conditions:
          - entity: input_select.harmonytvsource
            state: ABCDEFG
        type: conditional
    type: horizontal-stack
type: vertical-stack

Also why does Lovelace mess with the placement of the types and like above moves the vertical-stack and horizontal-stack and conditional to the bottom like it does.

1 Like

You should look at this plugin :

I think it is very near of what you’re looking for.

About yaml reordering, it’s a side effect of the Ui editor which apply an alphabetical order.
Seeing your work you should better switch to the yaml mode(in your configuration.yaml)
It would allow you to split your code in multiple card files and then include them in your view/super card.
Search in doc for yaml mode.

Watchout to save all your lovelace yaml code and create the ui-lovelace.yaml BEFORE you switch or you would risk to loose a lot of work if you cannot rollback.

2 Likes