1. Overview

Undrift is a single-file, client-side AI meeting facilitator. No backend server, no runtime build toolchain, no external JS dependencies beyond the Anthropic Messages API.

Tech stack

• HTML5 / CSS3 / Vanilla JavaScript (ES2020+)
• Anthropic Messages API — claude-sonnet-4-20250514
• Web Speech API (browser-native STT, Chrome/Edge only)
• Web Audio API (browser-native tone generation)
• Node.js + docx npm package (documentation build only — not shipped)

2. File Structure

3. Module Breakdown

Key functions — M1

Key functions — M2

M5 analysis thresholds

M7 score formula

• 40% — completion rate: items done ÷ total items
• 40% — on-time rate: items finishing within 110% of allocation
• 20% — flag penalty: max(0, 100 − totalFlags × 8)

4. SESSION_DATA Contract

window.SESSION_DATA is initialized in M1 and is the single source of truth consumed by all modules.

window.SESSION_DATA = {
  title:           string,
  date:            string,         // DD-MMM-YYYY e.g. "07-Apr-2026"
  duration:        number,         // total minutes
  audience:        string,
  facilitator:     string,
  aggression:      1 | 2 | 3,     // Gentle | Balanced | Vigilant
  aggressionLabel: string,
  agenda: [{
    topic:     string,
    minutes:   number,
    type:      'Discussion' | 'Decision' | 'Info share' | 'Workshop' | 'Q&A' | 'Break',
    status:    'pending' | 'active' | 'done',
    startedAt: number | null,      // Date.now() timestamp
    endedAt:   number | null,
  }],
  outcomes:    string[],
  startedAt:   number,             // session start timestamp
  endedAt:     number | null,
  actionItems: string[],           // populated on endSession()
  parkingLot:  string[],
  notes:       string[],
  flags: [{
    type: 'manual-flag' | 'ai-analysis',
    topic?: string, ts: number,
    onTrack?: boolean, driftSeverity?: string, flagType?: string
  }]
}

5. Anthropic API

Vercel proxy — api/analyze.js

All API calls from the app route through /api/analyze, a Vercel serverless function that adds the API key server-side. The app never has direct access to the key. The proxy forwards the full request body to Anthropic and returns the response verbatim. Rate limiting is enforced at 20 requests per IP per 15-minute window.

Request:  POST /api/analyze  (from browser)
Proxy:    POST https://api.anthropic.com/v1/messages  (with x-api-key from env)
Response: forwarded back to browser

The API key is stored in Vercel environment variables under ANTHROPIC_API_KEY. For local development, it's read from .env.local via vercel dev.

Endpoint

POST https://api.anthropic.com/v1/messages

Common request shape

{
  model:    "claude-sonnet-4-20250514",
  max_tokens: 1000,
  system:   "<dynamic prompt>",
  messages: [{ role: "user", content: "<user content>" }]
}

M1 — Paste & Parse

Called once on "Parse agenda." System prompt instructs the model to return only JSON matching the agenda schema. Regex-based fallback runs if API is unavailable.

M5 — Scope Analysis response schema

{
  onTrack:         boolean,
  driftDetected:   boolean,
  driftSeverity:   "none" | "mild" | "moderate" | "severe",
  driftReason:     string | null,
  suggestRedirect: boolean,
  redirectScript:  string | null,
  flagType:        "none" | "off-topic" | "scope-creep" | "time-risk" | ...,
  flagNote:        string | null,   // max 15 words
  timeRisk:        boolean,
  timeRiskNote:    string | null
}

6. Date Handling

All dates in Undrift are stored and displayed as DD-MMM-YYYY (e.g. 07-Apr-2026). The underlying hidden <input type="date"> stores YYYY-MM-DD and the browser's native picker handles display in the user's locale.

Date picker fields

• f-date-display — read-only text input showing DD-MMM-YYYY; clicking opens the picker
• f-date-hidden — hidden type="date" input; stores YYYY-MM-DD; drives the native picker popup
• f-date-icon — calendar SVG button that calls hidden.showPicker()

parseToISO(raw)

Normalizes any imported date string to YYYY-MM-DD before setting the picker. Pipeline:

1. If already YYYY-MM-DD — return as-is
2. Strip ordinal suffixes (7th → 7, 1st → 1)
3. Pass cleaned string to new Date() — handles most written formats
4. If still invalid — leave picker at today's default

Imported dates from upload or paste-and-parse always go through parseToISO() → fmtDateDisplay() so the displayed date is always consistent with the picker.

7. Theme & Layout

Light/dark toggled via data-theme on <html>. Persisted in localStorage under key undrift_theme.

Dashboard layout — fixed positioning

The dashboard uses position: fixed for all three layers, eliminating height-calculation bugs:

.topbar    { position: fixed; top: 0; height: var(--topbar-h); }
.statusbar { position: fixed; top: var(--topbar-h); }
.layout    { position: fixed; top: calc(var(--topbar-h) + var(--statusbar-h));
             left: 0; right: 0; bottom: 0; }

--statusbar-h is measured live by a ResizeObserver on the statusbar element, so the layout grid always anchors correctly regardless of statusbar reflow.

Scroll behavior by mode

body[data-mode="setup"]     { min-height: 100vh; overflow-y: auto; }
body[data-mode="dashboard"] { height: 100vh; overflow: hidden; }
body[data-mode="report"]    { min-height: 100vh; overflow-y: auto; }

Key CSS custom properties

8. Build Process

Rebuild app after editing source modules

python undrift-build.py

JS obfuscation

The build script automatically obfuscates the compiled JS block using javascript-obfuscator before injection. Install once with npm install -g javascript-obfuscator. If not installed, the build continues unobfuscated with a warning. All HTML-facing entry point functions are protected via --reserved-names so obfuscation never breaks runtime behavior.

Adding a new module

1. Create your JS file (e.g. ac-mymodule.js)
2. Add CSS to undrift-styles.css
3. In undrift-build.py, read the file and inject into the JS concatenation block
4. Add any new HTML-facing function names to _ENTRY_POINTS in undrift-build.py
5. Run python undrift-build.py
6. Update undrift-docs.html and README.md

9. Changelog

For full version history, see CHANGELOG.md.