Something new that crossed my path today - all my Zwave devices entered into a “not available” state and every button-card tied to a Zwave entity simply stopped working. No visual indication that something was amiss appeared aside from the buttons simply not responding. Other Lovelace cards, for example slider-entity-row, actually showed an “Entity not available” error.
Is this something I simply need to configure with my buttons or does this functionality not yet exist?
I have set my buttons so that whenever it becomes unavailable the opacity will be high. You can do this in the states config of the button.
It will look something like:
state:
- value: "unavailable"
styles:
card:
- opacity: 0.2
- color: black
- --paper-item-icon-color: blackHaving been trying to do operations like that myself I was wondering the same…
Would seem the way forward for the button card, to be independent of all these other cards, and introduce a true style_template option. Please consider doing so?
Something like coloring the volume like this would be awesome:
icon_color: >
if (state === '0.0') return 'rgb(145,227,237)';
if (state <= '0.1') return 'rgb(105,212,231)';
if (state <= '0.2') return 'rgb(46,147,238)';
if (state <= '0.3') return 'rgb(0,220,16)';
if (state <= '0.4') return 'rgb(0,195,13)';
if (state <= '0.5') return 'rgb(250,255,0)';
if (state <= '0.6') return 'rgb(252,150,0)';
if (state <= '0.7') return 'rgb(218,53,0)';
if (state <= '0.8') return 'rgb(255,0,0)';
if (state <= '0.9') return 'rgb(154,0,0)';
if (state <= '1.0') return 'rgb(81,0,0)';
I know we could work around this using the operator: template, but it would require a line per state. Using a template like the above would shorten that enormously.
Especially if we could combine things in a style_template even further, like:
style_template: >
if (state > 0) return 'background-color: #f0c209;--tiles-icon-color:#555B65;--tiles-label-sec-color: #555B65;color: #555B65';
return 'background-color: #555B65;--tiles-icon-color:#f0c209;--tiles-label-sec-color: #f0c209;color: #f0c209;text-decoration: line-through';
maybe the latter already is possible, havent tried that tbh, but since I couldn’t find that in the documentation I suppose this shorthand notation isn’t available (yet…)?
Already complaining about speed and you want more templates? 
Both your use case are covered by the state object and operators. I don’t think I’ll add this just to reduce the number of YAML lines and make it even more unreadable.
hmm, if possible yes…
the last example I gave, wouldn’t introduce more calculation than we already do now, it only shortens the code 
Thats why I wondered if this would already be possible.
the first would read the state of an existing backend entity, and that wouldn’t hurt either.
Appreciated, and I understand your fear for readability. Otoh, consider a script entity, which is more difficult to ‘template’, and for which style templates like this are very nice to have:
entities:
- entity: script.lighting_opstaan
style_template: >
if (entities['input_select.activity_lighting'].state === 'Opstaan') return 'background-size: contain;background-color: #F0C209';
return 'background-size: contain; background-color: #555B65;filter:grayscale(75%)';
image: /local/activities/opstaan.png
when using CSS, things get a bit more complex than the average yaml file, but when getting used to that, it might not be as unreadable after all.
The verbose way of writing, like used now in the button options, is really very clear. It is a bit inflexible also. Using the style_template would combine both positive aspects, imho.
Very appreciative for all the goodies you gave us already. So not complaining at all…
update
btw, and not 100% sure about this yet, but it seems the systems are suddenly much more responsive. Only thing I could notice was an updated Hassio Supervisor. Could this be the case? It’s now on 165, but not really sure for how long that has been the case.
hoping that next to entity_picture_template, an icon_template would be possible?
icon: >
if (state === '0') return 'mdi:account-off';
if (state === '1') return 'mdi:account';
if (state === '2') return 'mdi:account-multiple';
if (state === '3') return 'mdi:account-multiple-check';
return 'mdi:account-group';
On my tablet, I get an error “Custom element doesn’t exist: Button-card”. I’ve cleared the cache and reloaded the page. What am I missing? The buttons show up on my PC, though they are not actionable.
type: horizontal-stack
cards:
- type: 'custom:button-card'
color_type: blank-card
- type: 'custom:button-card'
color_type: blank-card
- type: 'custom:button-card'
color_type: card
color: 'rgb(255, 50, 0)'
icon: 'mdi:garage-open'
action: service
show_state: true
service:
domain: cover
action: open_cover
data:
entity_id: cover.garage_cover
- type: 'custom:button-card'
color_type: card
color: 'rgb(0, 255, 0)'
icon: 'mdi:garage'
action: service
service:
domain: cover
action: close_cover
data:
entity_id: cover.garage_cover
- type: 'custom:button-card'
color_type: blank-card
- type: 'custom:button-card'
color_type: blank-cardVerify the path in your resources: entry to ensure it is accurate?
It loads on my PC, though the buttons don’t do anything actionable.
I think the action is call-service not service
My actions all work
Well, the one thing that stands out to me is that there is no tap_action defined in your button. As per the github page
- type: "custom:button-card"
color_type: card
color: rgb(223, 255, 97)
icon: mdi:volume-plus
tap_action:
action: call-service
service: media_player.volume_up
service_data:
entity_id: media_player.livimg_room_speaker
yeah that too lol.
Awesome - thank you two. They show up as actionable tiles now, but the service call isn’t working. I’ll work on that now. However, it still doesn’t load right on my Fire Tablet. Apparently, it’s not using the Chrome engine for Fully Kiosk, and the built-in web renderer doesn’t support custom components. I’ll have to keep digging for a solution.
I know one or two people asked on here, so here’s a link to my Home Assistant config thread, with my Lovelace configuration that makes heavy use of the button card (plus plenty of screenshots on my GitHub repo):
I like the orgainization of the yaml file - but I presume that the UI editor doesn’t support the includes? I’m not that well versed at writing yaml, but I’m getting better. Very well done, @apop!
So - I changed the entity from the cover to calling a script. That works fine now. My next question is - can I pull the state of the cover to set the color of the button?
Another question - can I define a button that jumps to another view?
NEW FEATURES
--button-card-light-color-no-temperature equivalent to --button-card-light-color but without the color temperature applied.unlock_users: A list of usernames allowed to unlock the button when lock: true. If undefined, everyone is allowed. (Fixes #167)- type: custom:button-card
entity: switch.super_secure_switch
lock: true
unlock_users:
- user1
- user2
timer entities. In the state, it will now display the time remaining while running or paused and idle while being idle. (Fixes #156)FIXES
name_template and entity_picture_template where not updating the button on state changeThis is interesting. there are plenty of discussions about timers and accessing the time remaining (e.g. Display remaining seconds of timer in frontend - #15 by klogg - but only if you’re interested…)
Can I ask a very specific question? Does this display the time remaining for a timer even if the timer is started while it is still running i.e. it resets back to the initial duration and then starts counting down again?
I don’t really understand that question, specifically this part “time remaining for a timer even if the timer is started while it is still running”
However, timers are kind of special entities, the time remaining is only processed in the frontend, not on the backend. The time remaining is based on the difference between now and the last time the entity was updated. The frontend is updated every second if the timer is running.
I’m not sure this answers your question, but if you clarify your question, I might be able give you a better answer 