Amicus Web Studio™ DECK // v0.1.0
🤖 Live Agent Browser Deck ↗
[Ctrl + Enter to Execute]
ENGINE:
PRESET DEMO LOADOUTS HOTKEYS [1-4]
🌳 SELECTABLE SITE ITEMS (0)
Click any element in canvas or load a demo to index items.
VERIFICATION TELEMETRY GRADE A (100)
A11Y: PASS VIEWPORTS: OK ICE GUARD: ACTIVE
BLOCK #01 • Source Output (0 lines) 
// Select a demo loadout on the left or press Alt+1..4 to initialize...
LIVE RENDER VIEWPORT [Desktop 100%]
⚡ Ready
${clean} `; const blob = new Blob([fullHtml], { type: 'text/html' }); const url = URL.createObjectURL(blob); const a = document.createElement('a'); a.href = url; a.download = 'amicus-component.html'; a.click(); URL.revokeObjectURL(url); showToast('Exported standalone HTML bundle', '💾'); } // RAYCAST / LINEAR COMMAND PALETTE CONTROLS function openPalette() { playSfx('click'); const modal = document.getElementById('commandPaletteModal'); const input = document.getElementById('paletteInput'); modal.classList.remove('hidden'); input.value = ''; filteredCommands = [...COMMANDS]; selectedPaletteIndex = 0; renderPaletteItems(); setTimeout(() => input.focus(), 50); } function closePalette() { document.getElementById('commandPaletteModal').classList.add('hidden'); } function filterPalette() { const query = document.getElementById('paletteInput').value.toLowerCase().trim(); if (!query) { filteredCommands = [...COMMANDS]; } else { filteredCommands = COMMANDS.filter(c => c.title.toLowerCase().includes(query) || c.category.toLowerCase().includes(query) ); } selectedPaletteIndex = 0; renderPaletteItems(); } function renderPaletteItems() { const list = document.getElementById('paletteList'); if (filteredCommands.length === 0) { list.innerHTML = `
No matching commands found.
`; return; } list.innerHTML = filteredCommands.map((c, i) => `
${c.category} ${c.title}
${c.hotkey ? `${c.hotkey}` : ''}
`).join(''); } function handlePaletteKeydown(e) { if (e.key === 'ArrowDown') { e.preventDefault(); selectedPaletteIndex = (selectedPaletteIndex + 1) % filteredCommands.length; renderPaletteItems(); playSfx('click'); } else if (e.key === 'ArrowUp') { e.preventDefault(); selectedPaletteIndex = (selectedPaletteIndex - 1 + filteredCommands.length) % filteredCommands.length; renderPaletteItems(); playSfx('click'); } else if (e.key === 'Enter') { e.preventDefault(); executePaletteItem(selectedPaletteIndex); } else if (e.key === 'Escape') { closePalette(); } } function executePaletteItem(index) { if (filteredCommands[index]) { closePalette(); filteredCommands[index].action(); } } // SHORTCUTS MODAL function openShortcutsModal() { playSfx('click'); document.getElementById('shortcutsModal').classList.remove('hidden'); } function closeShortcutsModal() { document.getElementById('shortcutsModal').classList.add('hidden'); } // GLOBAL KEYBOARD SHORTCUTS MATRIX window.addEventListener('keydown', (e) => { // Cmd+K or Ctrl+K: Open Command Palette if ((e.ctrlKey || e.metaKey) && (e.key === 'k' || e.key === 'K')) { e.preventDefault(); openPalette(); return; } // Close open modals on Escape if (e.key === 'Escape') { closePalette(); closeShortcutsModal(); return; } // If user is typing in an input or textarea, don't hijack single key triggers const isInputActive = ['INPUT', 'TEXTAREA'].includes(document.activeElement.tagName); // ? : Keyboard shortcuts cheat sheet if (!isInputActive && e.key === '?') { e.preventDefault(); openShortcutsModal(); return; } // Ctrl + Enter or Cmd + Enter: Synthesize if ((e.ctrlKey || e.metaKey) && e.key === 'Enter') { e.preventDefault(); synthesize(); } // Alt + 1, 2, 3, 4, 5: Load Demos if (e.altKey && e.key === '1') { e.preventDefault(); loadDemo(1); } if (e.altKey && e.key === '2') { e.preventDefault(); loadDemo(2); } if (e.altKey && e.key === '3') { e.preventDefault(); loadDemo(3); } if (e.altKey && e.key === '4') { e.preventDefault(); loadDemo(4); } if (e.altKey && e.key === '5') { e.preventDefault(); loadDemo(5); } // Alt + I: Toggle In-Situ Inspector if (e.altKey && (e.key === 'i' || e.key === 'I')) { e.preventDefault(); toggleInspector(); } // Alt + C: Copy Code if (e.altKey && (e.key === 'c' || e.key === 'C')) { e.preventDefault(); copyCode(); } // Alt + J: Copy as React JSX if (e.altKey && (e.key === 'j' || e.key === 'J')) { e.preventDefault(); copyAsJsx(); } // Alt + N: Switch to Nocturnal Intelligence if (e.altKey && (e.key === 'n' || e.key === 'N')) { e.preventDefault(); switchTab('nocturnal'); } }); // Auto-load Developer Telemetry Deck Demo and initialize resizer on initial boot window.addEventListener('DOMContentLoaded', () => { loadDemo(2); setupCanvasResizer(); });