Exit fullscreen when leaving immersive mode, add maximize button

- Exit fullscreen automatically when closing immersive view
- Add maximize (window) button separate from fullscreen
- Button order: Fullscreen | Maximize | Exit Immersive | Close App
This commit is contained in:
vicrodh committed 2026-02-01 07:30:03 -06:00
1 parent 9502ca9013
commit 730ce323c4
2 files changed
+35 -4

No files matched your search

@@ -1,5 +1,5 @@
<script lang="ts">
import { Disc3, LayoutGrid, Mic2, ListMusic, Music2, Info, Radio, Maximize, Minimize, ChevronDown, X } from 'lucide-svelte';
import { Disc3, LayoutGrid, Mic2, ListMusic, Music2, Info, Radio, Maximize, Minimize, ChevronDown, X, Square } from 'lucide-svelte';
import { t } from '$lib/i18n';
import { getCurrentWindow } from '@tauri-apps/api/window';
@@ -19,6 +19,7 @@
hasSuggestions?: boolean;
isFullscreen?: boolean;
onToggleFullscreen?: () => void;
onToggleMaximize?: () => void;
}
let {
@@ -33,7 +34,8 @@
hasTrackInfo = true,
hasSuggestions = true,
isFullscreen = false,
onToggleFullscreen
onToggleFullscreen,
onToggleMaximize
}: Props = $props();
// Expandable window controls state
@@ -139,6 +141,13 @@
<Maximize size={16} />
{/if}
</button>
<button
class="window-btn"
onclick={onToggleMaximize}
title="Maximize Window"
>
<Square size={14} />
</button>
<button
class="window-btn"
onclick={onClose}
@@ -325,7 +334,7 @@
}
.window-controls.expanded .expanded-buttons {
max-width: 120px;
max-width: 160px;
opacity: 1;
margin-right: 4px;
}
@@ -137,6 +137,27 @@
isFullscreen = await window.isFullscreen();
}
// Exit immersive and fullscreen
async function handleExitImmersive() {
if (isFullscreen) {
const window = getCurrentWindow();
await window.setFullscreen(false);
isFullscreen = false;
}
onClose();
}
// Toggle maximize (not fullscreen)
async function toggleMaximize() {
const window = getCurrentWindow();
const maximized = await window.isMaximized();
if (maximized) {
await window.unmaximize();
} else {
await window.maximize();
}
}
// Auto-hide UI after inactivity
function resetHideTimer() {
showUI = true;
@@ -253,13 +274,14 @@
{displayMode}
onTabChange={(tab) => activeTab = tab}
onDisplayModeChange={(mode) => displayMode = mode}
{onClose}
onClose={handleExitImmersive}
visible={showUI}
hasLyrics={true}
hasTrackInfo={enableCredits}
hasSuggestions={enableSuggestions}
{isFullscreen}
onToggleFullscreen={toggleFullscreen}
onToggleMaximize={toggleMaximize}
/>
<!-- Content based on display mode -->