# likhith-manchala/drowse-guard architecture

> Architecture diagram of the GitHub repository likhith-manchala/drowse-guard, generated by GitDiagram from its file tree, README and a sample of source files (last updated 2026-11-10). It is an AI-made overview: check details against the source.

- Interactive diagram: https://gitdiagram.com/likhith-manchala/drowse-guard
- Repository: https://github.com/likhith-manchala/drowse-guard

## Overview

DrowseGuard is a browser research prototype for live drowsiness monitoring. The user starts a session, the app requests webcam access and loads MediaPipe, then evaluates face landmarks for eye closure, gaze, and tracking. It updates live metrics and alerts, keeps session logs in memory, and can export them as CSV. Settings adjust sensitivity and voice alerts. The README documents the dashboard’s role; sampled app.js excerpts show model loading, metric updates, settings persistence, alerts, and export. Internal links are limited to relationships supported by those excerpts or the README.

Main entry points: [`app.js`](https://github.com/likhith-manchala/drowse-guard/blob/main/app.js) (Frame analysis), [`index.html`](https://github.com/likhith-manchala/drowse-guard/blob/main/index.html) (Dashboard controls)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_session["Session and input"]
  node_dashboard["Dashboard controls<br/>[index.html]"]
  node_session_control["Session control<br/>[app.js]"]
  node_mediapipe["MediaPipe runtime"]
  node_model["Face Landmarker"]
end

subgraph group_analysis["Detection and metrics"]
  node_frame_analysis["Frame analysis<br/>[app.js]"]
  node_ear["EAR detection<br/>[app.js]"]
  node_closure_blinks["Closure and blinks<br/>[app.js]"]
  node_gaze_tracking["Gaze and tracking<br/>[app.js]"]
  node_perclos["PERCLOS metrics<br/>[app.js]"]
  node_telemetry["Session telemetry<br/>[app.js]"]
end

subgraph group_alerts["Alerts and settings"]
  node_alert_rules["Alert evaluation<br/>[app.js]"]
  node_alert_display["Alert display<br/>[app.js]"]
  node_voice["Voice alerts<br/>[app.js]"]
  node_settings["Sensitivity settings<br/>[app.js]"]
end

subgraph group_outputs["Dashboard and records"]
  node_metrics_ui["Live metrics UI<br/>[index.html]"]
  node_session_logs[("In-memory logs<br/>[app.js]")]
  node_csv_export["CSV export<br/>[app.js]"]
end

node_user(("User"))
node_webcam["Webcam"]
node_local_storage[("Browser storage")]

node_user -->|"starts session"| node_dashboard
node_dashboard -->|"controls"| node_session_control
node_session_control -->|"requests access"| node_webcam
node_session_control -->|"loads runtime"| node_mediapipe
node_mediapipe -->|"creates landmarker"| node_model
node_frame_analysis -->|"infers landmarks"| node_model
node_webcam -->|"provides frames"| node_frame_analysis
node_frame_analysis -->|"computes EAR"| node_ear
node_ear -->|"evaluates closure"| node_closure_blinks
node_frame_analysis -->|"evaluates gaze"| node_gaze_tracking
node_ear -->|"updates rolling metric"| node_perclos
node_frame_analysis -->|"records samples"| node_telemetry
node_closure_blinks -->|"checks prolonged closure"| node_alert_rules
node_gaze_tracking -->|"checks gaze and face loss"| node_alert_rules
node_alert_rules -->|"shows alerts"| node_alert_display
node_alert_rules -->|"speaks alerts"| node_voice
node_user -->|"adjusts sensitivity"| node_settings
node_settings -->|"persists preferences"| node_local_storage
node_frame_analysis -->|"updates displays"| node_metrics_ui
node_perclos -->|"updates display"| node_metrics_ui
node_telemetry -->|"records in memory"| node_session_logs
node_user -->|"requests export"| node_csv_export
node_csv_export -->|"exports records"| node_session_logs

click node_dashboard "https://github.com/likhith-manchala/drowse-guard/blob/main/index.html"
click node_session_control "https://github.com/likhith-manchala/drowse-guard/blob/main/app.js"
click node_frame_analysis "https://github.com/likhith-manchala/drowse-guard/blob/main/app.js"
click node_ear "https://github.com/likhith-manchala/drowse-guard/blob/main/app.js"
click node_closure_blinks "https://github.com/likhith-manchala/drowse-guard/blob/main/app.js"
click node_gaze_tracking "https://github.com/likhith-manchala/drowse-guard/blob/main/app.js"
click node_perclos "https://github.com/likhith-manchala/drowse-guard/blob/main/app.js"
click node_telemetry "https://github.com/likhith-manchala/drowse-guard/blob/main/app.js"
click node_alert_rules "https://github.com/likhith-manchala/drowse-guard/blob/main/app.js"
click node_alert_display "https://github.com/likhith-manchala/drowse-guard/blob/main/app.js"
click node_voice "https://github.com/likhith-manchala/drowse-guard/blob/main/app.js"
click node_settings "https://github.com/likhith-manchala/drowse-guard/blob/main/app.js"
click node_metrics_ui "https://github.com/likhith-manchala/drowse-guard/blob/main/index.html"
click node_session_logs "https://github.com/likhith-manchala/drowse-guard/blob/main/app.js"
click node_csv_export "https://github.com/likhith-manchala/drowse-guard/blob/main/app.js"

classDef toneNeutral fill:#f8fafc,stroke:#334155,stroke-width:1.5px,color:#0f172a
classDef toneBlue fill:#dbeafe,stroke:#2563eb,stroke-width:1.5px,color:#172554
classDef toneAmber fill:#fef3c7,stroke:#d97706,stroke-width:1.5px,color:#78350f
classDef toneMint fill:#dcfce7,stroke:#16a34a,stroke-width:1.5px,color:#14532d
classDef toneRose fill:#ffe4e6,stroke:#e11d48,stroke-width:1.5px,color:#881337
classDef toneIndigo fill:#e0e7ff,stroke:#4f46e5,stroke-width:1.5px,color:#312e81
classDef toneTeal fill:#ccfbf1,stroke:#0f766e,stroke-width:1.5px,color:#134e4a
class node_dashboard,node_session_control,node_mediapipe,node_model,node_user toneBlue
class node_frame_analysis,node_ear,node_closure_blinks,node_gaze_tracking,node_perclos,node_telemetry,node_local_storage toneAmber
class node_alert_rules,node_alert_display,node_voice,node_settings toneMint
class node_metrics_ui,node_session_logs,node_csv_export toneRose
class node_webcam toneIndigo
```

## Components

### Session and input

- [Dashboard controls](https://github.com/likhith-manchala/drowse-guard/blob/main/index.html): `index.html`
- [Session control](https://github.com/likhith-manchala/drowse-guard/blob/main/app.js): `app.js`
- **MediaPipe runtime**
- **Face Landmarker**

### Detection and metrics

- [Frame analysis](https://github.com/likhith-manchala/drowse-guard/blob/main/app.js): `app.js`
- [EAR detection](https://github.com/likhith-manchala/drowse-guard/blob/main/app.js): `app.js`
- [Closure and blinks](https://github.com/likhith-manchala/drowse-guard/blob/main/app.js): `app.js`
- [Gaze and tracking](https://github.com/likhith-manchala/drowse-guard/blob/main/app.js): `app.js`
- [PERCLOS metrics](https://github.com/likhith-manchala/drowse-guard/blob/main/app.js): `app.js`
- [Session telemetry](https://github.com/likhith-manchala/drowse-guard/blob/main/app.js): `app.js`

### Alerts and settings

- [Alert evaluation](https://github.com/likhith-manchala/drowse-guard/blob/main/app.js): `app.js`
- [Alert display](https://github.com/likhith-manchala/drowse-guard/blob/main/app.js): `app.js`
- [Voice alerts](https://github.com/likhith-manchala/drowse-guard/blob/main/app.js): `app.js`
- [Sensitivity settings](https://github.com/likhith-manchala/drowse-guard/blob/main/app.js): `app.js`

### Dashboard and records

- [Live metrics UI](https://github.com/likhith-manchala/drowse-guard/blob/main/index.html): `index.html`
- [In-memory logs](https://github.com/likhith-manchala/drowse-guard/blob/main/app.js): `app.js`
- [CSV export](https://github.com/likhith-manchala/drowse-guard/blob/main/app.js): `app.js`

### Other components

- **User**
- **Webcam**
- **Browser storage**

## Connections

- User → Dashboard controls: starts session (evidence: `README.md`)
- Dashboard controls → Session control: controls (evidence: `README.md`)
- Session control → Webcam: requests access (evidence: `README.md`)
- Session control → MediaPipe runtime: loads runtime (evidence: `app.js`)
- MediaPipe runtime → Face Landmarker: creates landmarker
- Frame analysis → Face Landmarker: infers landmarks (evidence: `app.js`)
- Webcam → Frame analysis: provides frames (evidence: `README.md`)
- Frame analysis → EAR detection: computes EAR (evidence: `README.md`)
- EAR detection → Closure and blinks: evaluates closure (evidence: `app.js`)
- Frame analysis → Gaze and tracking: evaluates gaze (evidence: `README.md`)
- EAR detection → PERCLOS metrics: updates rolling metric (evidence: `README.md`)
- Frame analysis → Session telemetry: records samples (evidence: `app.js`)
- Closure and blinks → Alert evaluation: checks prolonged closure (evidence: `app.js`)
- Gaze and tracking → Alert evaluation: checks gaze and face loss (evidence: `README.md`)
- Alert evaluation → Alert display: shows alerts (evidence: `README.md`)
- Alert evaluation → Voice alerts: speaks alerts (evidence: `app.js`)
- User → Sensitivity settings: adjusts sensitivity (evidence: `README.md`)
- Sensitivity settings → Browser storage: persists preferences (evidence: `app.js`)
- Frame analysis → Live metrics UI: updates displays (evidence: `app.js`)
- PERCLOS metrics → Live metrics UI: updates display (evidence: `README.md`)
- Session telemetry → In-memory logs: records in memory (evidence: `README.md`)
- User → CSV export: requests export (evidence: `README.md`)
- CSV export → In-memory logs: exports records (evidence: `app.js`)