Actually, I think my case is even more complex than just wanting templated *_action.
I am using buttons to display motion, door and window sensors. I sometimes have door and window sensors in the wrong state (cheap sensors!) so I use a double tap to open a custom-popup-card which allows me to set that sensor’s state via an input_select.
I combined all these buttons to use one template but the motion sensors don’t need a dbltap_action.
I have also realised that motion, door, and window sensors also have different icons (of course!) so would need to template those as well which I don’t think is possible either???
Here is my template after combining Door and Window and before realising the icons were wrong!
EDIT: Also, yes I have still got to template my label properly…
Why not just declare a generic template for your generic settings and declare specific templates for windows or doors that inherit your generic template and set your actions?
Something like this:
generic_sensors:
name_template: >
var sensor_name = entity.attributes.friendly_name;
if (sensor_name.split(' ')[sensor_name.split(' ').length - 1] === 'Door') {
var sensor_name = sensor_name.replace(' Door', '');
return sensor_name;
} else {
var sensor_name = sensor_name.replace(' Window', '');
var sensor_name = sensor_name.replace('Left', '(L)');
var sensor_name = sensor_name.replace('Centre', '(C)');
var sensor_name = sensor_name.replace('Right', '(R)');
return sensor_name;
}
show_label: true
label_template: >
return entity.state === 'on' ? '-MOVEMENT-' : '' ## Maybe this has to be specific for motion only, if so move it in the motion one
layout: icon_label
aspect_ratio: 2.5/1
size: 50%
styles:
# card:
# - width: 110px
name:
- font-size: 12px
label:
- font-size: 12px
- font-weight: bold
- color: var(--secondary-text-color)
- justify-self: start
state:
- value: "on"
id: sensor_on
styles:
card:
- box-shadow: 0px 0px 8px 2px var(--secondary-text-color)
icon:
- color: var(--secondary-text-color)
tap_action:
action: none
hold_action:
action: none
window_sensors:
template: generic_sensors
dbltap_action:
action: more-info
state:
- id: sensor_on
icon: mdi:window-open
- value: "off"
icon: mdi:window-closed
door_sensors:
template: generic_sensors
dbltap_action:
action: more-info
state:
- id: sensor_on
icon: mdi:door-open
- value: "off"
icon: mdi:door-closed
motion_sensors:
template: generic_sensors
state:
- id: sensor_on
icon: mdi:run
- value: "off"
icon: mdi:human-handsdown
And then use the appropriate template in each type of sensor you want to display:
motion_sensors
windows_sensors
door_sensors
The trick here is that you can inherit template from a template and overload/add anything.
It’s a small card that helps you declutter your Lovelace config by using templates for block of cards or a simple card. Changing the template will change it everywhere where its used.
This will be helpful for those of you who embed many cards in a vertical-stack-in-card for example with only small differences like the entity.
You can only define one template, not multiple.
You have to think of templates as a chain. You start from your button-card config and you go all the way up to the last template defined. The chain can be as long as you want.
So what you want to achieve is possible but it has to be done like this:
main_template:
[all your common config here]
ikea_label:
template: main_template # this will inherit the things from main_template
label_template: >
function capitalizeFirstLetter(string) {
return string.charAt(0).toUpperCase() + string.slice(1).toLowerCase();
}
var id = entity.entity_id.split('.')[1].slice(11);
return capitalizeFirstLetter(id);
switch_label:
template: main_template # this will inherit the things from main_template
label_template: >
var id = entity.entity_id.split('.')[1].slice(3, -9);
return states['sensor.' + id + '_actueel'].state + ' Watt';
And then you use only: switch_label or ikea_label for your buttons
ok thanks. Will test. cool.
A bit complex it is though, and error prone.
wouldn’t you consider easing up on that, and adding the option for more than 1 template? seems the obvious way to unclutter (pun intended).
A bit like anchors really.
I, too, am looking forward to your post. I’ve spent the last several hours attempting to replicate your awesome layout and cannot coax layout-card to behave properly. Enjoy your trip!
I’ve got this set up and kinda working but I’m also suspecting im doing something wrong.
Pretty much everything i configure works. But I cant seem to get “state” to change color or icon of the entity inside the custom button card.
Im doing my editing inside the “RAW config editor” within the lovelace UI, is this somehow wrong?
Also, do i need anything else to get this to work? Custom UI maybe?
we already discussed the option for the name field, which as you can see would really be a good thing:
I was wondering if it could somehow be automized. In the label_template we can add + + to the output, and have it display the second line always.
But depending on the width of the button, it would not have to be always breaking the line:
Would be cool if that could be done.
the buttons above show something else: the left padding isn’t always correct, and it depends on the cropping if the button. As you can see that only happens with the name field. State,label and icon are always correct.
this show very nice, but unfortunately takes out the 3d effect of the button (ie the shadow at the bottom and right side (and to a lesser extent the left side?))
can I bring that back with yet another css option?
I’ve tried it with:
hello you would be kind to publish the code of the fan that turns, I succeeded in part that is I can not bring the text to the right and the fan on the left all remains in the center and overlapped …
