better editor layout management (fixes #14105)

src/vs/code/electron-main/menus.ts

@@ -31,9 +31,6 @@ interface IConfiguration extends IFilesConfiguration {
 		},
 		statusBar: {
 			visible: boolean;
-		},
-		editor: {
-			sideBySideLayout: 'vertical' | 'horizontal'
 		}
 	};
 }
@@ -46,7 +43,6 @@ export class VSCodeMenu {
 
 	private currentAutoSaveSetting: string;
 	private currentSidebarLocation: 'left' | 'right';
-	private currentEditorLayout: 'vertical' | 'horizontal';
 	private currentStatusbarVisible: boolean;
 
 	private isQuitting: boolean;
@@ -155,12 +151,6 @@ export class VSCodeMenu {
 				this.currentStatusbarVisible = newStatusbarVisible;
 				updateMenu = true;
 			}
-
-			const newEditorLayout = config.workbench.editor && config.workbench.editor.sideBySideLayout || 'vertical';
-			if (newEditorLayout !== this.currentEditorLayout) {
-				this.currentEditorLayout = newEditorLayout;
-				updateMenu = true;
-			}
 		}
 
 		if (handleMenu && updateMenu) {
@@ -531,15 +521,7 @@ export class VSCodeMenu {
 		const fullscreen = new MenuItem({ label: mnemonicLabel(nls.localize({ key: 'miToggleFullScreen', comment: ['&& denotes a mnemonic'] }, "Toggle &&Full Screen")), accelerator: this.getAccelerator('workbench.action.toggleFullScreen'), click: () => this.windowsService.getLastActiveWindow().toggleFullScreen(), enabled: this.windowsService.getWindowCount() > 0 });
 		const toggleMenuBar = this.createMenuItem(nls.localize({ key: 'miToggleMenuBar', comment: ['&& denotes a mnemonic'] }, "Toggle Menu &&Bar"), 'workbench.action.toggleMenuBar');
 		const splitEditor = this.createMenuItem(nls.localize({ key: 'miSplitEditor', comment: ['&& denotes a mnemonic'] }, "Split &&Editor"), 'workbench.action.splitEditor');
-
-		let editorLayoutLabel: string;
-		if (this.currentEditorLayout !== 'horizontal') {
-			editorLayoutLabel = nls.localize({ key: 'miHorizontalEditorLayout', comment: ['&& denotes a mnemonic'] }, "Horizontal Editor &&Layout");
-		} else {
-			editorLayoutLabel = nls.localize({ key: 'miVerticalEditorLayout', comment: ['&& denotes a mnemonic'] }, "Vertical Editor &&Layout");
-		}
-		const toggleEditorLayout = this.createMenuItem(editorLayoutLabel, 'workbench.action.toggleEditorLayout');
-
+		const toggleEditorLayout = this.createMenuItem(nls.localize({ key: 'miToggleEditorLayout', comment: ['&& denotes a mnemonic'] }, "Toggle Editor Group &&Layout"), 'workbench.action.toggleEditorGroupLayout');
 		const toggleSidebar = this.createMenuItem(nls.localize({ key: 'miToggleSidebar', comment: ['&& denotes a mnemonic'] }, "&&Toggle Side Bar"), 'workbench.action.toggleSidebarVisibility');
 
 		let moveSideBarLabel: string;

src/vs/test/utils/servicesTestUtils.ts

@@ -30,7 +30,7 @@ import { ILifecycleService, ShutdownEvent } from 'vs/platform/lifecycle/common/l
 import { EditorStacksModel } from 'vs/workbench/common/editor/editorStacksModel';
 import { ServiceCollection } from 'vs/platform/instantiation/common/serviceCollection';
 import { InstantiationService } from 'vs/platform/instantiation/common/instantiationService';
-import { IEditorGroupService, GroupArrangement } from 'vs/workbench/services/group/common/groupService';
+import { IEditorGroupService, GroupArrangement, GroupOrientation } from 'vs/workbench/services/group/common/groupService';
 import { TextFileService } from 'vs/workbench/services/textfile/browser/textFileService';
 import { IFileService, IResolveContentOptions, IFileOperationResult } from 'vs/platform/files/common/files';
 import { IModelService } from 'vs/editor/common/services/modelService';
@@ -372,6 +372,14 @@ export class TestEditorGroupService implements IEditorGroupService {
 
 	}
 
+	public setGroupOrientation(orientation: GroupOrientation): void {
+
+	}
+
+	public getGroupOrientation(): GroupOrientation {
+		return 'vertical';
+	}
+
 	public pinEditor(group: IEditorGroup, input: IEditorInput): void;
 	public pinEditor(position: Position, input: IEditorInput): void;
 	public pinEditor(arg1: any, input: IEditorInput): void {

src/vs/workbench/browser/actions/toggleEditorLayout.ts

@@ -10,30 +10,22 @@ import nls = require('vs/nls');
 import { Registry } from 'vs/platform/platform';
 import { Action } from 'vs/base/common/actions';
 import { SyncActionDescriptor } from 'vs/platform/actions/common/actions';
-import { IMessageService, Severity } from 'vs/platform/message/common/message';
 import { IWorkbenchActionRegistry, Extensions } from 'vs/workbench/common/actionRegistry';
-import { IConfigurationEditingService, ConfigurationTarget } from 'vs/workbench/services/configuration/common/configurationEditing';
-import { IConfigurationService } from 'vs/platform/configuration/common/configuration';
 import { KeyMod, KeyCode } from 'vs/base/common/keyCodes';
-import { IEditorGroupService } from 'vs/workbench/services/group/common/groupService';
+import { IEditorGroupService, GroupOrientation } from 'vs/workbench/services/group/common/groupService';
 import { dispose, IDisposable } from 'vs/base/common/lifecycle';
 
 export class ToggleEditorLayoutAction extends Action {
 
-	public static ID = 'workbench.action.toggleEditorLayout';
-	public static LABEL = nls.localize('toggleEditorLayout', "Toggle Vertical/Horizontal Layout");
-
-	private static editorLayoutConfigurationKey = 'workbench.editor.sideBySideLayout';
+	public static ID = 'workbench.action.toggleEditorGroupLayout';
+	public static LABEL = nls.localize('toggleEditorGroupLayout', "Toggle Editor Group Layout");
 
 	private toDispose: IDisposable[];
 
 	constructor(
 		id: string,
 		label: string,
-		@IMessageService private messageService: IMessageService,
-		@IConfigurationService private configurationService: IConfigurationService,
-		@IEditorGroupService private editorGroupService: IEditorGroupService,
-		@IConfigurationEditingService private configurationEditingService: IConfigurationEditingService
+		@IEditorGroupService private editorGroupService: IEditorGroupService
 	) {
 		super(id, label);
 
@@ -47,12 +39,6 @@ export class ToggleEditorLayoutAction extends Action {
 
 	private registerListeners(): void {
 		this.toDispose.push(this.editorGroupService.onEditorsChanged(() => this.updateEnablement()));
-		this.toDispose.push(this.configurationService.onDidUpdateConfiguration(() => this.updateLabel()));
-	}
-
-	private updateLabel(): void {
-		const editorLayoutVertical = this.configurationService.lookup('workbench.editor.sideBySideLayout').value !== 'horizontal';
-		this.label = editorLayoutVertical ? nls.localize('horizontalLayout', "Horizontal Editor Layout") : nls.localize('verticalLayout', "Vertical Editor Layout");
 	}
 
 	private updateEnablement(): void {
@@ -60,12 +46,10 @@ export class ToggleEditorLayoutAction extends Action {
 	}
 
 	public run(): TPromise<any> {
-		const editorLayoutVertical = this.configurationService.lookup('workbench.editor.sideBySideLayout').value !== 'horizontal';
-		const newEditorLayout = editorLayoutVertical ? 'horizontal' : 'vertical';
+		const groupOrientiation = this.editorGroupService.getGroupOrientation();
+		const newGroupOrientation: GroupOrientation = (groupOrientiation === 'vertical') ? 'horizontal' : 'vertical';
 
-		this.configurationEditingService.writeConfiguration(ConfigurationTarget.USER, { key: ToggleEditorLayoutAction.editorLayoutConfigurationKey, value: newEditorLayout }).then(null, error => {
-			this.messageService.show(Severity.Error, error);
-		});
+		this.editorGroupService.setGroupOrientation(newGroupOrientation);
 
 		return TPromise.as(null);
 	}
@@ -77,5 +61,48 @@ export class ToggleEditorLayoutAction extends Action {
 	}
 }
 
+export class SwitchToVerticalEditorGroupLayoutAction extends Action {
+
+	public static ID = 'workbench.action.verticalEditorGroupLayout';
+	public static LABEL = nls.localize('verticalEditorGroupLayout', "Switch to Vertical Editor Group Layout");
+
+	constructor(
+		id: string,
+		label: string,
+		@IEditorGroupService private editorGroupService: IEditorGroupService
+	) {
+		super(id, label);
+	}
+
+	public run(): TPromise<any> {
+		this.editorGroupService.setGroupOrientation('vertical');
+
+		return TPromise.as(null);
+	}
+}
+
+export class SwitchToHorizontalEditorGroupLayoutAction extends Action {
+
+	public static ID = 'workbench.action.horizontalEditorGroupLayout';
+	public static LABEL = nls.localize('horizontalEditorGroupLayout', "Switch to Horizontal Editor Group Layout");
+
+	constructor(
+		id: string,
+		label: string,
+		@IEditorGroupService private editorGroupService: IEditorGroupService
+	) {
+		super(id, label);
+	}
+
+	public run(): TPromise<any> {
+		this.editorGroupService.setGroupOrientation('horizontal');
+
+		return TPromise.as(null);
+	}
+}
+
 const registry = Registry.as<IWorkbenchActionRegistry>(Extensions.WorkbenchActions);
-registry.registerWorkbenchAction(new SyncActionDescriptor(ToggleEditorLayoutAction, ToggleEditorLayoutAction.ID, ToggleEditorLayoutAction.LABEL, { primary: KeyMod.Shift | KeyMod.Alt | KeyCode.KEY_1, mac: { primary: KeyMod.CtrlCmd | KeyMod.Alt | KeyCode.KEY_1 } }), 'View: Toggle Vertical/Horizontal Layout', nls.localize('view', "View"));
\ No newline at end of file
+const group = nls.localize('view', "View");
+registry.registerWorkbenchAction(new SyncActionDescriptor(ToggleEditorLayoutAction, ToggleEditorLayoutAction.ID, ToggleEditorLayoutAction.LABEL, { primary: KeyMod.Shift | KeyMod.Alt | KeyCode.KEY_1, mac: { primary: KeyMod.CtrlCmd | KeyMod.Alt | KeyCode.KEY_1 } }), 'View: Toggle Vertical/Horizontal Layout', group);
+registry.registerWorkbenchAction(new SyncActionDescriptor(SwitchToHorizontalEditorGroupLayoutAction, SwitchToHorizontalEditorGroupLayoutAction.ID, SwitchToHorizontalEditorGroupLayoutAction.LABEL), 'View: Switch to Horizontal Editor Group Layout', group);
+registry.registerWorkbenchAction(new SyncActionDescriptor(SwitchToVerticalEditorGroupLayoutAction, SwitchToVerticalEditorGroupLayoutAction.ID, SwitchToVerticalEditorGroupLayoutAction.LABEL), 'View: Switch to Vertical Editor Group Layout', group);
\ No newline at end of file

src/vs/workbench/browser/parts/editor/editorPart.ts

@@ -34,7 +34,7 @@ import { IInstantiationService } from 'vs/platform/instantiation/common/instanti
 import { ServiceCollection } from 'vs/platform/instantiation/common/serviceCollection';
 import { IMessageService, IMessageWithAction, Severity } from 'vs/platform/message/common/message';
 import { ITelemetryService } from 'vs/platform/telemetry/common/telemetry';
-import { IEditorGroupService } from 'vs/workbench/services/group/common/groupService';
+import { IEditorGroupService, GroupOrientation } from 'vs/workbench/services/group/common/groupService';
 import { IProgressService } from 'vs/platform/progress/common/progress';
 import { BaseTextEditor } from 'vs/workbench/browser/parts/editor/textEditor';
 import { EditorStacksModel, EditorGroup, EditorIdentifier } from 'vs/workbench/common/editor/editorStacksModel';
@@ -804,6 +804,14 @@ export class EditorPart extends Part implements IEditorPart, IEditorGroupService
 		this.sideBySideControl.arrangeGroups(arrangement);
 	}
 
+	public setGroupOrientation(orientation: GroupOrientation): void {
+		this.sideBySideControl.setGroupOrientation(orientation);
+	}
+
+	public getGroupOrientation(): GroupOrientation {
+		return this.sideBySideControl.getGroupOrientation();
+	}
+
 	public createContentArea(parent: Builder): Builder {
 
 		// Content Container

src/vs/workbench/browser/parts/editor/sideBySideEditorControl.ts

@@ -21,7 +21,7 @@ import { RunOnceScheduler } from 'vs/base/common/async';
 import { isMacintosh } from 'vs/base/common/platform';
 import { IWorkbenchEditorService } from 'vs/workbench/services/editor/common/editorService';
 import { Position, POSITIONS } from 'vs/platform/editor/common/editor';
-import { IEditorGroupService, GroupArrangement } from 'vs/workbench/services/group/common/groupService';
+import { IEditorGroupService, GroupArrangement, GroupOrientation } from 'vs/workbench/services/group/common/groupService';
 import { BaseTextEditor } from 'vs/workbench/browser/parts/editor/textEditor';
 import { ITelemetryService } from 'vs/platform/telemetry/common/telemetry';
 import { IConfigurationService } from 'vs/platform/configuration/common/configuration';
@@ -77,6 +77,9 @@ export interface ISideBySideEditorControl {
 
 	arrangeGroups(arrangement: GroupArrangement): void;
 
+	setGroupOrientation(orientation: GroupOrientation): void;
+	getGroupOrientation(): GroupOrientation;
+
 	getRatio(): number[];
 	dispose(): void;
 }
@@ -105,6 +108,8 @@ export class SideBySideEditorControl implements ISideBySideEditorControl, IVerti
 	private dragging: boolean;
 
 	private layoutVertically: boolean;
+	private configuredGroupOrientation: GroupOrientation;
+
 	private showTabs: boolean;
 	private showIcons: boolean;
 
@@ -200,31 +205,31 @@ export class SideBySideEditorControl implements ISideBySideEditorControl, IVerti
 	}
 
 	private onConfigurationUpdated(config: IWorkbenchEditorConfiguration, refresh?: boolean): void {
+		let configuredGroupOrientation: GroupOrientation;
 		if (config.workbench && config.workbench.editor) {
 			this.showTabs = config.workbench.editor.showTabs;
 			this.showIcons = config.workbench.editor.showIcons;
-			this.layoutVertically = (config.workbench.editor.sideBySideLayout !== 'horizontal');
+			configuredGroupOrientation = (config.workbench.editor.sideBySideLayout === 'horizontal') ? 'horizontal' : 'vertical';
 		} else {
 			this.showTabs = true;
 			this.showIcons = false;
-			this.layoutVertically = true;
+			configuredGroupOrientation = 'vertical';
+		}
+
+		// Only once on startup
+		if (types.isUndefined(this.layoutVertically)) {
+			this.layoutVertically = (configuredGroupOrientation !== 'horizontal');
+			this.configuredGroupOrientation = configuredGroupOrientation;
 		}
 
 		if (!refresh) {
 			return; // return early if no refresh is needed
 		}
 
-		// Editor Layout
-		const verticalLayouting = this.parent.hasClass('vertical-layout');
-		if (verticalLayouting !== this.layoutVertically) {
-			this.parent.removeClass('vertical-layout', 'horizontal-layout');
-			this.parent.addClass(this.layoutVertically ? 'vertical-layout' : 'horizontal-layout');
-
-			this.sashOne.setOrientation(this.layoutVertically ? Orientation.VERTICAL : Orientation.HORIZONTAL);
-			this.sashTwo.setOrientation(this.layoutVertically ? Orientation.VERTICAL : Orientation.HORIZONTAL);
-
-			// Trigger layout
-			this.arrangeGroups(GroupArrangement.EVEN);
+		// Find out if editor layout changed in configuration
+		if (this.configuredGroupOrientation !== configuredGroupOrientation) {
+			this.configuredGroupOrientation = configuredGroupOrientation;
+			this.setGroupOrientation(this.configuredGroupOrientation);
 		}
 
 		// Editor Containers
@@ -754,6 +759,27 @@ export class SideBySideEditorControl implements ISideBySideEditorControl, IVerti
 		this.layoutContainers();
 	}
 
+	public setGroupOrientation(orientation: GroupOrientation): void {
+		this.layoutVertically = (orientation !== 'horizontal');
+
+		// Editor Layout
+		const verticalLayouting = this.parent.hasClass('vertical-layout');
+		if (verticalLayouting !== this.layoutVertically) {
+			this.parent.removeClass('vertical-layout', 'horizontal-layout');
+			this.parent.addClass(this.layoutVertically ? 'vertical-layout' : 'horizontal-layout');
+
+			this.sashOne.setOrientation(this.layoutVertically ? Orientation.VERTICAL : Orientation.HORIZONTAL);
+			this.sashTwo.setOrientation(this.layoutVertically ? Orientation.VERTICAL : Orientation.HORIZONTAL);
+
+			// Trigger layout
+			this.arrangeGroups(GroupArrangement.EVEN);
+		}
+	}
+
+	public getGroupOrientation(): GroupOrientation {
+		return this.layoutVertically ? 'vertical' : 'horizontal';
+	}
+
 	public arrangeGroups(arrangement: GroupArrangement): void {
 		if (!this.dimension) {
 			return; // too early

src/vs/workbench/common/editor.ts

@@ -11,7 +11,7 @@ import URI from 'vs/base/common/uri';
 import { IEditor, ICommonCodeEditor, IEditorViewState, IEditorOptions as ICodeEditorOptions } from 'vs/editor/common/editorCommon';
 import { IEditorInput, IEditorModel, IEditorOptions, ITextEditorOptions, IResourceInput, Position } from 'vs/platform/editor/common/editor';
 import { IWorkspaceContextService } from 'vs/platform/workspace/common/workspace';
-import { IEditorGroupService } from 'vs/workbench/services/group/common/groupService';
+import { IEditorGroupService, GroupOrientation } from 'vs/workbench/services/group/common/groupService';
 import { SyncDescriptor, AsyncDescriptor } from 'vs/platform/instantiation/common/descriptors';
 import { IInstantiationService, IConstructorSignature0 } from 'vs/platform/instantiation/common/instantiation';
 import { IModel } from 'vs/editor/common/editorCommon';
@@ -861,7 +861,7 @@ export interface IWorkbenchEditorConfiguration {
 			enablePreview: boolean;
 			enablePreviewFromQuickOpen: boolean;
 			openPositioning: 'left' | 'right' | 'first' | 'last';
-			sideBySideLayout: 'vertical' | 'horizontal';
+			sideBySideLayout: GroupOrientation;
 		}
 	};
 }

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

@@ -78,7 +78,7 @@ configurationRegistry.registerConfiguration({
 			'type': 'string',
 			'enum': ['vertical', 'horizontal'],
 			'default': 'vertical',
-			'description': nls.localize('sideBySideLayout', "Controls if side by side editors should layout horizontally or vertically.")
+			'description': nls.localize('sideBySideLayout', "Controls if editors showing side by side should layout horizontally or vertically.")
 		},
 		'workbench.editor.showTabs': {
 			'type': 'boolean',

src/vs/workbench/services/group/common/groupService.ts

@@ -15,6 +15,8 @@ export enum GroupArrangement {
 	EVEN
 }
 
+export type GroupOrientation = 'vertical' | 'horizontal';
+
 export const IEditorGroupService = createDecorator<IEditorGroupService>('editorGroupService');
 
 /**
@@ -62,6 +64,17 @@ export interface IEditorGroupService {
 	 */
 	arrangeGroups(arrangement: GroupArrangement): void;
 
+	/**
+	 * Changes the editor group layout between vertical and horizontal orientation. Only applies
+	 * if more than one editor is opened.
+	 */
+	setGroupOrientation(orientation: GroupOrientation): void;
+
+	/**
+	 * Returns the current editor group layout.
+	 */
+	getGroupOrientation(): GroupOrientation;
+
 	/**
 	 * Adds the pinned state to an editor, removing it from being a preview editor.
 	 */