Master Control Center

Multi-page, local-first dashboard for links, apps and live widgets, with optional native and custom protocol launching.
Explore the docs » · Get Started · Roadmap · Contribute

---

1. 
   • 
   • 
   • 
   • 
   • 
2. 
3. 
   • 
   • 
   • 
   • 
4. 
5. 
6. 
7. 
8. 
9. 
10. 
11. 
12. 
13. 
14. 
15. 

---

About the Project

Master Control Center is a modular, local-first dashboard for homelab, productivity and app-launching workflows. It provides:

• Multi-page/tabbed layout
• Grouped tiles for links, programs and widgets
• Live data widgets (weather, RSS, uptime, iframe, COVID)
• Visual customization (themes, fonts, glow accent)
• Local persistence with backup and restore
• Optional native and custom protocol launching

Core Structure

Layer	Purpose
UI (HTML/CSS/ES Modules)	Renders pages, groups, modals and settings
State Manager	Loads, migrates and persists data to extension storage
Renderers	Pages bar and groups/widgets orchestration
Widgets Engine	Weather, RSS, UptimeRobot, IFrame, COVID
Settings Panel	Theme, font, glow, cache, backup, APIs
Actions & Events	Export/import/reset and delegated interactions
Native Bridge (MV3)	Optional messaging for local program launch
Windows Helpers	Protocol registration and batch launchers

Key Features

Feature	Description
Layout & Interaction	Multi-page tabs, per-page groups, drag and drop ordering, edit mode toggle.
Customization	Themes (system/light/dark/crimson), searchable font catalog, glow effect with safety controls.
Link & Program Management	Icon modes (favicon/logo.dev/URL/upload), domain guessing, and native/program launch support.
Widgets	Weather (Open-Meteo), RSS (proxy fallback + highlighting), UptimeRobot, sandboxed IFrame, COVID stats.
Data & Persistence	Local storage, timestamped export, migration-safe IDs.
Performance	Lazy icon loading, unified cache pool, idle scheduling, lean service worker.
Reliability & Safety	Defensive error handling, sandboxed iframes, native allowlist, CORS fallback.

Tech Stack

Domain	Technologies
Frontend	HTML5, CSS3, ES Modules
Browser Extension	Chrome MV3 (service worker + storage)
Scripts	PowerShell, Batch (.bat), Python (utility GUI), Node.js (native host example)
Data	JSON state + in-memory caches
APIs	Open-Meteo, logo.dev, UptimeRobot, disease.sh, RSS feeds

Built With

Architecture Overview

1. Extension action opens the dashboard.
2. main.js loads and migrates state to initial render.
3. User edits update in-memory state with debounced persist.
4. Widgets hydrate from cache or network (proxy fallback logic for RSS).
5. Program tiles launch via scheme or native host.

---

Screenshots / Showcase

Dashboard

Pages Overflow & Widgets

Modals & Settings

---

Getting Started

Run as an unpacked Chromium extension (recommended) or open dashboard.html directly (reduced feature set outside extension context).

Prerequisites

• Chromium-based browser (Chrome / Edge / Brave)
• (Optional) Node.js 18+ (native host example)
• (Optional) PowerShell (Windows) for protocol registration

Installation (as Extension)

1. Clone the repository
2. Open chrome://extensions and enable Developer Mode
3. Click Load unpacked and select the project root
4. Click the extension icon to open the dashboard

Optional Native Launching

1. Edit the native/host-manifest.json path
2. Adapt native/stackdash-native.js to whitelist commands
3. Register the native host per Chrome documentation
4. Set program tiles to the native launch method

Optional Custom URL Protocols (Windows)

1. Run PowerShell: CommandManager/Register-ExecutableProtocols.ps1 -Force
2. Test: start someprogramx:
3. Batch launchers are stored under helpers/windows/

---

Usage

Action	How
Add Page	Click the Add Page button (top bar)
Add Group	Click the Create Group card at the end of groups
Add Link / Program / Widget	Use the group menu or edit mode buttons
Rearrange Tiles	Drag and drop in edit mode
Theme / Font	Settings → General
Glow	Settings → General
Backup	Settings → Data → Export JSON
Restore	Settings → Data → Import JSON
Reset Pages	Settings → Advanced (Danger)
Toggle Edit Mode	Use the settings panel switch

---

Widgets

Widget	Summary	Notes
Weather	Current conditions and details	Open-Meteo (no key)
RSS	Feed items with new highlighting	Multi-proxy fallback
UptimeRobot	Uptime percentage and status	API key required
IFrame	Embed external page	Subject to X-Frame/CSP
COVID	Basic statistics	Uses disease.sh API

---

Configuration

Setting	Location	Description
Theme	Settings → General	System / Light / Dark / Crimson
Font	Settings → General	Searchable catalog
Glow	Settings → General	Enable + color + reset
Cache Max Age	Settings → Advanced	Hours before pruning
Cache Max Entries	Settings → Advanced	Per-cache cap
Perf Flag	Settings → Advanced	Internal diagnostics toggle
Logo.dev Key	Settings → APIs	Enables logo fetching

---

Data Export / Import

• Export: timestamped JSON (pages, groups, links, widgets, programs, settings)
• Import: schema normalization (IDs, arrays, safety checks)
• Compatible across future minor migrations

---

Performance and Caching

• Lazy loading for icons and images
• Unified cache pool (RSS, weather, COVID, uptime)
• TTL + max entries pruning (idle scheduled)
• Lightweight full re-render model (low state size)

---

Security & Privacy

Aspect	Approach
Storage	Local (extension and localStorage only)
Native Execution	Explicit command allowlist sample
Logo API Key	Kept only in settings (not serialized per item)
IFrames	Sandbox with opt-in permissions
RSS	Proxy fallback avoids noisy CORS errors
Uploads	Size-limited; never auto-exfiltrated

---

Directory Structure

oh/
 ├─ dashboard.html
 ├─ manifest.json
 ├─ service-worker.js
 ├─ css/
     └─ dashboard.css
 ├─ js/
 │   ├─ API/
 │   │   └─ fileSystemAccess.js
 │   ├─ main.js
 │   ├─ state.js
 │   ├─ render-pages.js
 │   ├─ render-groups.js
 │   ├─ settings.js
 │   ├─ actions.js
 │   ├─ modals.js
 │   ├─ utils.js
 │   ├─ events.js
 │   ├─ fonts.js
 │   └─ favicon.js

 **├─ CommandManager/**
 │   └─ Register-ExecutableProtocols.ps1
 **├─ helpers/windows/*.bat**

 ├─ dashboard-natives/
 │   ├─ homelab.json
 ├─ native/
 │   ├─ host-manifest.json
 │   └─ stackdash-native.js
 ├─ assets/
     ├─ images/
     └─ icon/
 │     └─ stackdash-*.png / .svg
 └─ README.md

---

Roadmap

• Extract widget code into modular sub-files
• Unit tests for migrations and import
• Additional widgets (Grafana / Prometheus)
• Optional encrypted cloud sync
• Performance metrics panel UI
• Auto theme schedule
• Profiles / multi-config switcher

---

Contributing

1. Fork the repository
2. Create a feature branch (git checkout -b feat/awesome)
3. Commit (git commit -m "feat: add awesome")
4. Push (git push origin feat/awesome)
5. Open a Pull Request

Good first contributions: widget extraction, accessibility polish, performance measurement harness, new icon sources, additional program launch modes.

---

Acknowledgments

• logo.dev (logo resolution)
• Open-Meteo (weather)
• UptimeRobot (uptime API)
• disease.sh (COVID stats)
• Favicon & logo fallbacks (Google & Clearbit)
• Community dashboard and homelab inspirations

---

Idea of Original Credit