diff --git a/desktop/app/main.ts b/desktop/app/main.ts index a678cfb80..f5b783f33 100644 --- a/desktop/app/main.ts +++ b/desktop/app/main.ts @@ -501,6 +501,14 @@ try { return true }) + ipcMain.handle('WINDOW.FULLSCREEN', (event, enabled?: boolean) => { + const window = findWindowById(event.sender.id)?.window + if (!window) return false + const flag = enabled ?? !window.isFullScreen() + window.setFullScreen(flag) + return flag + }) + ipcMain.handle('WINDOW.CLOSE', (event, data: CloseWindow) => { if (data.id) { for (const [key, value] of browserWindows) { diff --git a/desktop/src/app/app.component.html b/desktop/src/app/app.component.html index fef76d594..d6c47560e 100644 --- a/desktop/src/app/app.component.html +++ b/desktop/src/app/app.component.html @@ -1,4 +1,4 @@ -
{{ title }}
diff --git a/desktop/src/app/app.component.ts b/desktop/src/app/app.component.ts index 0ece200c6..a9058300f 100644 --- a/desktop/src/app/app.component.ts +++ b/desktop/src/app/app.component.ts @@ -22,6 +22,7 @@ export class AppComponent implements AfterViewInit { subTitle? = '' backgroundColor = '#212121' topMenu: ExtendedMenuItem[] = [] + showTopBar = true get title() { return this.windowTitle.getTitle() diff --git a/desktop/src/app/image/image.component.ts b/desktop/src/app/image/image.component.ts index df4ae01af..a59f5864b 100644 --- a/desktop/src/app/image/image.component.ts +++ b/desktop/src/app/image/image.component.ts @@ -446,6 +446,11 @@ export class ImageComponent implements AfterViewInit, OnDestroy { ) { app.title = 'Image' + app.topMenu.push({ + icon: 'mdi mdi-fullscreen', + command: () => this.enterFullscreen(), + }) + this.stretchShadow.subscribe(value => { this.stretch.shadow = value / 65536 }) @@ -490,6 +495,7 @@ export class ImageComponent implements AfterViewInit, OnDestroy { hotkeys('ctrl+-', (event) => { event.preventDefault(); this.zoomOut() }) hotkeys('ctrl+=', (event) => { event.preventDefault(); this.zoomIn() }) hotkeys('ctrl+0', (event) => { event.preventDefault(); this.resetZoom() }) + hotkeys('escape', (event) => { if (!this.app.showTopBar) { event.preventDefault(); this.exitFullscreen() } }) this.loadPreference() } @@ -837,6 +843,14 @@ export class ImageComponent implements AfterViewInit, OnDestroy { this.panZoom.smoothZoomAbs(window.innerWidth / 2, window.innerHeight / 2, 1.0) } + async enterFullscreen() { + this.app.showTopBar = !await this.electron.fullscreenWindow(true) + } + + async exitFullscreen() { + this.app.showTopBar = !await this.electron.fullscreenWindow(false) + } + private async retrieveCoordinateInterpolation() { const coordinate = await this.api.coordinateInterpolation(this.imageData.path!) diff --git a/desktop/src/shared/services/electron.service.ts b/desktop/src/shared/services/electron.service.ts index a77720a28..1d8a7c560 100644 --- a/desktop/src/shared/services/electron.service.ts +++ b/desktop/src/shared/services/electron.service.ts @@ -199,6 +199,10 @@ export class ElectronService { this.send('WINDOW.MAXIMIZE') } + fullscreenWindow(enabled?: boolean): Promise { + return this.send('WINDOW.FULLSCREEN', enabled) + } + closeWindow(data: CloseWindow) { return this.send('WINDOW.CLOSE', data) } diff --git a/desktop/src/shared/types/app.types.ts b/desktop/src/shared/types/app.types.ts index 0bbcc07bf..6a76b99e1 100644 --- a/desktop/src/shared/types/app.types.ts +++ b/desktop/src/shared/types/app.types.ts @@ -24,7 +24,7 @@ export const INTERNAL_EVENT_TYPES = [ 'DIRECTORY.OPEN', 'FILE.OPEN', 'FILE.SAVE', 'WINDOW.OPEN', 'WINDOW.CLOSE', 'WINDOW.PIN', 'WINDOW.UNPIN', 'WINDOW.MINIMIZE', 'WINDOW.MAXIMIZE', 'WINDOW.RESIZE', 'WHEEL.RENAMED', 'LOCATION.CHANGED', 'JSON.WRITE', 'JSON.READ', - 'CALIBRATION.CHANGED' + 'CALIBRATION.CHANGED', 'WINDOW.FULLSCREEN' ] as const export type InternalEventType = (typeof INTERNAL_EVENT_TYPES)[number]