How To: Camera Privacy mode on dashboard

Configuration Frontend
1

I’ve been wanting to be able to blur camera feeds via a simple toggle so that I can hide them when displaying a dashboard with others at home, sharing online, etc. Some cameras have a privacy mode, some don’t… CSS was also suggested along with card-mod but I still struggle with that. Today I ran into a super simple solution that is baked into the picture-glance card that I use to display my feeds. I want to share with everyone as I did not find a “How to” and assume many others want this.

This is my main dashboard. All the cameras are in privacy mode (that you can configure as you prefer).

image
image1920×1083 109 KB

This is an example of the dashboard with two of my cameras with privacy mode turned off:

image
image1920×1076 126 KB

Create a Toggle Helper (input_boolean) to use as the switch controlling privacy mode. You can create one per camera or one to use on all cameras. I created one per camera and will create a group to control them all at once. Of course you can use any other on/off, like your room light or whatever.

The YAML for the picture-glance card displaying my Driveway East camera feed is:

type: picture-glance
title: Driveway - East
entities:
  - entity: input_boolean.driveway_east_camera_privacy
camera_image: camera.driveway_east_camera
aspect_ratio: '16:9'
camera_view: live
state_filter:
  'on': brightness(40%) blur(10px) saturate(0.0)
  'off': brightness(100%)
entity: input_boolean.driveway_east_camera_privacy

The privacy toggle is input_boolean.driveway_east_camera_privacy.

Adding the toggle under the entities: section adds the toggle on the picture-glance card and is optional in case you want to hide the toggle so users can’t control it.

Everything from state_filer: down is what controls what happens when the toggle is on or off and which toggle controls it.

The on/off configuration is CSS but easy to implement. The HA documentation pointed me here:

My privacy mode lowers brightness, makes the image grayscale and blurs it. You can change that however you wish… The off has brightness(100%) but I am guessing it is not necessary. I left it there from the example as a placeholder (did not really do any tests with/without).

This is where I started:

Warning: All my camera feeds except the doorbell, are 4K and while editing the YAML, Home Assistant became completely unresponsive multiple times. I am not sure whether it crashed, but it was completely frozen causing me to lose my edits. I noticed that the webRTC addon went from < 10% CPU to nearly maxing it out so I just turned the addon OFF while editing, and then back on. I’ve had the webRTC addon hog all CPU and crash on many occasions… which I am guessing is likely due to all my cameras being 8MP / 4K and possibly some bug. @allenporter - Is this a bug, or to be expected with me having multiple 4K feeds in webRTC?

Edit: I just discovered a side effect of adding the privacy toggle under state_filter: which is that by clicking on the image it no longer opens a full view of the feed but rather the history of the privacy toggle I just added. Will look for a solution… hopefully this issue doesn’t eliminate this option.

1 Like
2

This is a beautiful solution, thank you for posting! And your dashboard is VERY nice too. Do you host your config for others to plagiarize? :wink: Thanks again, either way.

1 Like
3

@terryhonn - Thank you. I was planning on sharing the dashboard in bits otherwise it would be difficult to document. Also, I am still new at this so I am trying to optimize things before sharing my messy code :slight_smile:

As for the privacy mode, there is an issue. See the EDIT at the bottom of the first post. I have found a temporary way around it but I do NOT like it. I am unsure whether the issue is “as intended by design” or a bug. To me it is the latter…

I had to add a link to the camera as an icon and now you must click on that to view it. If you click on the image, as it was possible before, you toggle the privacy mode or you get mode-info screen (this is all I got during my tests to fix the issue). I’d like to have to click on the eye icon to toggle the mode and be able to click the image to open the camera.

Any chance you know how to achieve this? I tried all combinations I could find with tap_action: but could not find one that would open the camera view window.

type: picture-glance
title: Driveway - East
entities:
  - entity: input_boolean.driveway_east_camera_privacy
  - entity: camera.driveway_east_camera
camera_image: camera.driveway_east_camera
aspect_ratio: '16:9'
camera_view: live
state_filter:
  'on': brightness(40%) blur(10px) saturate(0.0)
  'off': brightness(100%)
entity: input_boolean.driveway_east_camera_privacy
4

Hi,
I’m not familiar with all the supported cameras for RTSPtoWeb – i just created the add-on to run the server in home assistant, but don’t know all the low level details. This may be a good question for that project.

5

@allenporter More than support for cameras, I was wondering whether RTSPWeb can handle multiple 8MP / 4K resolution cameras. Mine work but on occasion the addon starts sucking up all CPU and restarting it is the only way to stop it.

6

Sure but the main point is “i just created the add-on to run the server in home assistant… This may be a good question for that project.” right?