Dashboard
After completing the setup, open the dashboard in your browser:
http://<raspberry-pi-ip>:3000
If you're connected to the Pi's Access Point, you can use any of these:
| URL | Note |
|---|---|
http://dashboard.cam | Custom hostname, redirected via captive portal (no port needed) |
http://192.168.4.1:3000 | Direct IP access |
http://dashboard.cam:3000 | Custom hostname with explicit port |
http://dashboard.cam (without port) works because the captive portal redirects port 80 to 3000. This is the easiest to remember but may be slightly slower due to the redirect.
The frontend auto-detects the backend and MediaMTX URLs from the hostname you're visiting. No .env configuration is needed on the Pi. Only set PUBLIC_BACKEND_URL and PUBLIC_MEDIAMTX_URL in server/.env if you're running the frontend dev server on a separate machine.
The dashboard is organized into five pages.
Home
The main page shows everything at a glance.
Camera & controls
- Live Feed - real-time camera view via WebRTC, with manual recording controls (start/stop) and a snapshot button to save a still frame as JPEG
Status indicators
- Backend Status - online/offline indicator for the Flask backend, polled every 10 seconds
- Sensor Status - current sensor type, state (Armed / Triggered / Suppressed / Disabled), and GPIO pin. See sensor states for what each means
- Connection Status - how many tracked Bluetooth and WiFi devices are online
- System Health - CPU temperature, load, RAM usage, storage, uptime, and throttle status. When metrics cross warning or critical thresholds, a toast notification appears and an alert dot shows on the Dashboard nav icon. For detailed system stats with history charts and SD card info, see the Stats page
Activity & history
- Activity Timeline - last 7 days of events: sensor triggers, recording events, stream disconnects. Rapid sensor pulses within 5 minutes are collapsed into a single entry with a count
- Access Log - last 72 hours of device arrivals and departures
- Health Tracker - 72-hour system health chart (48 time slots, colour-coded ok/warn/critical)
- Event Heatmap - ~6-month activity heatmap showing event intensity by day of week. Colour reflects the overall character of the day (see heatmap colour coding below)
First run
- Setup Checklist - first-run onboarding guide (add devices, enable sensor). Dismissible once complete
Heatmap colour coding
Each cell in the heatmap represents one day. The colour is determined by a weighted average of all events that day - not the single worst event. This means a handful of warnings among many normal events won't turn the whole day orange.
Severity weights: each event type has a numeric weight based on its severity. The day's colour comes from the average weight across all events:
| Weight | Severity | Colour | Events |
|---|---|---|---|
| 1 | OK | Green | Device arrived/left, sensor triggered/released/armed/disarmed, recording stopped, stream reconnected, system boot |
| 3 | Warning | Amber | Recording started, motion detected |
| 10 | Critical | Red | Stream disconnected, unauthorized access |
Colour thresholds - the weighted average maps to a colour:
| Average | Result | Meaning |
|---|---|---|
| < 1.5 | Green | Mostly normal activity |
| 1.5 – 5.0 | Amber | Notable proportion of warnings or some critical events |
| ≥ 5.0 | Red | Heavily concerning - many warnings or critical events |
Within each colour, opacity scales with event count relative to the busiest day - so a quiet green day looks faint while a busy green day looks solid.
Examples:
- 50 normal events + 2 warnings → average 1.08 → green (warnings barely move the needle)
- 10 normal events + 5 warnings → average 1.67 → amber (a third of the day was warnings)
- Any day dominated by critical events → red
Archive
Browse and manage recorded videos.
Browsing
- Videos (H.264 MP4) are displayed in a grid, grouped by date, and can be filtered by time range or sorted. In list view, clicking the thumbnail or filename opens the same player modal
- Thumbnail cards - video cards show a JPEG thumbnail captured from the live feed the moment recording starts. No
<video>element is loaded in the grid, so thumbnails display reliably on every browser and device (including iOS Safari). Cards show a centered play button that fades in on hover - Hover scrub - hover over a video card in grid view to scrub through the recording. A sprite sheet of 10 evenly-spaced frames is generated automatically when recording stops. Move the mouse left/right to preview different moments
- New recording badges - the Archive nav icon shows a red badge with the count of recordings created since your last visit. Inside the archive, new recordings are highlighted with a "NEW" label. The badge clears automatically when you open the archive page
Player
- Click to play - clicking a video card opens a full-screen modal player with custom controls. The player includes a seek bar, time display, volume toggle, fullscreen, and download
- Keyboard shortcuts - left/right to seek 10 seconds, up/down for volume, Space or K to play/pause, F for fullscreen, M to mute
- Playback speed - speed selector (0.5x, 1x, 2x, 4x, 8x) for reviewing long recordings quickly. Speed resets to 1x when navigating to a different video
- Previous/next navigation - arrow buttons on the sides of the player let you step through filtered recordings without closing the modal. A counter shows your position (e.g. "3 / 12")
Managing recordings
- Download or delete individual recordings from the card footer (grid view) or the row actions (list view)
- Snapshots - still frames captured from the live feed via the snapshot button appear in a collapsible section at the top of the archive. Each snapshot shows a thumbnail with the capture time, and can be downloaded or deleted individually
- Timelapse - daily timelapse videos appear in their own collapsible section. Each video compresses a full day into a short clip. Enable timelapse capture in Settings > Storage to start generating them automatically
Settings
Configure the system without touching config files. The settings page has a sidebar with six sections: Appearance, Camera, Storage, Devices, Recording Sensors, and System. See the Settings page guide for full details on each section.
System
Comprehensive system monitoring page. Shows everything from the Dashboard health widget in an expanded layout, plus:
- Sparkline history - rolling charts for CPU, temperature, and RAM with gradient area fills
- Per-core CPU bars and 1/5/15 min load averages
- Throttle breakdown - active and past flags with process count and system details
- Network I/O - bytes and packets sent/received since boot
- SD card details - full card metadata including serial, firmware revision, bytes written, life estimate
- Camera info - current stream resolution and framerate
- Recording stats - total recordings, timelapse frame count, live REC indicator
- Connectivity - tracked Bluetooth/WiFi device counts, sensor status
- Platform info - OS version, Python version, architecture
Data refreshes every 10 seconds. Cards glow and show animated border sweeps when metrics cross warning/critical thresholds. See the System page guide for full details.
Logs
View system logs directly from the dashboard without needing SSH access. For common log patterns and debugging tips, see Troubleshooting. The logs page has three tabs:
-
API Logs - shows parsed entries from the Flask backend log (
security-cam.log), including rotated backups. Each entry shows timestamp, log level, source module, and message. Features:- Filter by level (Error, Warning, Info, Debug)
- Filter by category (e.g.
bt.pairfor Bluetooth,sensor.mgrfor sensors,streamfor recording) via a dropdown that lists all source modules found in the current logs - Full-text search across all log fields
- Auto-refresh every 5 seconds (toggleable)
- Paginated display with "show more" for large logs
- Download the current view as a text file
-
MediaMTX - shows parsed entries from the MediaMTX RTSP/WebRTC server log. Same filtering, search, category dropdown, and auto-refresh features as API logs. Useful for diagnosing stream issues.
-
Script Logs - browse log files from all setup and maintenance scripts, grouped by category:
- Install -
install_requirements.shandinstall_mediamtx.shoutput - Update - auto-update (
update.sh) output - AP Setup - WiFi Access Point setup (
setup_ap.sh) output - Bluetooth Pairing - Bluetooth pairing (
pair_bluetooth.sh) output
Select a file from the sidebar to view its full output. New log directories are discovered automatically.
- Install -
How auto-recording works
When a trigger sensor is enabled, it gates recording based on device presence - recording only starts if no tracked device is nearby. See how it works in the sensors guide for the full flow. Manual recording is always allowed regardless of sensor state or presence.