flow-extension/popup.html
type-two 7ae0a73db0 Flow Auto-Pilot: trusted-CDP input driver, local queue server, 91-prompt bank
DOM automation for Google Labs Flow — background worker injects trusted input
via the DevTools Protocol (Flow's editor ignores synthetic events), polls a local
queue, harvests generated asset URLs. Includes the generated game+promo prompt bank.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
2026-07-05 22:44:10 +10:00

89 lines
2.9 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Flow Auto-Pilot</title>
<link rel="stylesheet" href="popup.css">
</head>
<body>
<div class="app-container">
<!-- Header -->
<header class="app-header">
<div class="logo-area">
<span class="logo-icon"></span>
<div class="logo-text">
<h1>Flow Auto-Pilot</h1>
<span class="subtext">Labs FX Integration</span>
</div>
</div>
<div class="status-indicator" id="global-status">
<span class="dot"></span>
<span class="status-label">Idle</span>
</div>
</header>
<!-- Main Control Panel -->
<main class="control-panel">
<!-- Connection Input -->
<div class="form-group">
<label for="server-url">Local Server URL</label>
<div class="input-with-button">
<input type="url" id="server-url" value="http://localhost:8017" placeholder="http://localhost:8017">
</div>
</div>
<!-- Action Button -->
<div class="actions">
<button id="toggle-btn" class="btn btn-primary start-state">Start Automation</button>
</div>
<!-- Console / Activity Logs -->
<div class="console-section">
<div class="console-header">
<span>Activity Log</span>
<button id="clear-logs" class="btn-text">Clear</button>
</div>
<div class="console-body" id="log-console">
<div class="log-entry system-log">[System] Extension loaded. Click Start to begin.</div>
</div>
</div>
<!-- Collapsible Settings -->
<details class="advanced-settings">
<summary>Advanced Selector Adjustments</summary>
<div class="settings-content">
<p class="settings-info">Customize targets if the page layout changes. Leave blank for auto-detection.</p>
<div class="form-group">
<label for="sel-prompt">Prompt Input Selector</label>
<input type="text" id="sel-prompt" placeholder="Auto-detect (textarea / editable div)">
</div>
<div class="form-group">
<label for="sel-generate">Submit Button Selector</label>
<input type="text" id="sel-generate" placeholder="Auto-detect (→ arrow / send)">
</div>
<div class="form-group">
<label for="sel-model">Results / Media Selector</label>
<input type="text" id="sel-model" placeholder="Auto-detect (media library container)">
</div>
<div class="form-group">
<label for="poll-interval">Polling Interval (ms)</label>
<input type="number" id="poll-interval" value="4000" min="1000" step="500">
</div>
</div>
</details>
</main>
<!-- Footer -->
<footer class="app-footer">
<span>Active Tab Automation</span>
<span class="version">v1.0.0</span>
</footer>
</div>
<script src="popup.js"></script>
</body>
</html>