title - first cut of no more css madness

src/vs/workbench/browser/layout.ts

@@ -9,7 +9,7 @@ import { Part } from 'vs/workbench/browser/part';
 import { QuickOpenController } from 'vs/workbench/browser/parts/quickopen/quickOpenController';
 import { Sash, ISashEvent, IVerticalSashLayoutProvider, IHorizontalSashLayoutProvider, Orientation } from 'vs/base/browser/ui/sash/sash';
 import { IWorkbenchEditorService } from 'vs/workbench/services/editor/common/editorService';
-import { IPartService, Position, ILayoutOptions } from 'vs/workbench/services/part/common/partService';
+import { IPartService, Position, ILayoutOptions, Parts } from 'vs/workbench/services/part/common/partService';
 import { IViewletService } from 'vs/workbench/services/viewlet/common/viewletService';
 import { IStorageService, StorageScope } from 'vs/platform/storage/common/storage';
 import { IContextViewService } from 'vs/platform/contextview/browser/contextView';
@@ -29,7 +29,7 @@ const HIDE_SIDEBAR_WIDTH_THRESHOLD = 50;
 const HIDE_PANEL_HEIGHT_THRESHOLD = 50;
 
 interface ComputedStyles {
-	titlebar: { height: number; display: string; };
+	titlebar: { height: number; };
 	activitybar: { width: number; };
 	sidebar: { minWidth: number; };
 	panel: { minHeight: number; };
@@ -295,8 +295,7 @@ export class WorkbenchLayout implements IVerticalSashLayoutProvider, IHorizontal
 		// Determine styles by looking into their CSS
 		this.computedStyles = {
 			titlebar: {
-				height: parseInt(titlebarStyle.getPropertyValue('height'), 10),
-				display: titlebarStyle.getPropertyValue('display')
+				height: parseInt(titlebarStyle.getPropertyValue('height'), 10)
 			},
 			activitybar: {
 				width: parseInt(activitybarStyle.getPropertyValue('width'), 10)
@@ -336,10 +335,11 @@ export class WorkbenchLayout implements IVerticalSashLayoutProvider, IHorizontal
 
 		this.workbenchSize = this.getWorkbenchArea();
 
-		const isSidebarHidden = this.partService.isSideBarHidden();
-		const isPanelHidden = this.partService.isPanelHidden();
+		const isTitlebarHidden = !this.partService.isVisible(Parts.TITLEBAR_PART);
+		const isPanelHidden = !this.partService.isVisible(Parts.PANEL_PART);
+		const isStatusbarHidden = !this.partService.isVisible(Parts.STATUSBAR_PART);
+		const isSidebarHidden = !this.partService.isVisible(Parts.SIDEBAR_PART);
 		const sidebarPosition = this.partService.getSideBarPosition();
-		const isStatusbarHidden = this.partService.isStatusBarHidden();
 
 		// Sidebar
 		let sidebarWidth: number;
@@ -353,12 +353,7 @@ export class WorkbenchLayout implements IVerticalSashLayoutProvider, IHorizontal
 		}
 
 		this.statusbarHeight = isStatusbarHidden ? 0 : this.computedStyles.statusbar.height;
-
-		if (this.computedStyles.titlebar.display === 'none') {
-			this.titlebarHeight = 0; // custom title bar is hidden
-		} else {
-			this.titlebarHeight = this.initialComputedStyles.titlebar.height / getZoomFactor(); // adjust for zoom prevention
-		}
+		this.titlebarHeight = isTitlebarHidden ? 0 : this.initialComputedStyles.titlebar.height / getZoomFactor(); // adjust for zoom prevention
 
 		this.sidebarHeight = this.workbenchSize.height - this.statusbarHeight - this.titlebarHeight;
 		let sidebarSize = new Dimension(sidebarWidth, this.sidebarHeight);
@@ -460,6 +455,13 @@ export class WorkbenchLayout implements IVerticalSashLayoutProvider, IHorizontal
 			workbenchContainer.scrollLeft = 0;
 		}
 
+		// Title Part
+		if (isTitlebarHidden) {
+			this.titlebar.getContainer().hide();
+		} else {
+			this.titlebar.getContainer().show();
+		}
+
 		// Editor Part and Panel part
 		this.editor.getContainer().size(editorSize.width, editorSize.height);
 		this.panel.getContainer().size(panelDimension.width, panelDimension.height);
@@ -497,6 +499,11 @@ export class WorkbenchLayout implements IVerticalSashLayoutProvider, IHorizontal
 
 		// Statusbar Part
 		this.statusbar.getContainer().position(this.workbenchSize.height - this.statusbarHeight);
+		if (isStatusbarHidden) {
+			this.statusbar.getContainer().hide();
+		} else {
+			this.statusbar.getContainer().show();
+		}
 
 		// Quick open
 		this.quickopen.layout(this.workbenchSize);

src/vs/workbench/browser/parts/titlebar/media/titlebarpart.css

@@ -16,17 +16,8 @@
 	-webkit-user-select: none;
 	-webkit-app-region: drag;
 	zoom: 1; /* prevent zooming */
-}
-
-.monaco-workbench > .part.titlebar,
-.titlebar-style-custom .monaco-workbench.fullscreen > .part.titlebar {
-	height: 0; /* needs extra class to be enabled (also disabled in fullscreen mode) */
-	display: none;
-}
-
-.titlebar-style-custom .monaco-workbench > .part.titlebar {
-	height: 22px;
 	line-height: 22px;
+	height: 22px;
 	display: flex;
 }
 

src/vs/workbench/electron-browser/integration.ts

@@ -141,22 +141,12 @@ export class ElectronIntegration {
 		ipc.on('vscode:enterFullScreen', (event) => {
 			this.partService.joinCreation().then(() => {
 				browser.setFullscreen(true);
-				this.partService.addClass('fullscreen');
-
-				if (!this.partService.isTitleBarHidden()) {
-					this.partService.layout({ forceStyleRecompute: true }); // handle title bar when fullscreen changes
-				}
 			});
 		});
 
 		ipc.on('vscode:leaveFullScreen', (event) => {
 			this.partService.joinCreation().then(() => {
 				browser.setFullscreen(false);
-				this.partService.removeClass('fullscreen');
-
-				if (!this.partService.isTitleBarHidden()) {
-					this.partService.layout({ forceStyleRecompute: true }); // handle title bar when fullscreen changes
-				}
 			});
 		});
 

src/vs/workbench/electron-browser/workbench.ts

@@ -13,6 +13,7 @@ import strings = require('vs/base/common/strings');
 import DOM = require('vs/base/browser/dom');
 import { Builder, $ } from 'vs/base/browser/builder';
 import { Delayer } from 'vs/base/common/async';
+import * as browser from 'vs/base/browser/browser';
 import assert = require('vs/base/common/assert');
 import timer = require('vs/base/common/timer');
 import errors = require('vs/base/common/errors');
@@ -529,7 +530,7 @@ export class Workbench implements IPartService {
 	public isVisible(part: Parts): boolean {
 		switch (part) {
 			case Parts.TITLEBAR_PART:
-				return this.isTitleBarHidden();
+				return !this.isTitleBarHidden();
 			case Parts.SIDEBAR_PART:
 				return !this.sideBarHidden;
 			case Parts.PANEL_PART:
@@ -542,18 +543,28 @@ export class Workbench implements IPartService {
 	}
 
 	public isTitleBarHidden(): boolean {
+		return !this.getCustomTitleBarStyle() || browser.isFullscreen();
+	}
+
+	private getCustomTitleBarStyle(): string {
 		if (!isMacintosh) {
-			return true; // custom title bar is only supported on Mac currently
+			return null; // custom title bar is only supported on Mac currently
 		}
 
 		const isDev = !this.environmentService.isBuilt || this.environmentService.extensionDevelopmentPath;
 		if (isDev) {
-			return true; // not enabled when developing due to https://github.com/electron/electron/issues/3647
+			return null; // not enabled when developing due to https://github.com/electron/electron/issues/3647
 		}
 
 		const windowConfig = this.configurationService.getConfiguration<IWindowConfiguration>();
 
-		return (windowConfig && windowConfig.window && windowConfig.window.titleBarStyle === 'native');
+		const style = windowConfig && windowConfig.window && windowConfig.window.titleBarStyle;
+
+		if (style === 'custom') {
+			return style;
+		}
+
+		return null;
 	}
 
 	public isStatusBarHidden(): boolean {
@@ -725,6 +736,31 @@ export class Workbench implements IPartService {
 
 		// Configuration changes
 		this.toDispose.push(this.configurationService.onDidUpdateConfiguration(() => this.onDidUpdateConfiguration()));
+
+		// Fullscreen changes
+		this.toDispose.push(browser.onDidChangeFullscreen(() => this.onFullscreenChanged()));
+	}
+
+	private onFullscreenChanged(): void {
+		if (!this.isCreated) {
+			return; // we need to be ready
+		}
+
+		const isFullscreen = browser.isFullscreen();
+		const hasCustomTitle = !!this.getCustomTitleBarStyle();
+		if (isFullscreen) {
+			this.addClass('fullscreen');
+
+			if (hasCustomTitle) {
+				this.layout({ forceStyleRecompute: true }); // handle title bar when fullscreen changes
+			}
+		} else {
+			this.removeClass('fullscreen');
+
+			if (hasCustomTitle) {
+				this.layout({ forceStyleRecompute: true }); // handle title bar when fullscreen changes
+			}
+		}
 	}
 
 	private onEditorsChanged(): void {
@@ -797,8 +833,14 @@ export class Workbench implements IPartService {
 		}
 
 		// Apply title style if shown
-		if (!this.isTitleBarHidden()) {
-			DOM.addClass(this.parent, 'titlebar-style-custom');
+		const titleStyle = this.getCustomTitleBarStyle();
+		if (titleStyle) {
+			DOM.addClass(this.parent, `titlebar-style-${titleStyle}`);
+		}
+
+		// Apply fullscreen state
+		if (browser.isFullscreen()) {
+			this.workbench.addClass('fullscreen');
 		}
 
 		// Create Parts

src/vs/workbench/services/part/common/partService.ts

@@ -62,7 +62,7 @@ export interface IPartService {
 	isVisible(part: Parts): boolean;
 
 	/**
-	 * Returns iff the titlebar part is currently hidden or not.
+	 * Returns iff the custom titlebar part is visible.
 	 */
 	isTitleBarHidden(): boolean;