malosaa / surveillance-card Goto Github PK

Custom component for lovelace to be used as a panel for viewing security cameras. It shows all of the cameras on the left, and shows a big one with motion on the right.

Note: When including this file in your ui-lovelace.yaml you must use type: module

Each entry in the camera list takes the following options

Install surveillance-card by copying surveillance-card.js, record.svg, and snapshot.svg from this repo to <config directory>/www/surveillance-card/ on your Home Assistant instance.

Example:

mkdir <config directory>/www/surveillance-card/
cd <config directory>/www/surveillance-card/

wget https://raw.githubusercontent.com/custom-cards/surveillance-card/master/surveillance-card.js
wget https://raw.githubusercontent.com/custom-cards/surveillance-card/master/record.svg
wget https://raw.githubusercontent.com/custom-cards/surveillance-card/master/snapshot.svg

Link surveillance-card inside you ui-lovelace.yaml.

resources:
  - url: /local/surveillance-card.js?v=0
    type: module

Add as custom card of a panel view in your ui-lovelace.yaml using type: custom:surveillance-card

views:
  - title: Surveillance
    icon: mdi:cctv
    panel: true
    cards:
      - type: custom:surveillance-card
        thumb_interval: 15
        update_interval: 2
        recording_duration: 10
        show_capture_buttons: true
        cameras:
          - entity: camera.front_porch
            motion_entity: binary_sensor.front_porch_motion
          - entity: camera.back_yard
            motion_entity: binary_sensor.back_yard_motion
          - entity: camera.driveway

Clicking on the camera button will save a single snapshot from that camera.

Clicking the record button will grab as many images as it can (based on the update intervals) for the set recording_duration

Note: This functionality is not available in native app versions (iOS & Android) and depends on the browser/device's ability to download image files.

Thanks to all the people who have contributed!