denver
May 6, 2021, 6:47pm
5498
Ive had this working ok until resent update and now I cant work out what’s going wrong.
The button suppose to change picture depending if its on or off:
type: 'custom:button-card'
show_entity_picture: true
tap_action:
action: none
size: 100%
styles:
card:
- border-radius: 15px
- width: 100px
- height: 100px
- box-shadow: 0px 0px 5px 0px var(--button-card-light-color)
entity_picture: >
[[[
if (states['binary_sensor.pet_immy'] = 'on')
return '/local/immy_in.jpg';
else
return '/local/immy_out.jpg';
]]]
The entity displays off or on when I check in Developer Tools but the card won’t update.
pedolsky
May 6, 2021, 7:27pm
5499
I‘m not a coding hero, but using
(states['binary_sensor.xyz'].state == 'on')
always is working.
denver
May 6, 2021, 8:30pm
5500
That worked, thank you, cant understand why its been working as I had it for the last few months.
You don’t have an entity, that would update the card. You need to set an entity, at least to trigger the update of the card.
See here (especially the option triggers_update): GitHub - custom-cards/button-card: ❇️ Lovelace button-card for home assistant
denver
May 6, 2021, 8:42pm
5502
Ahr, ok Patrick thank you.
I’ve put together a nice functional fan card that works, but I cannot figure out how to have the three small buttons on the bottom row show a status. What I’ve been trying to do is; if speed 1 is selected, have only that button lit up, then if speed 2 is selected, only that button lit up, etc.
I’ve tried so many variations, but I cannot figure out how to get the state to show in the speed select buttons, I’m hoping someone will be able to help me out.
Here are the attributes for my fan from developer tools:
speed_list:
- 'off'
- low
- medium
- high
preset_modes: []
speed: high
percentage: 100
percentage_step: 1.0101010101010102
preset_mode: null
friendly_name: Living Room Fan
supported_features: 1
And here’s the code for the button:
type: vertical-stack
cards:
- card:
- height: 5px
- width: 30px
entity: fan.living_room
name: Living Room Fan
show_state: true
size: 35%
state:
- color: null
icon: 'mdi:fan-off'
value: 'off'
- color: green
icon: 'mdi:fan'
value: 'on'
styles: null
tap_action:
action: call-service
service: fan.toggle
service_data:
entity_id: fan.living_room
type: 'custom:button-card'
- type: horizontal-stack
cards:
- type: 'custom:button-card'
color_type: null
color: null
show_state: true
size: 30%
icon: 'mdi:fan-speed-1'
tap_action:
action: call-service
service: fan.set_percentage
service_data:
entity_id: fan.living_room
percentage: 25
- type: 'custom:button-card'
color_type: null
color: null
show_state: true
size: 30%
icon: 'mdi:fan-speed-2'
tap_action:
action: call-service
service: fan.set_percentage
service_data:
entity_id: fan.living_room
percentage: 50
- type: 'custom:button-card'
color_type: null
color: null
show_state: true
size: 30%
icon: 'mdi:fan-speed-3'
tap_action:
action: call-service
service: fan.set_percentage
service_data:
entity_id: fan.living_room
percentage: 100
And for funsies, what the card looks like:
2 Likes
pedolsky
May 8, 2021, 9:02am
5504
I don’t quite understand it yet. What is meant by ‘only one button lit up’? What should the other buttons look like? Greyed or so?
Or did you mean something like this:
styles:
icon:
- color: |
[[[
if (states['fan.living_room'].attributes.speed == 'low') return 'yellow'; return 'black';
]]]
2 Likes
jimz011
May 8, 2021, 8:55pm
5505
After a while I’m back for some questions.
I want to change a color of an attribute by referring to the last_changed attribute. It seems very tedious to do since the usual output is really awfull. Since button-card already has the output I want I wondered if I can re-use this.
So what I want to do is something like, if last_changed > 5 minutes return green else red, but I can’t seem to find how to do this without creating a custom sensor. Does anyone know?
ChenH
May 9, 2021, 1:03pm
5506
Hey there folks,
Is there a way to set the box-shadow in sync color as the yeelight bulb?
ChenH
May 9, 2021, 1:17pm
5507
SOLVED:
- box-shadow: 0px 0px 5px 0px var(--button-card-light-color)
Hey guys, any idea what is wrong with my syntax here:
state:
- color: >
[[[
if (sensor.shellyem_5e26f6_channel_1_power > -500 && sensor.shellyem_5e26f6_channel_1_power < 0) return 'orange';
if (sensor.shellyem_5e26f6_channel_1_power < -500) return 'green';
else return 'red';
]]]
Nothing is happening when my values are in those ranges.
pedolsky
May 9, 2021, 7:58pm
5509
Try
states['sensor.shellyem_5e26f6_channel_1_power'].state
instead of
sensor.shellyem_5e26f6_channel_1_power
P.S.: If you are using sensor.shellyem_5e26f6_channel_1_power as entity in your button, you can replace it in the template with entity.state . I cannot explain it better, so have a look at my card:
type: 'custom:button-card'
template:
- button_sensor_warnung
entity: sensor.bewegungsmelder_flur
styles:
card:
- background-color: |
[[[
if (entity.state < 27) return 'rgba(0,179,0,0.9)';
if (entity.state >= 27 && entity.state <= 34) return 'rgba(255,166,64,0.9)';
else return 'rgb(219,23,9,0.9)';
]]]
Hmm tried both states[‘sensor.shellyem_5e26f6_channel_1_power’].state and entity.state and no joy, color doesn’t change.
color: auto
color_type: card
entity: sensor.shellyem_5e26f6_channel_1_power
name: Current Energy
show_label: false
show_icon: false
custom_fields:
notification: |
[[[ return states['sensor.shellyem_5e26f6_channel_1_power'].state ]]]
state:
- color: >
[[[
if (states['sensor.shellyem_5e26f6_channel_1_power'].state >= 1000) return 'orange';
else return 'red';
]]]
styles:
card:
- height: 45px
- width: 232px
name:
- position: absolute
- left: 3%
- top: 5%
custom_fields:
notification:
- position: absolute
- left: 63%
- top: 5%
grid:
- position: relative
type: 'custom:button-card'
pedolsky
May 9, 2021, 8:31pm
5511
Put it in the styles: section.
Yup that did the trick, thanks
poudenes
May 10, 2021, 6:42am
5513
Hi Guys,
Im still having issues to let this work:sensor entity
type: 'custom:button-card'
template: buttons-test
entity: sensor.holiday
show_state: true
show_name: true
state:
- value: |
[[[
if (states['sensor.holiday'].state == 'Nothing') return 'on';
else return 'off';
]]]
spin: true
color: 'rgba(3,157,252,1)'
styles:
state: 'on'
card:
- box-shadow: '0px 0px 2px 2px rgba(3, 157, 252,1)'
- operator: default
spin: false
color: 'rgba(150,150,150,1)'
button_card_templates:
buttons-test:
show_icon: true
size: 15%
tap_action:
action: toggle
styles:
card:
- font-size: 14px
- height: 80px
try:
state: &spin # anchor to reuse elsewhere below in this file ;-)
- operator: template
id: state-on #needed if you want to merge states in your template and the button config
value: >
[[[ return entity.state == 'on'; ]]]
spin: true
btw, you seem to test for state == ‘on’ twice, once for the spin, and once below that in the styles.
styles:
state: 'on'
card:
You should take that out, since it all is below the template value ‘on’ in this case.
poudenes
May 10, 2021, 7:17am
5515
First part in template and second part take out the card part?
type: 'custom:button-card'
template: buttons-test
entity: sensor.holiday
show_state: true
show_name: true
state:
- value: |
[[[
if (states["sensor.holiday"].state == "Nothing") return "on";
else return "off";
]]]
spin: true
color: 'rgba(3,157,252,1)'
- operator: default
spin: false
color: 'rgba(150,150,150,1)'
button_card_templates:
buttons-test:
show_icon: true
size: 15%
tap_action:
action: toggle
styles:
card:
- font-size: 14px
- height: 80px
state:
- operator: template
id: state-on
value: |
[[[ return entity.state == 'on'; ]]]
spin: true
-wait, didnt spot your second line, rereading now
but first: what does this do:
- value: |
[[[
if (states["sensor.holiday"].state == "Nothing") return "on";
else return "off";
]]]
poudenes
May 10, 2021, 7:30am
5518
- value: |
[[[
if (states['sensor.holiday'].state == 'Nothing') return 'on';
else return 'off';
]]]
The sensor.holiday have state: Nothing
For now I try if sensor is Nothing than the value must be ‘on’
the - value: can’t work with Nothing right?
