Timsupport/camera
0
1<!DOCTYPE html>2<html lang="id">3<head>4 <meta charset="UTF-8">5 <meta name="viewport" content="width=device-width, initial-scale=1.0">6 <title>📸 Camera Stream</title>7 <link rel="icon" href="data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 100 100%22><text y=%22.9em%22 font-size=%2290%22>📸</text></svg>">8 <style>9 * { box-sizing: border-box; margin: 0; padding: 0; }10 body {11 font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;12 background: #0f0f1a;13 color: #e8e8f0;14 min-height: 100dvh;15 display: flex;16 flex-direction: column;17 align-items: center;18 justify-content: center;19 padding: 20px;20 }21 .card {22 background: rgba(30, 30, 50, 0.7);23 backdrop-filter: blur(10px);24 border: 1px solid rgba(255,255,255,0.1);25 border-radius: 16px;26 padding: 30px;27 max-width: 400px;28 width: 100%;29 text-align: center;30 }31 h1 { font-size: 1.5rem; margin-bottom: 8px; }32 .subtitle { color: #8888aa; font-size: 0.9rem; margin-bottom: 24px; }33 .btn {34 display: block;35 width: 100%;36 padding: 14px;37 margin: 10px 0;38 border: none;39 border-radius: 10px;40 font-size: 1rem;41 font-weight: 600;42 cursor: pointer;43 text-decoration: none;44 text-align: center;45 transition: all 0.2s;46 }47 .btn:active { transform: scale(0.97); }48 .btn-primary {49 background: linear-gradient(135deg, #6c5ce7, #a29bfe);50 color: white;51 }52 .btn-secondary {53 background: rgba(255,255,255,0.1);54 color: #e8e8f0;55 border: 1px solid rgba(255,255,255,0.1);56 }57 </style>58</head>59<body>60 <div class="card">61 <h1>📸 Camera Stream v4</h1>62 <p class="subtitle">Multi-camera live monitoring with room codes</p>63 <a href="/index.html" class="btn btn-primary">📷 Camera Device</a>64 <a href="/viewer.html" class="btn btn-secondary">🎬 Admin Monitor</a>65 <p style="margin-top:16px;font-size:0.8rem;color:#8888aa;">66 Device buka kamera → pilih/generate room code → broadcast.<br>67 Admin buka dashboard → join room → lihat stream.68 </p>69 </div>70</body>71</html>72