feat(immersive): add real coverflow with queue navigation

- Rename old CoverflowPanel to StaticPanel (single artwork view)
- Create new CoverflowPanel with actual coverflow effect:
  - Shows 5 album covers (2 prev, current, 2 next)
  - 3D perspective rotation on side covers
  - Click on side covers to navigate queue
  - Smooth animation on track change
- Add 'static' tab to focus mode (4 tabs total)
- Update keyboard shortcuts: 1-4 for focus tabs
This commit is contained in:
vicrodh committed 2026-02-01 08:18:17 -06:00
1 parent 1aa7e9eb3a
commit 9099f94904
4 files changed
+489 -35

No files matched your search

@@ -1,10 +1,10 @@
<script lang="ts">
import { Disc3, Mic2, ListMusic, Music2, Info, Radio, Maximize, Minimize, ChevronDown, X, Square, Copy, Minus } from 'lucide-svelte';
import { Disc3, Mic2, ListMusic, Music2, Info, Radio, Maximize, Minimize, ChevronDown, X, Square, Copy, Minus, Image } from 'lucide-svelte';
import { t } from '$lib/i18n';
import { getCurrentWindow } from '@tauri-apps/api/window';
export type ImmersiveTab = 'lyrics' | 'trackInfo' | 'suggestions' | 'queue';
export type FocusTab = 'coverflow' | 'lyrics-focus' | 'queue-focus';
export type FocusTab = 'coverflow' | 'static' | 'lyrics-focus' | 'queue-focus';
export type ViewMode = 'focus' | 'split';
interface Props {
@@ -85,6 +85,7 @@
// Focus mode tabs
const focusTabs: { id: FocusTab; label: string; icon: typeof Disc3 }[] = [
{ id: 'coverflow', label: 'Coverflow', icon: Disc3 },
{ id: 'static', label: 'Static', icon: Image },
{ id: 'lyrics-focus', label: 'Lyrics', icon: Mic2 },
{ id: 'queue-focus', label: 'Queue', icon: ListMusic },
];