diff --git a/arduino-ide-extension/src/browser/style/main.css b/arduino-ide-extension/src/browser/style/main.css index 438277dee..30c654b2a 100644 --- a/arduino-ide-extension/src/browser/style/main.css +++ b/arduino-ide-extension/src/browser/style/main.css @@ -100,6 +100,19 @@ background-color: var(--theia-titleBar-activeBackground); } +#arduino-toolbar-panel { + background: var(--theia-titleBar-activeBackground); + color: var(--theia-titleBar-activeForeground); + display: flex; + min-height: var(--theia-private-menubar-height); + border-bottom: 1px solid var(--theia-titleBar-border); +} +#arduino-toolbar-panel:window-inactive, +#arduino-toolbar-panel:-moz-window-inactive { + background: var(--theia-titleBar-inactiveBackground); + color: var(--theia-titleBar-inactiveForeground); +} + #arduino-toolbar-container { display: flex; width: 100%; diff --git a/arduino-ide-extension/src/browser/theia/core/application-shell.ts b/arduino-ide-extension/src/browser/theia/core/application-shell.ts index 9f0ac6b74..6f61861bc 100644 --- a/arduino-ide-extension/src/browser/theia/core/application-shell.ts +++ b/arduino-ide-extension/src/browser/theia/core/application-shell.ts @@ -7,6 +7,8 @@ import { SHELL_TABBAR_CONTEXT_MENU, TabBar, Widget, + Layout, + SplitPanel, } from '@theia/core/lib/browser'; import { ConnectionStatus, @@ -17,6 +19,11 @@ import { MessageService } from '@theia/core/lib/common/message-service'; import { inject, injectable } from '@theia/core/shared/inversify'; import { ToolbarAwareTabBar } from './tab-bars'; +interface WidgetOptions + extends Omit { + area?: TheiaApplicationShell.Area | 'toolbar'; +} + @injectable() export class ApplicationShell extends TheiaApplicationShell { @inject(MessageService) @@ -24,10 +31,11 @@ export class ApplicationShell extends TheiaApplicationShell { @inject(ConnectionStatusService) private readonly connectionStatusService: ConnectionStatusService; + private toolbarPanel: Panel; override async addWidget( widget: Widget, - options: Readonly = {} + options: Readonly = {} ): Promise { // By default, Theia open a widget **next** to the currently active in the target area. // Instead of this logic, we want to open the new widget after the last of the target area. @@ -37,8 +45,12 @@ export class ApplicationShell extends TheiaApplicationShell { ); return; } + if (options.area === 'toolbar') { + this.toolbarPanel.addWidget(widget); + return; + } + const area = options.area || 'main'; let ref: Widget | undefined = options.ref; - const area: TheiaApplicationShell.Area = options.area || 'main'; if (!ref && (area === 'main' || area === 'bottom')) { const tabBar = this.getTabBarFor(area); if (tabBar) { @@ -48,7 +60,10 @@ export class ApplicationShell extends TheiaApplicationShell { } } } - return super.addWidget(widget, { ...options, ref }); + return super.addWidget(widget, { + ...(options), + ref, + }); } override handleEvent(): boolean { @@ -56,6 +71,46 @@ export class ApplicationShell extends TheiaApplicationShell { return false; } + protected override initializeShell(): void { + this.toolbarPanel = this.createToolbarPanel(); + super.initializeShell(); + } + + private createToolbarPanel(): Panel { + const toolbarPanel = new Panel(); + toolbarPanel.id = 'arduino-toolbar-panel'; + toolbarPanel.show(); + return toolbarPanel; + } + + protected override createLayout(): Layout { + const bottomSplitLayout = this.createSplitLayout( + [this.mainPanel, this.bottomPanel], + [1, 0], + { orientation: 'vertical', spacing: 0 } + ); + const panelForBottomArea = new SplitPanel({ layout: bottomSplitLayout }); + panelForBottomArea.id = 'theia-bottom-split-panel'; + + const leftRightSplitLayout = this.createSplitLayout( + [ + this.leftPanelHandler.container, + panelForBottomArea, + this.rightPanelHandler.container, + ], + [0, 1, 0], + { orientation: 'horizontal', spacing: 0 } + ); + const panelForSideAreas = new SplitPanel({ layout: leftRightSplitLayout }); + panelForSideAreas.id = 'theia-left-right-split-panel'; + + return this.createBoxLayout( + [this.topPanel, this.toolbarPanel, panelForSideAreas, this.statusBar], + [0, 0, 1, 0], + { direction: 'top-to-bottom', spacing: 0 } + ); + } + // Avoid hiding top panel as we use it for arduino toolbar protected override createTopPanel(): Panel { const topPanel = super.createTopPanel(); diff --git a/arduino-ide-extension/src/browser/toolbar/arduino-toolbar-contribution.ts b/arduino-ide-extension/src/browser/toolbar/arduino-toolbar-contribution.ts index 09c125e9a..668f8bed7 100644 --- a/arduino-ide-extension/src/browser/toolbar/arduino-toolbar-contribution.ts +++ b/arduino-ide-extension/src/browser/toolbar/arduino-toolbar-contribution.ts @@ -19,7 +19,8 @@ export class ArduinoToolbarContainer extends Widget { this.toolbars = toolbars; } - override onAfterAttach(msg: Message) { + override onAfterAttach(msg: Message): void { + super.onAfterAttach(msg); for (const toolbar of this.toolbars) { Widget.attach(toolbar, this.node); } @@ -56,9 +57,11 @@ export class ArduinoToolbarContribution ); } - onStart(app: FrontendApplication) { - app.shell.addWidget(this.arduinoToolbarContainer, { - area: 'top', - }); + onStart(app: FrontendApplication): void { + // eslint-disable-next-line @typescript-eslint/no-explicit-any + const options = { + area: 'toolbar', + }; + app.shell.addWidget(this.arduinoToolbarContainer, options); } } diff --git a/arduino-ide-extension/src/electron-browser/theia/core/electron-main-menu-factory.ts b/arduino-ide-extension/src/electron-browser/theia/core/electron-main-menu-factory.ts index bcb313a6f..0435323ed 100644 --- a/arduino-ide-extension/src/electron-browser/theia/core/electron-main-menu-factory.ts +++ b/arduino-ide-extension/src/electron-browser/theia/core/electron-main-menu-factory.ts @@ -5,7 +5,6 @@ import { CommandMenuNode, CompoundMenuNode, CompoundMenuNodeRole, - MAIN_MENU_BAR, MenuNode, MenuPath, } from '@theia/core/lib/common/menu'; @@ -39,18 +38,9 @@ export class ElectronMainMenuFactory extends TheiaElectronMainMenuFactory { }); } - override createElectronMenuBar(): Electron.Menu { + override createElectronMenuBar(): Electron.Menu | null { this._toggledCommands.clear(); // https://github.com/eclipse-theia/theia/issues/8977 - const menuModel = this.menuProvider.getMenu(MAIN_MENU_BAR); - const template = this.fillMenuTemplate([], menuModel, [], { - rootMenuPath: MAIN_MENU_BAR, - }); - if (isOSX) { - template.unshift(this.createOSXMenu()); - } - const menu = remote.Menu.buildFromTemplate(this.escapeAmpersand(template)); - this._menu = menu; - return menu; + return super.createElectronMenuBar(); } override async setMenuBar(): Promise { @@ -61,13 +51,7 @@ export class ElectronMainMenuFactory extends TheiaElectronMainMenuFactory { this.updateWhenReady = true; return; } - await this.preferencesService.ready; - const createdMenuBar = this.createElectronMenuBar(); - if (isOSX) { - remote.Menu.setApplicationMenu(createdMenuBar); - } else { - remote.getCurrentWindow().setMenu(createdMenuBar); - } + return super.setMenuBar(); } override createElectronContextMenu( diff --git a/arduino-ide-extension/src/electron-browser/theia/core/electron-menu-contribution.ts b/arduino-ide-extension/src/electron-browser/theia/core/electron-menu-contribution.ts index 9327637d7..12882356b 100644 --- a/arduino-ide-extension/src/electron-browser/theia/core/electron-menu-contribution.ts +++ b/arduino-ide-extension/src/electron-browser/theia/core/electron-menu-contribution.ts @@ -1,53 +1,38 @@ -import { inject, injectable } from '@theia/core/shared/inversify'; +import { + getCurrentWebContents, + getCurrentWindow, +} from '@theia/core/electron-shared/@electron/remote'; +import { FrontendApplication } from '@theia/core/lib/browser/frontend-application'; +import { KeybindingRegistry } from '@theia/core/lib/browser/keybinding'; +import { PreferenceScope } from '@theia/core/lib/browser/preferences/preference-scope'; import { CommandRegistry } from '@theia/core/lib/common/command'; import { MenuModelRegistry } from '@theia/core/lib/common/menu'; -import { KeybindingRegistry } from '@theia/core/lib/browser/keybinding'; import { - ElectronMenuContribution as TheiaElectronMenuContribution, ElectronCommands, + ElectronMenuContribution as TheiaElectronMenuContribution, } from '@theia/core/lib/electron-browser/menu/electron-menu-contribution'; -import { MainMenuManager } from '../../../common/main-menu-manager'; -import { FrontendApplicationStateService } from '@theia/core/lib/browser/frontend-application-state'; -import { FrontendApplication } from '@theia/core/lib/browser/frontend-application'; import { ZoomLevel } from '@theia/core/lib/electron-browser/window/electron-window-preferences'; -import { PreferenceScope } from '@theia/core/lib/browser/preferences/preference-scope'; -import { - getCurrentWindow, - getCurrentWebContents, -} from '@theia/core/electron-shared/@electron/remote'; +import { injectable } from '@theia/core/shared/inversify'; +import { MainMenuManager } from '../../../common/main-menu-manager'; @injectable() export class ElectronMenuContribution extends TheiaElectronMenuContribution implements MainMenuManager { - @inject(FrontendApplicationStateService) - private readonly appStateService: FrontendApplicationStateService; - - // private appReady = false; - // private updateWhenReady = false; + private app: FrontendApplication; override onStart(app: FrontendApplication): void { + this.app = app; super.onStart(app); - this.appStateService.reachedState('ready').then(() => { - // this.appReady = true; - // if (this.updateWhenReady) { - // this.update(); - // } - }); - } - - protected override hideTopPanel(): void { - // NOOP - // We reuse the `div` for the Arduino toolbar. } update(): void { - // if (this.appReady) { - (this as any).setMenu(); - // } else { - // this.updateWhenReady = true; - // } + // no menu updates before `onStart` + if (!this.app) { + return; + } + this.setMenu(this.app); } override registerCommands(registry: CommandRegistry): void { diff --git a/arduino-ide-extension/src/electron-main/theia/electron-main-application.ts b/arduino-ide-extension/src/electron-main/theia/electron-main-application.ts index 84736969e..034bdd076 100644 --- a/arduino-ide-extension/src/electron-main/theia/electron-main-application.ts +++ b/arduino-ide-extension/src/electron-main/theia/electron-main-application.ts @@ -19,8 +19,13 @@ import { } from '@theia/core/lib/electron-main/electron-main-application'; import { URI } from '@theia/core/shared/vscode-uri'; import { Deferred } from '@theia/core/lib/common/promise-util'; -import * as os from '@theia/core/lib/common/os'; -import { Restart } from '@theia/core/lib/electron-common/messaging/electron-messages'; +import { isOSX } from '@theia/core/lib/common/os'; +import { + RequestTitleBarStyle, + Restart, + TitleBarStyleAtStartup, + TitleBarStyleChanged, +} from '@theia/core/lib/electron-common/messaging/electron-messages'; import { TheiaBrowserWindowOptions } from '@theia/core/lib/electron-main/theia-electron-window'; import { IsTempSketch } from '../../node/is-temp-sketch'; import { @@ -176,7 +181,7 @@ export class ElectronMainApplication extends TheiaElectronMainApplication { private attachFileAssociations(cwd: string): void { // OSX: register open-file event - if (os.isOSX) { + if (isOSX) { app.on('open-file', async (event, path) => { event.preventDefault(); const resolvedPath = await this.resolvePath(path, cwd); @@ -330,10 +335,19 @@ export class ElectronMainApplication extends TheiaElectronMainApplication { } protected override getTitleBarStyle( - // eslint-disable-next-line @typescript-eslint/no-unused-vars - _config: FrontendApplicationConfig + config: FrontendApplicationConfig ): 'native' | 'custom' { - return 'native'; + const storedFrame = this.electronStore.get('windowstate')?.frame; + if (storedFrame !== undefined) { + return !!storedFrame ? 'native' : 'custom'; + } + if (config.preferences && config.preferences['window.titleBarStyle']) { + const titleBarStyle = config.preferences['window.titleBarStyle']; + if (titleBarStyle === 'native' || titleBarStyle === 'custom') { + return titleBarStyle; + } + } + return 'custom'; } protected override hookApplicationEvents(): void { @@ -351,6 +365,21 @@ export class ElectronMainApplication extends TheiaElectronMainApplication { this.delete(sketch); } }); + ipcMain.on(TitleBarStyleChanged, ({ sender }, titleBarStyle: string) => { + this.useNativeWindowFrame = isOSX || titleBarStyle === 'native'; + const browserWindow = BrowserWindow.fromId(sender.id); + if (browserWindow) { + this.saveWindowState(browserWindow); + } else { + console.warn(`no BrowserWindow with id: ${sender.id}`); + } + }); + ipcMain.on(RequestTitleBarStyle, ({ sender }) => { + sender.send( + TitleBarStyleAtStartup, + this.didUseNativeWindowFrameOnStart.get(sender.id) ? 'native' : 'custom' + ); + }); } protected override async onSecondInstance(