first working commit just flipped

This commit is contained in:
Marco Mooren
2025-11-04 18:30:55 +01:00
commit ca6e2475fd
15 changed files with 6238 additions and 0 deletions

77
index.html Normal file
View File

@@ -0,0 +1,77 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>EveretPTZ Live Production UI</title>
</head>
<body>
<div id="app">
<!-- Configuration Section -->
<div class="config-section" id="config-section">
<div class="config-content">
<h2>Camera Configuration</h2>
<div class="config-row">
<label for="camera-count">Number of Cameras:</label>
<input type="number" id="camera-count" min="1" max="12" value="3" class="config-input">
</div>
<div class="config-buttons">
<button class="config-btn primary" id="apply-config">Apply Configuration</button>
<button class="config-btn secondary" id="reset-config">🗑️ Reset All Settings</button>
</div>
<div class="config-info" id="config-info" style="display: none;">
<p>✅ Configuration loaded from previous session</p>
</div>
</div>
</div>
<header class="header" id="main-header" style="display: none;">
<div class="header-left">
<h1>EveretPTZ Live Production</h1>
<div class="status-indicators" id="status-indicators">
<!-- Status indicators will be generated dynamically -->
</div>
</div>
<div class="global-controls">
<button class="global-enable-btn" id="global-enable">🔴 ALL OFF</button>
<div class="set-to-container">
<button class="set-all-btn" id="set-all-settings">📋 SET TO</button>
<div class="camera-selector" id="camera-selector">
<!-- Camera checkboxes will be generated dynamically -->
</div>
</div>
<button class="set-all-btn" id="restore-connections" style="display: none;">🔄 RESTORE</button>
</div>
</header>
<main class="main-content" id="main-content" style="display: none;">
<!-- PTZ Controllers Section -->
<div class="ptz-controllers" id="ptz-controllers">
<!-- PTZ controllers will be generated dynamically -->
</div>
<!-- Global Settings Panel -->
<div class="global-settings-panel" id="global-settings-panel">
<div class="settings-header">
<h2>Camera Settings</h2>
</div>
<!-- Camera Selection Tabs -->
<div class="camera-tabs" id="camera-tabs">
<!-- Tabs will be generated dynamically -->
</div>
<!-- Settings Content for All Cameras -->
<div class="settings-content" id="settings-content">
<!-- Settings will be generated dynamically -->
</div>
</div>
</main>
</div>
<script type="module" src="/src/main.ts"></script>
</body>
</html>