Hi, i have the following custom button card that works well. but when i put the code inside of a custom field card inside another button card i get and error:
‘ButtonCardJSTemplateError: TypeError: Cannot read properties of undefined (reading ‘attributes’) in ‘return entity.attributes.is_volume_muted == true’’
any help will be appreciated.
this works
type: custom:button-card
entity: media_player.lgsoundbar
icon: mdi:volume-high
show_name: false
state:
- operator: template
value: '[[[ return entity.attributes.is_volume_muted == true ]]]'
icon: mdi:volume-off
tap_action:
action: call-service
service: script.mute_soundbar
styles:
card:
- width: 35px
- height: 45px
img_cell:
- width: 35px
- margin-right: '-5px'
icon:
- color: black
- width: 35px
- color: rgb(142,195,176)
- margin-left: '-5px'
this do not works
type: custom:button-card
show_icon: false
show_name: false
custom_fields:
livetv:
card:
type: custom:button-card
entity: switch.television_antena
icon: mdi:television
show_name: false
state:
- value: 'on'
icon: mdi:television-shimmer
tap_action:
action: toggle
styles:
card:
- background: none
icon:
- color: rgb(142,195,176)
backward:
card:
type: custom:button-card
entity: media_player.apple_tv_4k
icon: mdi:skip-previous
show_name: false
tap_action:
action: call-service
service: media_player.media_previous_track
data:
entity_id: media_player.apple_tv_4k
styles:
card:
- background: none
img_cell:
- width: 30px
icon:
- width: 30px
- color: rgb(142,195,176)
play_pause:
card:
type: custom:button-card
entity: media_player.apple_tv_4k
icon: mdi:play
state:
- value: paused
icon: mdi:play
- value: stopped
icon: mdi:play
- value: playing
icon: mdi:pause
show_name: false
tap_action:
action: call-service
service: media_player.media_play_pause
data:
entity_id: media_player.apple_tv_4k
styles:
card:
- background: none
img_cell:
- width: 88px
icon:
- width: 88px
- color: rgb(142,195,176)
fordward:
card:
type: custom:button-card
entity: media_player.apple_tv_4k
icon: mdi:skip-next
show_name: false
tap_action:
action: call-service
service: media_player.media_next_track
data:
entity_id: media_player.apple_tv_4k
styles:
card:
- background: none
img_cell:
- width: 30px
icon:
- width: 30px
- color: rgb(142,195,176)
soundbar:
card:
type: custom:button-card
entity: media_player.lgsoundbar
icon: mdi:speaker-multiple
show_name: false
tap_action:
action: more-info
styles:
card:
- background: none
icon:
- color: rgb(142,195,176)
mute:
card:
type: custom:button-card
entity: media_player.lgsoundbar
icon: mdi:volume-high
show_name: false
state:
- operator: template
value: '[[[ return entity.attributes.is_volume_muted == true ]]]'
icon: mdi:volume-off
tap_action:
action: call-service
service: script.mute_soundbar
styles:
card:
- width: 35px
- height: 45px
img_cell:
- width: 35px
- margin-right: '-5px'
icon:
- color: black
- width: 35px
- color: rgb(142,195,176)
- margin-left: '-5px'
slider:
card:
type: custom:my-slider-v2
entity: media_player.lgsoundbar
mode: volume
step: '1'
styles:
container:
- overflow: visible
card:
- height: 45px
- width: 100%
- background: >-
linear-gradient(90deg, rgba(188,234,213,1) 0%, rgba(142,195,176,1)
100%)
track:
- overflow: visible
- background: none
progress:
- background: none
thumb:
- background: white
- top: 4px
- right: '-18px'
- height: 36px
- width: 36px
- border-radius: 100px
styles:
grid:
- grid-template-areas: >-
". livetv backward play_pause fordward soundbar." "mute slider slider
slider slider slider slider"
- grid-template-rows: 1fr min-content
- grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr
card:
- padding: 0 20px 20px 20px
- background: '#f4f6fb'
- margin-top: '-10px'
- border-radius: 0px 0px 20px 20px