diff --git a/app/settings/hooks/useSettingsPage.ts b/app/settings/hooks/useSettingsPage.ts index 21b2f1d..9101507 100644 --- a/app/settings/hooks/useSettingsPage.ts +++ b/app/settings/hooks/useSettingsPage.ts @@ -26,6 +26,7 @@ export function useSettingsPage() { // Display settings const [realtimeLatency, setRealtimeLatency] = useState(false); const [searchDisplayMode, setSearchDisplayMode] = useState('normal'); + const [fullscreenType, setFullscreenType] = useState<'native' | 'window'>('native'); useEffect(() => { const settings = settingsStore.getSettings(); @@ -36,6 +37,7 @@ export function useSettingsPage() { setAccessPasswords(settings.accessPasswords); setRealtimeLatency(settings.realtimeLatency); setSearchDisplayMode(settings.searchDisplayMode); + setFullscreenType(settings.fullscreenType); // Fetch env password status fetch('/api/config') @@ -279,6 +281,15 @@ export function useSettingsPage() { }); }; + const handleFullscreenTypeChange = (type: 'native' | 'window') => { + setFullscreenType(type); + const currentSettings = settingsStore.getSettings(); + settingsStore.saveSettings({ + ...currentSettings, + fullscreenType: type, + }); + }; + const handleRestoreDefaults = () => { const defaults = getDefaultSources(); handleSourcesChange(defaults); @@ -329,5 +340,7 @@ export function useSettingsPage() { handleEditSource, handleRealtimeLatencyChange, handleSearchDisplayModeChange, + fullscreenType, + handleFullscreenTypeChange, }; } diff --git a/app/settings/page.tsx b/app/settings/page.tsx index 353da4c..49b9fbf 100644 --- a/app/settings/page.tsx +++ b/app/settings/page.tsx @@ -10,6 +10,7 @@ import { SortSettings } from '@/components/settings/SortSettings'; import { DataSettings } from '@/components/settings/DataSettings'; import { PasswordSettings } from '@/components/settings/PasswordSettings'; import { DisplaySettings } from '@/components/settings/DisplaySettings'; +import { PlayerSettings } from '@/components/settings/PlayerSettings'; import { SettingsHeader } from '@/components/settings/SettingsHeader'; import { useSettingsPage } from './hooks/useSettingsPage'; @@ -22,6 +23,7 @@ export default function SettingsPage() { envPasswordSet, realtimeLatency, searchDisplayMode, + fullscreenType, isAddModalOpen, isExportModalOpen, isImportModalOpen, @@ -52,6 +54,7 @@ export default function SettingsPage() { setEditingSource, handleRealtimeLatencyChange, handleSearchDisplayModeChange, + handleFullscreenTypeChange, } = useSettingsPage(); return ( @@ -60,6 +63,12 @@ export default function SettingsPage() { {/* Header */} + {/* Player Settings */} + + {/* Password Settings */} isPlaying && setShowControls(false)} > {/* Clipping Wrapper for video and overlays - Restores the 'Liquid Glass' rounded look */} -
+
{/* Video Element */}
); return ( diff --git a/components/settings/DisplaySettings.tsx b/components/settings/DisplaySettings.tsx index 08d1732..143bcfa 100644 --- a/components/settings/DisplaySettings.tsx +++ b/components/settings/DisplaySettings.tsx @@ -52,7 +52,7 @@ export function DisplaySettings({ + +
+
+ + ); +}