Live portal: Go Live — browser window capture published over WHIP as <user>/HelmetCam-<date>; dumpd /me/stream-key
Go Live closes viewer windows, fetches the Authentik-identified user's MediaMTX key from dumpd (/etc/vanguard/streamers.json written by configure.py), opens Chrome's window-only picker with audio, prefers H.264 so MediaMTX can record, caps at 12 Mbps / 1440p60, shows live stats, Stop. Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
This commit is contained in:
@@ -30,3 +30,26 @@ html, body, #root { height:100%; margin:0; background:var(--bg); color:var(--fg)
|
||||
.player.focused .bar { background:#1c2333; }
|
||||
.empty { flex:1; display:flex; align-items:center; justify-content:center; flex-direction:column; gap:8px; color:var(--mut); }
|
||||
.empty h2 { color:var(--fg); margin:0; font-size:20px; }
|
||||
|
||||
/* --- Go Live --------------------------------------------------------------------------------- */
|
||||
.golive { flex:1; display:flex; flex-direction:column; min-height:0; }
|
||||
.golive-head { display:flex; align-items:center; gap:12px; padding:10px 14px; background:#101010; border-bottom:1px solid #2a2a2a; }
|
||||
.golive-head h2 { margin:0; font-size:16px; }
|
||||
.golive-head .who { color:var(--mut); }
|
||||
.golive-head .spacer { flex:1; }
|
||||
.golive-head button, .golive-form button { background:#2a2a2a; color:var(--fg); border:1px solid #3a3a3a; border-radius:6px; padding:8px 14px; cursor:pointer; font-size:14px; }
|
||||
.golive-head button.danger { background:var(--live); border-color:var(--live); color:#fff; font-weight:600; }
|
||||
.golive-form button.primary { background:var(--acc); border-color:var(--acc); color:#fff; font-weight:600; width:100%; padding:12px; margin-top:8px; }
|
||||
.golive-form button:disabled { opacity:.5; cursor:default; }
|
||||
.golive-body { flex:1; position:relative; display:flex; align-items:center; justify-content:center; min-height:0; background:#000; }
|
||||
.golive-body video { display:none; width:100%; height:100%; object-fit:contain; }
|
||||
.golive-body video.show { display:block; }
|
||||
.golive-form { position:absolute; width:min(520px, calc(100% - 32px)); background:var(--panel); border:1px solid #3a3a3a; border-radius:12px; padding:22px; display:grid; gap:10px; }
|
||||
.golive-form label { color:var(--mut); font-size:13px; }
|
||||
.golive-form input { padding:10px 12px; font-size:15px; background:#141414; color:var(--fg); border:1px solid #444; border-radius:8px; }
|
||||
.golive-form .hint { color:var(--mut); font-size:13px; line-height:1.5; }
|
||||
.golive-form .err { color:var(--live); font-size:13px; }
|
||||
.golive-stats { position:absolute; left:12px; bottom:12px; display:flex; gap:14px; align-items:center; background:rgba(0,0,0,.65); padding:8px 12px; border-radius:8px; font-size:13px; }
|
||||
.golive-stats .pill.live { background:var(--live); color:#fff; font-weight:700; font-size:11px; padding:2px 6px; border-radius:4px; }
|
||||
.golive-stats .warn { color:#f1c40f; }
|
||||
.topbar button.golive-btn { background:var(--live); border-color:var(--live); color:#fff; font-weight:700; }
|
||||
|
||||
Reference in New Issue
Block a user