Hi !
I have a picture-elements based dashboard, that uses the states of my philips hue lights to render a floorplan of my place.
Currently, each light is an independant card, with my setup looking like that :
- type: custom:config-template-card
entities:
- light.chambre
element:
type: image
image: /local/ui/floorplan/lights/chambre.png
action: none
entity: light.chambre
tap_action:
action: none
hold_action:
action: none
style:
height: 100%
left: 61.3%
top: 55%
width: 72%
mix-blend-mode: lighten
filter: >-
${ "hue-rotate(" + (states['light.chambre'].attributes.hs_color
? states['light.chambre'].attributes.hs_color[0] : 0) + "deg)"}
opacity: "${states['light.chambre'].state === 'on' ? (states['light.chambre'].attributes.brightness / 255) : '0'}"
- type: custom:config-template-card
entities:
- light.chevet
element:
type: image
image: /local/ui/floorplan/lights/lampe_globe.png
action: none
entity: light.chevet
tap_action:
action: none
hold_action:
action: none
style:
height: 100%
left: 61.3%
top: 55%
width: 72%
mix-blend-mode: lighten
filter: >-
${ "hue-rotate(" + (states['light.chevet'].attributes.hs_color
? states['light.chevet'].attributes.hs_color[0] : 0) + "deg)"}
opacity: "${states['light.chevet'].state === 'on' ? (states['light.chevet'].attributes.brightness / 255) : '0'}"
As you can see, with only 2 lights shown here, it’s quite redondant when most what’s inside of the “custom:config-template-card” is the same, except for the entity, the image directory, and the filter/opacity style.
I was wondering if there was a way to make a template to make my ui-lovelace.yaml less cluttered and redundant ?
Thank you for your help !