Streaming: 30fps Presets entfernt, Dropdown breiter

Qualitaetsstufen: 720p60, 1080p60, 2K60, 4K60, 4K165 Ultra.
Dropdown von 120px auf 160px verbreitert damit Text nicht abgeschnitten wird.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Daniel 2026-03-09 11:42:48 +01:00
parent f27093b87a
commit 10fcde125d
2 changed files with 7 additions and 8 deletions

View file

@ -46,10 +46,9 @@ function formatElapsed(startedAt: string): string {
// ── Quality Presets ──
const QUALITY_PRESETS = [
{ label: '720p30', width: 1280, height: 720, fps: 30, bitrate: 2_500_000 },
{ label: '1080p30', width: 1920, height: 1080, fps: 30, bitrate: 5_000_000 },
{ label: '720p60', width: 1280, height: 720, fps: 60, bitrate: 4_000_000 },
{ label: '1080p60', width: 1920, height: 1080, fps: 60, bitrate: 8_000_000 },
{ label: '1440p60', width: 2560, height: 1440, fps: 60, bitrate: 14_000_000 },
{ label: '2K60', width: 2560, height: 1440, fps: 60, bitrate: 14_000_000 },
{ label: '4K60', width: 3840, height: 2160, fps: 60, bitrate: 25_000_000 },
{ label: '4K165 Ultra', width: 3840, height: 2160, fps: 165, bitrate: 50_000_000 },
] as const;
@ -62,7 +61,7 @@ export default function StreamingTab({ data, isAdmin: isAdminProp = false }: { d
const [userName, setUserName] = useState(() => localStorage.getItem('streaming_name') || '');
const [streamTitle, setStreamTitle] = useState('Screen Share');
const [streamPassword, setStreamPassword] = useState('');
const [qualityIdx, setQualityIdx] = useState(2); // Default: 1080p60
const [qualityIdx, setQualityIdx] = useState(1); // Default: 1080p60
const [error, setError] = useState<string | null>(null);
const [joinModal, setJoinModal] = useState<JoinModal | null>(null);
const [myStreamId, setMyStreamId] = useState<string | null>(null);
@ -98,7 +97,7 @@ export default function StreamingTab({ data, isAdmin: isAdminProp = false }: { d
// Refs that mirror state (avoid stale closures in WS handler)
const isBroadcastingRef = useRef(false);
const viewingRef = useRef<ViewState | null>(null);
const qualityRef = useRef<typeof QUALITY_PRESETS[number]>(QUALITY_PRESETS[2]);
const qualityRef = useRef<typeof QUALITY_PRESETS[number]>(QUALITY_PRESETS[1]);
useEffect(() => { isBroadcastingRef.current = isBroadcasting; }, [isBroadcasting]);
useEffect(() => { viewingRef.current = viewing; }, [viewing]);
useEffect(() => { qualityRef.current = QUALITY_PRESETS[qualityIdx]; }, [qualityIdx]);

View file

@ -412,7 +412,7 @@
}
.stream-select-quality {
width: 120px;
width: 160px;
padding: 10px 14px;
border: 1px solid var(--bg-tertiary);
border-radius: var(--radius);