Add demo mode: virtual hardware sandbox for testing without real devices

Demo mode provides a complete sandbox environment with:
- Virtual capture engine (radial rainbow test pattern on 3 displays)
- Virtual audio engine (synthetic music-like audio on 2 devices)
- Virtual LED device provider (strip/60, matrix/256, ring/24 LEDs)
- Isolated data directory (data/demo/) with auto-seeded sample entities
- Dedicated config (config/demo_config.yaml) with pre-configured API key
- Frontend indicator (DEMO badge + dismissible banner)
- Engine filtering (only demo engines visible in demo mode)
- Separate entry point: python -m wled_controller.demo (port 8081)

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
2026-03-20 16:17:14 +03:00
parent 81b275979b
commit 2240471b67
36 changed files with 1548 additions and 282 deletions
@@ -129,6 +129,59 @@ h2 {
50% { opacity: 0.5; }
}
/* Demo mode badge (header) */
.demo-badge {
font-family: 'Orbitron', sans-serif;
font-size: 0.6rem;
font-weight: 700;
letter-spacing: 0.08em;
color: #1a1a1a;
background: #ffb300;
padding: 2px 10px;
border-radius: 10px;
text-transform: uppercase;
animation: demoPulse 3s ease-in-out infinite;
white-space: nowrap;
}
@keyframes demoPulse {
0%, 100% { opacity: 1; }
50% { opacity: 0.7; }
}
/* Demo mode banner (top of page) */
.demo-banner {
display: flex;
align-items: center;
justify-content: center;
gap: 12px;
padding: 8px 16px;
background: linear-gradient(90deg, #ff8f00, #ffb300);
color: #1a1a1a;
font-size: 0.85rem;
font-weight: 500;
text-align: center;
z-index: var(--z-sticky, 100);
position: relative;
}
.demo-banner-dismiss {
background: none;
border: none;
color: #1a1a1a;
font-size: 1.2rem;
cursor: pointer;
padding: 0 4px;
opacity: 0.6;
transition: opacity 0.2s;
line-height: 1;
flex-shrink: 0;
}
.demo-banner-dismiss:hover {
opacity: 1;
}
/* Connection lost overlay */
.connection-overlay {
position: fixed;