Hello, is there a way to use button without entity? For example I’d like to change the on/off state based on if some variable is present in some collection e.g. if some group contains given entity display button as ON otherwise as OFF.
I had to do something similar with mg smoke detection. Icreated a template sensor that had the information i wanted and used that as the entity. It had the added benefit of setting the info I wanted to trigger on as the entity state so it made manipulating the button based on result easy.
can you share the yaml for this card? I’m also playing with covers. thx
something like this:
- name: All Lights
template: standard-button
type: 'custom:button-card'
aspect_ratio: 1/1.1
icon: 'mdi:power'
tap_action:
Hello
Is there easy way to change a value of state?
For example I would like to replace unavailable with N/A.
There is state option which is able to compare current state to given value and then affect almost everything but displayed state value. Or I’m blind.
So for example this setting:
state:
- operator: '=='
value: unavailable
styles:
state:
- color: red
icon:
- color: red
Gives me expected result:
@maxym, if I recall you need to use script for the label property to check the state value and return either the normal value or your substitute value. Something like this:
label: '[[[ return entity.state === "unavailable" ? "N/A" : entity.state ]]]'
I haven’t tested that, so it might not work or might not be what you were looking for. It has been a while since I’ve done any work on my UI, so I’m a bit stale on my memory.
Thank you for the answer.
Probably it works, I have to check it out.
The difference is the label is located in different part of grid requiring separate styling.
In my case it will require some rework of the grid as well as button’s template since my buttons display state, ignoring label at all
Also problem with label is it requires to reference the entity object explicitly and I cannot use entity js object since I use embedded button cards
What about state_display?
@pedolsky, I forgot about that one…that looks like the place to do it.
@maxym, use that property in my example instead of label.
yep it can replace state value. But still unfortunately it manifests the same problem in case the card is embedded in another button card: you cannot use entity.state in js code. you have to reference entity by it’s name which is somehow limiting.
Anyway thank you guys for pointing me to some features I wasn’t aware. for sure state_display is a bit better than a label for my usecase
I’m using nested button-cards, almost all of my custom_fields are button-cards, and this works with JS.
No it doesn’t. But maybe we both have different things in mind.
JS object entity always references to an entity assigned to most parent button card. So if you embed one card into another and call entity in js templates of embeded card, you will get entity of its parent.
See this issue: wrong entity in javascript template · Issue #389 · custom-cards/button-card · GitHub
The only way is to use template variables to pass current entity to templates of current (embeded) card
Yes, that’s unfortunately a fact, but you set you are using a template so it wouldn’t be a big problem to use variables, or am I on the wrong track? Maybe you want to post your whole code.
Yes of course I can workaround that this way. But it still workaround. It makes use of cards inconsistent (using entity vs variables.entity) adds need to handle unassigned entities (otherwise under some circumstances a GUI might break into pieces) etc
Currently I created FR for adding ability to manipulate displayed state from state template.
Hi, I’m trying to add a dishwasher as a custom button card and I have a few complications that I can’t solve.
1.) The dishwasher does not have the states that the program runs in the attributes, but they are like individual entities that have an on / off state. Unfortunately, this is not how it works.
program: |
[[[
if (states["switch.mycka_nadobi_program_auto1"].state = 'on') return "Auto";
if (states["switch.mycka_nadobi_program_eco50"].state = 'on') return "ECO";
]]]
2.) Remaining time. The time entity only displays the time it will complete in both date and time format (2022-01-03T15:35:43+00:00), if I add the entity itself as a tab, it will display the remaining time. How do I show the remaining time on my custom card?
Hi, I am trying to create a custom:button-card to display the state (time) from a " Date and/or Time" helper.
Changing an Entity Card to a Custom Button Card (type: entity to type: custom:button-card); the state value disappeared living only the Icon and Name visible.
Any suggestions to resolve my problem will be appreciated.
I wish to see only the military time (example 23:15). Also, I would like (tap_action or _hold_action) to be taken to additional info where I can change the time
As requested, here is my code:
“””
type: custom:button-card
entity: input_datetime.testing
state_color: false
icon: mdi:hours-24
“””
Hi 
type: custom:button-card
entity: switch.mycka_nadobi_power
styles:
grid:
- grid-template-areas: >-
"a a a" "i state_name state_wash" "b time_name time" "c progress_name
progress" "d program_name program"
- grid-template-rows: 40% 1fr 1fr 1fr 1fr 1fr 1fr
- grid-template-columns: 25% 40% 35%
card:
- background: url(/local/kiosk/mycka2.jpg)
- background-size: 100% 100%
- height: 250px
custom_fields:
state_name:
- justify-self: start
- font-weight: bold
state_wash:
- justify-self: start
time_name:
- justify-self: start
- font-weight: bold
time:
- justify-self: start
progress_name:
- justify-self: start
- font-weight: bold
progress:
- justify-self: start
program_name:
- justify-self: start
- font-weight: bold
program:
- justify-self: start
custom_fields:
state_name: Stav
state_wash: |
[[[
return `${(states['sensor.mycka_nadobi_operation_state'].state)}`
]]]
time_name: Čas
time: |
[[[
return `${(states['sensor.mycka_nadobi_remaining_program_time'].state)}`
]]]
progress_name: Dokončeno
progress: |
[[[
return `${(states['sensor.mycka_nadobi_program_progress'].state)}%`
]]]
program_name: Program
program: |
[[[
if (states["switch.mycka_nadobi_program_auto1"].state = 'on') return "Auto";
if (states["switch.mycka_nadobi_program_eco50"].state = 'on') return "ECO";
]]]
My entity input_datetime.wecker has a given name „Wecker“ and icon mdi:clock, so I must not define that in the custom:button-card:
type: custom:button-card
entity: input_datetime.wecker
color: grey ## <— icon won’t change its state color
show_state: true ## <— displays entity's state
tap_action:
action: more-info ## <— opens the dialogue window on tap
type: custom:button-card
entity: input_datetime.wecker
name: Morgenalarm ## <— overwrites the given name
icon: mdi:hours-24 ## <— overwrites given icon
color: grey
show_state: true
tap_action:
action: more-info
And finally this lets you insert code properly: 
