connect nested grids absolute offsets

fix #129120
microsoft · Oct 25, 2021 · 910511b · 910511b
1 parent 2ea55a5
commit 910511b
Show file tree

Hide file tree

Showing 10 changed files with 33 additions and 33 deletions.
diff --git a/src/vs/base/browser/ui/centered/centeredViewLayout.ts b/src/vs/base/browser/ui/centered/centeredViewLayout.ts
@@ -21,7 +21,7 @@ const GOLDEN_RATIO = {
 	rightMarginRatio: 0.1909
 };
 
-function createEmptyView(background: Color | undefined): ISplitViewView {
+function createEmptyView(background: Color | undefined): ISplitViewView<{ top: number, left: number }> {
 	const element = $('.centered-layout-margin');
 	element.style.height = '100%';
 	if (background) {
@@ -37,13 +37,13 @@ function createEmptyView(background: Color | undefined): ISplitViewView {
 	};
 }
 
-function toSplitViewView(view: IView, getHeight: () => number): ISplitViewView {
+function toSplitViewView(view: IView, getHeight: () => number): ISplitViewView<{ top: number, left: number }> {
 	return {
 		element: view.element,
 		get maximumSize() { return view.maximumWidth; },
 		get minimumSize() { return view.minimumWidth; },
 		onDidChange: Event.map(view.onDidChange, e => e && e.width),
-		layout: (size, offset) => view.layout(size, getHeight(), 0, offset)
+		layout: (size, offset, ctx) => view.layout(size, getHeight(), ctx?.top ?? 0, (ctx?.left ?? 0) + offset)
 	};
 }
 
@@ -53,12 +53,12 @@ export interface ICenteredViewStyles extends ISplitViewStyles {
 
 export class CenteredViewLayout implements IDisposable {
 
-	private splitView?: SplitView;
+	private splitView?: SplitView<{ top: number, left: number }>;
 	private width: number = 0;
 	private height: number = 0;
 	private style!: ICenteredViewStyles;
 	private didLayout = false;
-	private emptyViews: ISplitViewView[] | undefined;
+	private emptyViews: ISplitViewView<{ top: number, left: number }>[] | undefined;
 	private readonly splitViewDisposables = new DisposableStore();
 
 	constructor(private container: HTMLElement, private view: IView, public readonly state: CenteredViewState = { leftMarginRatio: GOLDEN_RATIO.leftMarginRatio, rightMarginRatio: GOLDEN_RATIO.rightMarginRatio }) {
@@ -86,7 +86,7 @@ export class CenteredViewLayout implements IDisposable {
 		this.splitView.orthogonalEndSash = boundarySashes.bottom;
 	}
 
-	layout(width: number, height: number): void {
+	layout(width: number, height: number, top: number, left: number): void {
 		this.width = width;
 		this.height = height;
 		if (this.splitView) {
@@ -95,7 +95,7 @@ export class CenteredViewLayout implements IDisposable {
 				this.resizeMargins();
 			}
 		} else {
-			this.view.layout(width, height, 0, 0);
+			this.view.layout(width, height, top, left);
 		}
 		this.didLayout = true;
 	}

diff --git a/src/vs/base/browser/ui/grid/grid.ts b/src/vs/base/browser/ui/grid/grid.ts
@@ -254,8 +254,8 @@ export class Grid<T extends IView = IView> extends Disposable {
 		this.gridview.style(styles);
 	}
 
-	layout(width: number, height: number): void {
-		this.gridview.layout(width, height);
+	layout(width: number, height: number, top: number = 0, left: number = 0): void {
+		this.gridview.layout(width, height, top, left);
 		this.didLayout = true;
 	}
 
@@ -556,8 +556,8 @@ export class SerializableGrid<T extends ISerializableView> extends Grid<T> {
 		};
 	}
 
-	override layout(width: number, height: number): void {
-		super.layout(width, height);
+	override layout(width: number, height: number, top: number = 0, left: number = 0): void {
+		super.layout(width, height, top, left);
 
 		if (this.initialLayoutContext) {
 			this.initialLayoutContext = false;

diff --git a/src/vs/base/browser/ui/grid/gridview.ts b/src/vs/base/browser/ui/grid/gridview.ts
@@ -980,11 +980,11 @@ export class GridView implements IDisposable {
 		this.root.style(styles);
 	}
 
-	layout(width: number, height: number): void {
+	layout(width: number, height: number, top: number = 0, left: number = 0): void {
 		this.firstLayoutController.isLayoutEnabled = true;
 
-		const [size, orthogonalSize] = this.root.orientation === Orientation.HORIZONTAL ? [height, width] : [width, height];
-		this.root.layout(size, 0, { orthogonalSize, absoluteOffset: 0, absoluteOrthogonalOffset: 0, absoluteSize: size, absoluteOrthogonalSize: orthogonalSize });
+		const [size, orthogonalSize, offset, orthogonalOffset] = this.root.orientation === Orientation.HORIZONTAL ? [height, width, top, left] : [width, height, left, top];
+		this.root.layout(size, offset, { orthogonalSize, absoluteOffset: offset, absoluteOrthogonalOffset: orthogonalOffset, absoluteSize: size, absoluteOrthogonalSize: orthogonalSize });
 	}
 
 	addView(view: IView, size: number | Sizing, location: number[]): void {

diff --git a/src/vs/workbench/browser/part.ts b/src/vs/workbench/browser/part.ts
@@ -136,7 +136,7 @@ export abstract class Part extends Component implements ISerializableView {
 	abstract minimumHeight: number;
 	abstract maximumHeight: number;
 
-	layout(width: number, height: number): void {
+	layout(width: number, height: number, _top: number, _left: number): void {
 		this._dimension = new Dimension(width, height);
 	}
 

diff --git a/src/vs/workbench/browser/parts/compositePart.ts b/src/vs/workbench/browser/parts/compositePart.ts
@@ -469,8 +469,8 @@ export abstract class CompositePart<T extends Composite> extends Part {
 		return AnchorAlignment.RIGHT;
 	}
 
-	override layout(width: number, height: number): void {
-		super.layout(width, height);
+	override layout(width: number, height: number, top: number, left: number): void {
+		super.layout(width, height, top, left);
 
 		// Layout contents
 		this.contentAreaSize = Dimension.lift(super.layoutContents(width, height).contentSize);

diff --git a/src/vs/workbench/browser/parts/editor/editorPart.ts b/src/vs/workbench/browser/parts/editor/editorPart.ts
@@ -71,9 +71,9 @@ class GridWidgetView<T extends IView> implements IView {
 		this._gridWidget = grid;
 	}
 
-	layout(width: number, height: number): void {
+	layout(width: number, height: number, top: number, left: number): void {
 		if (this.gridWidget) {
-			this.gridWidget.layout(width, height);
+			this.gridWidget.layout(width, height, top, left);
 		}
 	}
 
@@ -443,7 +443,7 @@ export class EditorPart extends Part implements IEditorGroupsService, IEditorGro
 		this.doCreateGridControlWithState(gridDescriptor, activeGroup.id, currentGroupViews);
 
 		// Layout
-		this.doLayout(this._contentDimension);
+		this.doLayout(this._contentDimension, 0, 0);
 
 		// Update container
 		this.updateContainer();
@@ -1117,20 +1117,20 @@ export class EditorPart extends Part implements IEditorGroupsService, IEditorGro
 		this.centeredLayoutWidget.boundarySashes = sashes;
 	}
 
-	override layout(width: number, height: number): void {
+	override layout(width: number, height: number, top: number, left: number): void {
 
 		// Layout contents
 		const contentAreaSize = super.layoutContents(width, height).contentSize;
 
 		// Layout editor container
-		this.doLayout(Dimension.lift(contentAreaSize));
+		this.doLayout(Dimension.lift(contentAreaSize), top, left);
 	}
 
-	private doLayout(dimension: Dimension): void {
+	private doLayout(dimension: Dimension, top: number, left: number): void {
 		this._contentDimension = dimension;
 
 		// Layout Grid
-		this.centeredLayoutWidget.layout(this._contentDimension.width, this._contentDimension.height);
+		this.centeredLayoutWidget.layout(this._contentDimension.width, this._contentDimension.height, top, left);
 
 		// Event
 		this._onDidLayout.fire(dimension);

diff --git a/src/vs/workbench/browser/parts/panel/panelPart.ts b/src/vs/workbench/browser/parts/panel/panelPart.ts
@@ -596,15 +596,15 @@ export abstract class BasePanelPart extends CompositePart<PaneComposite> impleme
 		this.layoutCompositeBar();
 	}
 
-	override layout(width: number, height: number): void {
+	override layout(width: number, height: number, top: number, left: number): void {
 		if (!this.layoutService.isVisible(this.partId)) {
 			return;
 		}
 
 		this.contentDimension = new Dimension(width, height);
 
 		// Layout contents
-		super.layout(this.contentDimension.width, this.contentDimension.height);
+		super.layout(this.contentDimension.width, this.contentDimension.height, top, left);
 
 		// Layout composite bar
 		this.layoutCompositeBar();
@@ -897,7 +897,7 @@ export class PanelPart extends BasePanelPart {
 		return super.getToolbarWidth() + (this.globalToolBar?.getItemsWidth() ?? 0);
 	}
 
-	override layout(width: number, height: number): void {
+	override layout(width: number, height: number, top: number, left: number): void {
 		let dimensions: Dimension;
 		if (this.layoutService.getPanelPosition() === Position.RIGHT) {
 			dimensions = new Dimension(width - 1, height); // Take into account the 1px border when layouting
@@ -906,7 +906,7 @@ export class PanelPart extends BasePanelPart {
 		}
 
 		// Layout contents
-		super.layout(dimensions.width, dimensions.height);
+		super.layout(dimensions.width, dimensions.height, top, left);
 	}
 
 	private updateGlobalToolbarActions(): void {

diff --git a/src/vs/workbench/browser/parts/sidebar/sidebarPart.ts b/src/vs/workbench/browser/parts/sidebar/sidebarPart.ts
@@ -204,12 +204,12 @@ export class SidebarPart extends CompositePart<PaneComposite> implements IPaneCo
 		container.style.outlineColor = this.getColor(SIDE_BAR_DRAG_AND_DROP_BACKGROUND) ?? '';
 	}
 
-	override layout(width: number, height: number): void {
+	override layout(width: number, height: number, top: number, left: number): void {
 		if (!this.layoutService.isVisible(Parts.SIDEBAR_PART)) {
 			return;
 		}
 
-		super.layout(width, height);
+		super.layout(width, height, top, left);
 	}
 
 	// Viewlet service

diff --git a/src/vs/workbench/browser/parts/statusbar/statusbarPart.ts b/src/vs/workbench/browser/parts/statusbar/statusbarPart.ts
@@ -520,8 +520,8 @@ export class StatusbarPart extends Part implements IStatusbarService {
 		this.styleElement.textContent = `.monaco-workbench .part.statusbar > .items-container > .statusbar-item.has-beak:before { border-bottom-color: ${backgroundColor}; }`;
 	}
 
-	override layout(width: number, height: number): void {
-		super.layout(width, height);
+	override layout(width: number, height: number, top: number, left: number): void {
+		super.layout(width, height, top, left);
 		super.layoutContents(width, height);
 	}
 

diff --git a/src/vs/workbench/test/browser/workbenchTestServices.ts b/src/vs/workbench/test/browser/workbenchTestServices.ts
@@ -1635,7 +1635,7 @@ export class TestEditorPart extends EditorPart {
 export async function createEditorPart(instantiationService: IInstantiationService, disposables: DisposableStore): Promise<TestEditorPart> {
 	const part = disposables.add(instantiationService.createInstance(TestEditorPart));
 	part.create(document.createElement('div'));
-	part.layout(1080, 800);
+	part.layout(1080, 800, 0, 0);
 
 	await part.whenReady;