Add image viewer

src/lib/desktop/windows.svelte.ts

@@ -5,13 +5,30 @@ export interface TerminalWindow {
 	startupCommand: string;
 }
 
+export interface ViewerImage {
+	src: string;
+	alt: string;
+}
+
+export interface ImageViewerWindow {
+	id: string;
+	images: ViewerImage[];
+	currentIndex: number;
+}
+
 class WindowManager {
 	terminals = $state<TerminalWindow[]>([]);
+	imageViewers = $state<ImageViewerWindow[]>([]);
 	focusedId = $state<string>(pageWindowId);
 	maximizedId = $state<string | null>(null);
 	launcherOpen = $state(false);
 
 	private nextTerminalNumber = 1;
+	private nextImageViewerNumber = 1;
+
+	get extraWindowIds(): string[] {
+		return [...this.terminals.map((terminal) => terminal.id), ...this.imageViewers.map((viewer) => viewer.id)];
+	}
 
 	openTerminal(startupCommand = '') {
 		const terminal = { id: `kitty-${this.nextTerminalNumber++}`, startupCommand };
@@ -19,16 +36,23 @@ class WindowManager {
 		this.focus(terminal.id);
 	}
 
-	closeTerminal(id: string) {
+	openImageViewer(images: ViewerImage[], currentIndex: number) {
+		const viewer = { id: `imv-${this.nextImageViewerNumber++}`, images, currentIndex };
+		this.imageViewers.push(viewer);
+		this.focus(viewer.id);
+	}
+
+	closeWindow(id: string) {
 		this.terminals = this.terminals.filter((terminal) => terminal.id !== id);
+		this.imageViewers = this.imageViewers.filter((viewer) => viewer.id !== id);
 		if (this.maximizedId === id) this.maximizedId = null;
-		if (this.focusedId === id) this.focusedId = this.terminals.at(-1)?.id ?? pageWindowId;
+		if (this.focusedId === id) this.focusedId = this.extraWindowIds.at(-1) ?? pageWindowId;
 	}
 
 	closeAllTerminals() {
 		this.terminals = [];
-		this.maximizedId = null;
-		this.focusedId = pageWindowId;
+		if (this.maximizedId?.startsWith('kitty-')) this.maximizedId = null;
+		if (this.focusedId.startsWith('kitty-')) this.focusedId = this.extraWindowIds.at(-1) ?? pageWindowId;
 	}
 
 	focus(id: string) {