Features implemented:
- Full table with sortable columns: Name, MAC, Role, Position, Firmware, RSSI, Status, Uptime, Actions
- Role dropdown for changing node roles
- Position column with camera fly-to on click
- Firmware version with update badge
- Bulk actions: Update All, Re-baseline All, Export Config, Import Config, CSV Report
- Node actions: Restart, Update, Remove, Identify (blink LED)
- Responsive design for desktop and mobile
- Toast notifications and modal dialogs
- Go function GenerateBriefing(date, person) assembles briefing in priority order
- Sections: critical alerts → sleep → who's home → anomalies → system health → predictions → learning
- Stored as daily record in briefings table with sections_json
- Expert mode: card overlay on first open, dismissible, slides away after 10s
- Simple mode: morning card as first card in layout
- Ambient mode: text fades in on first person detection, stays for 30s
- Delivery via dashboard, push notification, or webhook
- All acceptance criteria met
- Fix auto-dim timeout from 60 seconds to 30 minutes (30 * 60 * 1000ms)
- Add auth.js dependency to ambient.html for proper authentication
- Rewrite ambient.test.js to remove problematic require() statements
- Update ambient.js with proper time-of-day handling
- Enhance ambient.css with time-of-day palette themes
Ambient mode provides a simplified, always-on display for wall-mounted
tablets with Canvas 2D rendering, time-of-day awareness, auto-dim after
30min of no presence, alert mode with pulsing red border, and morning
briefing integration.
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
- Card-based mobile-first UI for non-technical users
- Room cards showing occupancy count, person names, and status color
- Activity feed with chronological event list from timeline
- Alert banner for fall detection, anomaly alerts, and system warnings
- Quick actions: arm/disarm security, re-baseline, silence alerts
- Sleep summary card showing last night's sleep data
- Toggle between simple/expert mode with localStorage preference
- Added /simple route in mothership for serving simple mode page
- Added purple color scale to tokens.css for sleep features
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
- Add simple.html: mobile-first card-based UI without 3D scene
- Room cards show occupancy count, person names, and status color
- Activity feed displays chronological events from timeline
- Alert banner for fall detection, anomaly alerts, system warnings
- Quick actions: arm/disarm security, re-baseline, silence alerts
- Sleep summary card showing last night's sleep data
- Simple/expert mode toggle button in all views
- Mobile-responsive layout with touch-friendly interface
- Per-user default mode stored in localStorage
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
- Refactored simulate.js to properly use existing HTML structure from simulator.html
- Added ghost wireframe node visualization using THREE.OctahedronGeometry with wireframe material
- Implemented dashed links between virtual nodes using THREE.LineDashedMaterial
- Added CSS for selected state highlighting and proper panel positioning
- Reused TransformControls from 3D editor for node placement
- Virtual nodes appear as teal-colored wireframe octahedrons
- Links between virtual nodes render as teal dashed lines
- GDOP overlay updates in real-time as nodes are dragged
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
- Add 'Pause Live' button that freezes 3D view and reveals timeline scrubber
- Implement scrubbing backward/forward through recorded history (1×, 2×, 5×)
- 3D scene renders blobs exactly as detected at scrubbed time, including trails
- Add parameter tuning overlay with sliders for detection parameters:
- Detection threshold (deltaRMS)
- Baseline time constant (tau)
- Fresnel weight decay rate
- Subcarrier selection count (NBVI)
- Breathing sensitivity
- Adjusting slider re-runs pipeline on recorded CSI with new parameters
- Add 'Apply to Live' button that writes tuned parameters to running pipeline
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Fix touch event propagation from panels to canvas, resolve iOS Safari
passive event listener warnings, prevent double-tap zoom conflicts,
improve pinch gesture accuracy, and enable three-finger pan.
Changes:
- Add maximum-scale=1.0, user-scalable=no to viewport meta tag (live.html)
- Add touch-action: none to canvas elements (expert.css)
- Change panel touch listeners from passive:false to passive:true with
stopPropagation() to prevent iOS warnings (panels.js)
- Enhance controls.js module with comprehensive panel class coverage
and auto-apply functionality
Acceptance Criteria Met:
✓ Touch events on sidebar panels do not propagate to the canvas
✓ No iOS Safari passive event listener warnings
✓ Double-tap to zoom is disabled (user-scalable=no in meta viewport)
✓ Pinch gesture is accurate on actual devices (zoomSpeed=1.0)
✓ Three-finger pan is enabled in OrbitControls
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
- Add collapsible filter panel with category checkboxes (Presence, Zones,
Alerts, System, Learning) for client-side event type filtering
- Add person and zone dropdowns populated from /api/people and /api/zones
- Add date range selector (All Time / Today / Last 7 Days / Last 30 Days /
Custom range) with server-side re-fetch on date changes
- Add text search input with fuzzy client-side matching and FTS5 server-side
prefix matching for descriptions
- Add active filter tags with individual remove buttons and Clear All
- Add load-more cursor pagination for 500+ results
- Add virtualized rendering with IntersectionObserver for 1000+ events
- Render event feedback buttons (thumbs up/down) inline on each event
- Add now-replaying chip showing current replay timestamp
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Add CSS environment variables for safe-area-inset to prevent content
overlap with notch/home indicator on iOS devices.
- Add padding-top and padding-bottom to body using env(safe-area-inset-*)
- Mobile bottom navigation already respects safe-area-inset-bottom
- viewport-fit=cover meta tag already present in all HTML pages
- Add security status card with arm/disarm dialog, DISARMED/LEARNING/ARMED/ALERT
badge, learning progress bar (N of 7 days), and last-anomaly summary line
- Add full-width alert banner with acknowledge button for armed-mode anomalies;
acknowledged alerts disappear from banner but remain in history
- Add anomaly timeline panel (24h) with severity scores and timeline navigation
- Fix WS broadcast field names to match AnomalyEvent JSON/REST API:
anomaly_type→type, timestamp_ms→RFC3339 timestamp so JS handles both
WS pushes and polled history uniformly
- Fix formatTimeAgo() to parse RFC3339 string timestamps in addition to Unix-ms
- Fix fetchAnomalyCount() to use /api/anomalies?since=24h (structured response)
instead of /api/anomalies/history (returns plain array)
- Add security-card detail area styling to anomaly.css
- Add BlobIdentityProvider wiring in zones API for people resolution in zone responses
- Add linkweather diagnostic engine tests (Rules 1-5 + helpers)
All go test ./... pass; go vet ./... clean.
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
- Improve link highlighting with Fresnel health color mapping
- Route re-provision through live page via query param for reliability
- Remove simple-mode gating from command palette (now available everywhere except ambient)
- Update Fresnel tests, fleet page unpaired node UX, and help articles
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Rename expert.css → scene.css (file contained WCAG touch targets and
3D scene layout, nothing mode-specific). Remove dead dashboardMode !==
'expert' guard in timeline seek handler. Simple/expert toggle and
localStorage key were already removed in prior commits.
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
The Simple/Expert toggle was removed in an earlier commit but left behind
stale comments referencing "mode toggle bar", "expert mode", and
"simple.html" in CSS files. Clean these up to avoid confusion.
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Implements the full explainability overlay for understanding why a blob was detected:
- ExplainabilitySnapshot generation with per-link contribution tracking and zone decay
- Fresnel zone ellipsoid geometry computation and 3D wireframe rendering
- WebSocket request_explain / blob_explain flow for on-demand snapshots
- Right-click, long-press, click, and hover tooltip activation paths
- X-ray overlay dims non-contributing elements, highlights contributing links
- Sidebar panel with confidence gauge, links table, sparklines, BLE match card
- Escape key and backdrop click to exit, restoring scene state
Also includes: simple mode removal, CSS cleanup, fleet page enhancements, sidebar timeline fixes.
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Fix missing colons in CSS declarations across timeline.css and replay.css
that broke gap/padding/margin/bottom properties. Simplify timeline mode
detection to use router callbacks instead of SpaxelSimpleModeDetection.
Add aria-labels to select elements for accessibility.
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Nodes that connect without a valid token during the migration window are
now accepted and flagged as Unpaired rather than rejected. Fleet health
surfaces the flag so the dashboard can show an amber Unpaired badge in
the MAC column, an "Unpaired" status badge, and a ↺ re-provision action
button that re-opens the onboarding wizard in reprove mode (skips the
firmware-flash step, targets the specific node's MAC during detect).
- ingestion/server: migrationDeadline + Unpaired flag on NodeConnection
- fleet/fleethandler: UnpairedProvider interface, merges unpaired MACs
into fleet health response
- config: SPAXEL_MIGRATION_WINDOW_HOURS (default 24 h, range 0-168)
- main: wires migration deadline and unpaired provider at startup
- onboard.js: reprove(mac) public API, skip-flash + targeted-detect mode
- fleet.js: Unpaired badge, Re-provision button, unpaired banner, ⚠ in
role list, reproveNode public API
- wizard.css: .wizard-reprove-banner amber styling
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Add @axe-core/playwright with Playwright test runner that asserts zero
WCAG 2A/2AA violations across index, live, fleet, setup, and
integrations pages. Fix contrast violations on integrations page: use
darker blue for primary buttons, lighter text for descriptions/hints,
and add body-level dark background in layout.css.
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
The status banner, cards grid, and extras grid all had margin: 0
with max-width set, causing them to left-align instead of centering
at wider viewports. Changed to margin: 0 auto for proper centering.
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Fix systemic missing-colon bugs in layout.css where property values
like top, left, right, bottom, gap, padding were directly followed by
var() without a colon separator. This broke all fixed-position panels
in the live view. Also add missing --space-half token to tokens.css
and complete design token migration across remaining CSS files.
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Replace additional hard-coded colors with design tokens in layout,
notifications, panels, timeline, and other CSS files.
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Replace remaining hard-coded colors across all CSS files with design
tokens from tokens.css. Remove duplicate inline positioning from
live.html panels (now in layout.css). Add replay session blob fetch
for immediate 3D scene state on seek.
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Move inline position:fixed styles from setup.html and expert.css into the
shared layout.css stylesheet. Convert #scene-container and #status-bar from
position:fixed to grid-child layout within .app-shell--live, eliminating
fragile top/height calc chains that broke on every new overlay element.
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Replace hardcoded spacing (padding, margin, gap), typography (font-size,
line-height), and border-radius values with CSS custom property tokens
from tokens.css across all 26 dashboard CSS files. Colors were already
tokenized; this completes the design system adoption per plan.md §8e.
763 lines changed: 478 from bulk spacing/typography pass, 285 from
directional margin/padding pass. No hex colors remain outside tokens.css.
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Extract ID-based panel positioning (#node-panel, #chart-panel,
#presence-panel) from live.html inline styles into shared layout.css
with proper responsive breakpoints for tablet and mobile.
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Move inline <style> blocks from simple.html and integrations.html into
external CSS files (wizard.css, integrations.css), replacing all
hard-coded pixel values with design tokens from tokens.css. Remove
inline style attributes in favor of CSS classes. All 5 dashboard pages
now share one design system via Radix dark tokens (§8e).
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Replace remaining hardcoded font-size, padding, and border-radius values
with design token variables in layout.css, timeline.css, live.html, and
setup.html. Add timeline explain button and selected-event highlight styles.
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Continued CSS tokenization pass across ambient, fleet, live, simple,
integrations pages and their component stylesheets. Replaces hardcoded
`white`, `#1a1a2e`, and raw rgba values with semantic tokens from
tokens.css.
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Home page (index.html) is now a clean status+cards layout (109 lines):
- Row 1: status headline with ok/warn/alert states
- Row 2: three cards linking to /live#zones, /fleet, /live#timeline
- Row 3: optional briefing, anomaly, security toggle
- Mobile bottom nav for Home/Live/Fleet/Setup
3D viewer lives at /live (live.html), fleet at /fleet, setup at /setup.
All routes served by Go chi router. home-cards.js connects to /ws/dashboard
for snapshot+incremental updates.
Remaining CSS tokenization: live.html buttons and layout.css status bar
now use design tokens instead of hardcoded colors. Added --orange token
for GDOP fair quality. timeline.js gains replay state fields.
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Replace remaining hardcoded border-radius and color values across 22 CSS
files with design system tokens. Add .live-status-bar, .live-scene, and
.live-panel-* classes to layout.css for the grid-based live view shell.
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
panels.css: replaced 17 hardcoded rgba values with semantic token
references (--alert, --warn-bg, --ok-bg, --border-strong, etc).
ambient.css: replaced one hardcoded blue rgba with --blue-muted.
Zero hardcoded hex/rgba color values remain outside tokens.css.
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Cache the full WebSocket snapshot so incremental updates always have
complete state for banner and card rendering. Add fall/security alert
detection in the status banner with --alert level. Add armed security
state styling in home.css.
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Convert hardcoded rgba colors across all dashboard CSS files to use
--ok-bg, --warn-bg, --alert-bg tokens from tokens.css per §8e design
system. Home page status banner and card tags now use proper semantic
tokens. Add layout.css import to live.html for shared nav structure.
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
When timeline event is clicked in expert mode, emit jump_to_time command
with event timestamp. The time-travel player pauses live playback, seeks
CSI recording buffer to timestamp, and begins replay. Selected event
highlights in timeline and "Now replaying" chip appears in header.
Backend: POST /api/replay/jump-to-time creates replay session centered
on timestamp, replaces previous active session. Frontend: handleSeek()
in sidebar-timeline delegates to SpaxelReplay.jumpToTime() which calls
the API, shows replay control bar, and notifies Viz3D.
Tests: 7 Go test cases for jump-to-time endpoint, 8 JS test cases for
tap-to-jump interaction, event highlighting, and now-replaying chip.
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Per plan.md §8e information architecture:
- index.html (109 lines) is now a home page with status headline,
3 cards (People & Zones, Devices & Fleet Health, Recent Events),
optional extras row, and mobile bottom nav
- live.html serves the full 3D viewer at /live route
- home-cards.js connects to /ws/dashboard for snapshot + incremental updates
- tokens.css provides the Radix dark design system
- layout.css provides the CSS Grid app shell with responsive breakpoints
- home.css provides card grid, status banner, responsive mobile layout
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Delete non-canonical commandpalette.* and blepanel.js in favor of the
hyphenated command-palette.* and ble-panel.* which match the fleet-page.*
naming convention. Rename test file accordingly.
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
- Add mode switching for timeline panel with ?mode=expert or ?mode=simple
- Expert mode displays all event types with system events as secondary (smaller, greyed)
- Simple mode shows only person-relevant events: ZoneTransition, FallDetected, AnomalyDetected, SleepSessionEnd, zone_entry/exit, portal_crossing, fall_alert, anomaly, security_alert
- Backend defaults to expert mode when mode parameter is empty or invalid
- Frontend syncs dashboard mode with SpaxelSimpleModeDetection for mode changes
- Add CSS styling for new event types (ZoneTransition, FallDetected, AnomalyDetected, sleep_session_end)
- Update isValidEventType to include new event types
- Added dropdown menu for More actions button with options:
- Re-assign Role
- View Health History
- View Event History
- Remove from Fleet
- Added CSS styles for dropdown menus with proper positioning
and hover states
- Extended FleetHandler with additional API endpoints:
- PATCH /api/nodes/{mac}/label - update node label
- POST /api/nodes/{mac}/locate - send identify command
- POST /api/nodes/{mac}/role - assign new role
- DELETE /api/nodes/{mac} - remove from fleet
- Added label validation (max 32 characters)
- Improved test code quality with helper functions
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
- Add TestZoneBoundariesAtCorrectCoordinates to verify zone boundaries appear at correct pixel coordinates
- Add TestZoneBoundaryEdges to verify zone edge detection
- Enhance TestPixelColors with accurate background color verification (#1a1a2e)
- Fix person color detection by sampling multiple pixels to find red fill
- Tests verify 300x300 PNG dimensions, correct zone boundary coordinates, and accurate colors
- All renderer tests pass
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
- Add touch-action: none to canvas elements in expert.css and ambient.css
to prevent passive event listener warnings on iOS Safari
- Add user-scalable=no and maximum-scale=1.0 to viewport meta tags
in ambient.html and simple.html to prevent double-tap zoom
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Add CSS environment variables for safe-area-inset to prevent content
overlap with notch/home indicator on iOS devices.
Changes:
- expert.css: Add safe area support to body, scene container, and
simple-quick-actions (hamburger menu) navigation
- quick-actions.css: Add safe area support to context menu and
follow-mode-indicator
- panels.css: Add safe area support to toast-container
- troubleshoot.css: Add safe area support to spaxel-dismiss-all
The viewport-fit=cover meta tag was already present in index.html.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
- Cap devicePixelRatio at 2.0 on screens < 1024px width
- Disable MSAA antialiasing on mobile devices
- Disable shadow maps on mobile devices
- Add frame rate capping at 30fps for struggling mobile devices
- Auto-detect low FPS and adjust frame rate accordingly
- Panel close buttons: expanded from 32x32px to 44x44px
- Slider controls: expanded drag targets to 44px height with 32px thumb
- Toggle switches: expanded to 44px minimum height
- Checkboxes: expanded touch area with pseudo-element to 44x44px
- Context menu items: minimum 44px height
- Link list entries: minimum 44px height
- All buttons: minimum 44x44px touch targets
- Small buttons use expanded padding to maintain appearance while meeting 44px requirement
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
- Add expert.css for expert mode specific styles
- Improve mobile orientation change handling with visualViewport API support
- Add iOS Safari visual viewport resize handling for better mobile experience
- Add getViewportDimensions() function preferring visualViewport API
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Implement transform-based slide-in animation with overlay backdrop for screens < 1024px:
- Hamburger button (44x44px touch target) in header
- Slide-in menu with translateX(0) animation (200ms ease-out)
- Semi-transparent overlay backdrop that closes on tap
- Menu contains: Node List, Link List, Presence Panel, Timeline, Devices
- Active tab opens first (last-used panel persisted to localStorage)
- Close button (X, 44px) in top-right
- Escape key closes menu
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
