As I continue to migrate my Floorplans to Lovelace I can’t seem to figure out how to make a single binary_sensor (door) have a special color if it was the last door used.
Ideally I would like to make it just background light green, so the default blue/yellow still shows as the sensor may still trigger for it.
Thank you in advance!
Old Floorplan
New Lovelace
UPDATE: What I have figured out is that I can “some what” acheive my goal by using
1 image for the back door shape to give me the default blue/yellow.
- type: image
entity: binary_sensor.back_gds_58
tap_action: none
state_image:
"on": /local/lovelace_ui/door90_on.png
"off": /local/lovelace_ui/door90_off.png
state_filter:
"off": grayscale(72%)
style:
left: 69%
top: 50%
width: 9%
A 2nd image to provide an indicator to mark the last door that had activity. This image is tied to a template where I calculate that last active door. Thus the state_filter is for the specific icon at the specific location.
- type: image
entity: sensor.template_last_door_open
tap_action: more-info
image: /local/feet_dark.svg
filter: opacity(1%)
state_filter:
"Back GDS": opacity(50%)
style:
left: 69%
top: 50%
width: 9%
The sucks part is I’ll have to make the same image for each door and only define its state_filter to show the image when the given door is set. Not ideal but it works.
I’m just trying to figure out how to color the svg image orange.
What about using a sensor with 3 states: on, off, last?
- type: image
entity: sensor.back_gds_58
tap_action: none
state_image:
"on": /local/lovelace_ui/door90_on.png
"off": /local/lovelace_ui/door90_off.png
"last": /local/feet_dark.svg
state_filter:
"off": grayscale(72%)
"last": opacity(50%)
style:
left: 69%
top: 50%
width: 9%
That’s an interesting idea, can you please explain a bit more on how I achieve that?
More background: The sensor is a z-wave door/window. So naively it only does on/off to my knowledge. I’m not sure how I would go about injecting that 3rd state into it. And what problems that would have for hassio tracking the state of the z-wave device.
I guess I could make a template variables for each door/window sensor I wish to track but then I’m just moving the work from the LovLace.yaml to my templates.yaml and not gaining much in maintainability.
Basically what you guessed, I was hoping you can replace the binary_sensor with a template sensor.
I didn’t know those are z-wave devices, and don’t know how they work in HA.
I saw both sensor and binary_sensor for z-wave component, can you select/configure the type of sensor for each device?
If not, then your are right, it just shifting working.
Try use hue-rotate and saturate to set the color on the svg file.
- entity: binary_sensor.coolcam_door_front_sensor
filter: hue-rotate(50deg)
image: /local/pixcel2.svg
state_filter:
idle: brightness(80%) hue-rotate(360deg) saturate(100.0)
'off': brightness(90%) hue-rotate(360deg) saturate(100.0)
'on': brightness(70%) hue-rotate(295deg) saturate(100.0)
style:
left: 84%
top: 71%
width: 10%
type: image