Skip to content

Commit

Permalink
fix: should use fullscreen to control where to place macos window con…
Browse files Browse the repository at this point in the history
…trols (#6351)
  • Loading branch information
pengx17 committed Mar 28, 2024
1 parent 4e7652f commit e53744b
Show file tree
Hide file tree
Showing 7 changed files with 51 additions and 14 deletions.
5 changes: 5 additions & 0 deletions packages/frontend/core/src/bootstrap/setup.ts
Original file line number Diff line number Diff line change
Expand Up @@ -60,8 +60,13 @@ export function setup() {
const handleMaximized = (maximized: boolean | undefined) => {
document.documentElement.dataset.maximized = String(maximized);
};
const handleFullscreen = (fullscreen: boolean | undefined) => {
document.documentElement.dataset.fullscreen = String(fullscreen);
};
apis?.ui.isMaximized().then(handleMaximized).catch(console.error);
apis?.ui.isFullScreen().then(handleFullscreen).catch(console.error);
events?.ui.onMaximized(handleMaximized);
events?.ui.onFullScreen(handleFullscreen);

const handleResize = debounce(() => {
apis?.ui.handleWindowResize().catch(console.error);
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -45,7 +45,7 @@ export const navHeaderStyle = style({
});

globalStyle(
`html[data-maximized="false"]
`html[data-fullscreen="false"]
${navHeaderStyle}[data-is-macos-electron="true"]`,
{
paddingLeft: '90px',
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -2,17 +2,34 @@ import { apis, events } from '@affine/electron-api';
import { useAtomValue } from 'jotai';
import { atomWithObservable } from 'jotai/utils';
import { useCallback } from 'react';
import { Observable } from 'rxjs';
import { combineLatest, map, Observable } from 'rxjs';

import * as style from './style.css';

const maximizedAtom = atomWithObservable(() => {
return new Observable<boolean>(subscriber => {
subscriber.next(false);
return events?.ui.onMaximized(maximized => {
return subscriber.next(maximized);
const maximized$ = new Observable<boolean>(subscriber => {
subscriber.next(false);
if (events) {
return events.ui.onMaximized(res => {
subscriber.next(res);
});
}
return () => {};
});

const fullscreen$ = new Observable<boolean>(subscriber => {
subscriber.next(false);
if (events) {
return events.ui.onFullScreen(res => {
subscriber.next(res);
});
});
}
return () => {};
});

const maximizedAtom = atomWithObservable(() => {
return combineLatest([maximized$, fullscreen$]).pipe(
map(([maximized, fullscreen]) => maximized || fullscreen)
);
});

const minimizeSVG = (
Expand Down
16 changes: 10 additions & 6 deletions packages/frontend/electron/src/main/main-window.ts
Original file line number Diff line number Diff line change
Expand Up @@ -104,9 +104,8 @@ async function createWindow(additionalArguments: string[]) {

logger.info('main window is ready to show');

if (browserWindow.isMaximized() || browserWindow.isFullScreen()) {
uiSubjects.onMaximized$.next(true);
}
uiSubjects.onMaximized$.next(browserWindow.isMaximized());
uiSubjects.onFullScreen$.next(browserWindow.isFullScreen());

handleWebContentsResize().catch(logger.error);
});
Expand Down Expand Up @@ -143,19 +142,24 @@ async function createWindow(additionalArguments: string[]) {
browserWindow.setSize(size[0], size[1]);
});
uiSubjects.onMaximized$.next(false);
uiSubjects.onFullScreen$.next(false);
});

browserWindow.on('maximize', () => {
uiSubjects.onMaximized$.next(true);
});

browserWindow.on('unmaximize', () => {
uiSubjects.onMaximized$.next(false);
});

// full-screen == maximized in UI on windows
browserWindow.on('enter-full-screen', () => {
uiSubjects.onMaximized$.next(true);
uiSubjects.onFullScreen$.next(true);
});

browserWindow.on('unmaximize', () => {
uiSubjects.onMaximized$.next(false);
browserWindow.on('leave-full-screen', () => {
uiSubjects.onFullScreen$.next(false);
});

/**
Expand Down
6 changes: 6 additions & 0 deletions packages/frontend/electron/src/main/ui/events.ts
Original file line number Diff line number Diff line change
Expand Up @@ -11,4 +11,10 @@ export const uiEvents = {
sub.unsubscribe();
};
},
onFullScreen: (fn: (fullScreen: boolean) => void) => {
const sub = uiSubjects.onFullScreen$.subscribe(fn);
return () => {
sub.unsubscribe();
};
},
} satisfies Record<string, MainEventRegister>;
4 changes: 4 additions & 0 deletions packages/frontend/electron/src/main/ui/handlers.ts
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,10 @@ export const uiHandlers = {
const window = await getMainWindow();
return window?.isMaximized();
},
isFullScreen: async () => {
const window = await getMainWindow();
return window?.isFullScreen();
},
handleThemeChange: async (_, theme: (typeof nativeTheme)['themeSource']) => {
nativeTheme.themeSource = theme;
},
Expand Down
1 change: 1 addition & 0 deletions packages/frontend/electron/src/main/ui/subject.ts
Original file line number Diff line number Diff line change
Expand Up @@ -2,4 +2,5 @@ import { Subject } from 'rxjs';

export const uiSubjects = {
onMaximized$: new Subject<boolean>(),
onFullScreen$: new Subject<boolean>(),
};

0 comments on commit e53744b

Please sign in to comment.