未验证 提交 860d3204 编写于 作者: I Isidor Nikolic 提交者: GitHub

Merge pull request #51997 from Microsoft/isidorn/gridContainer

grid: container as a readonly property
......@@ -198,8 +198,12 @@ export class Grid<T extends IView> implements IDisposable {
public sashResetSizing: Sizing = Sizing.Distribute;
constructor(container: HTMLElement, view: T, options: IGridOptions = {}) {
this.gridview = new GridView(container, options);
get container(): HTMLElement {
return this.gridview.element;
}
constructor(view: T, options: IGridOptions = {}) {
this.gridview = new GridView(options);
this.disposables.push(this.gridview);
this.gridview.onDidSashReset(this.doResetViewSize, this, this.disposables);
......@@ -439,7 +443,7 @@ export class SerializableGrid<T extends ISerializableView> extends Grid<T> {
return SerializableGrid.getFirstLeaf(node.children[0]);
}
static deserialize<T extends ISerializableView>(container: HTMLElement, json: ISerializedGrid, deserializer: IViewDeserializer<T>, options: IGridOptions = {}): SerializableGrid<T> {
static deserialize<T extends ISerializableView>(json: ISerializedGrid, deserializer: IViewDeserializer<T>, options: IGridOptions = {}): SerializableGrid<T> {
if (typeof json.orientation !== 'number') {
throw new Error('Invalid JSON: \'orientation\' property must be a number.');
} else if (typeof json.width !== 'number') {
......@@ -460,7 +464,7 @@ export class SerializableGrid<T extends ISerializableView> extends Grid<T> {
throw new Error('Invalid serialized state, first leaf not found');
}
const result = new SerializableGrid<T>(container, firstLeaf.view, options);
const result = new SerializableGrid<T>(firstLeaf.view, options);
result.orientation = orientation;
result.restoreViews(firstLeaf.view, orientation, root);
result.initialLayoutContext = { width, height, root };
......@@ -618,4 +622,4 @@ export function createSerializedGrid(gridDescriptor: GridDescriptor): ISerialize
width: width || 1,
height: height || 1
};
}
\ No newline at end of file
}
......@@ -10,7 +10,7 @@ import { Event, anyEvent, Emitter, mapEvent, Relay } from 'vs/base/common/event'
import { Orientation, Sash } from 'vs/base/browser/ui/sash/sash';
import { SplitView, IView as ISplitView, Sizing, ISplitViewStyles } from 'vs/base/browser/ui/splitview/splitview';
import { empty as EmptyDisposable, IDisposable, toDisposable } from 'vs/base/common/lifecycle';
import { $, append } from 'vs/base/browser/dom';
import { $ } from 'vs/base/browser/dom';
import { tail2 as tail } from 'vs/base/common/arrays';
import { Color } from 'vs/base/common/color';
......@@ -418,7 +418,7 @@ function flipNode<T extends Node>(node: T, size: number, orthogonalSize: number)
export class GridView implements IDisposable {
private element: HTMLElement;
readonly element: HTMLElement;
private styles: IGridViewStyles;
private _root: BranchNode;
......@@ -483,8 +483,8 @@ export class GridView implements IDisposable {
return this.root.maximumHeight;
}
constructor(container: HTMLElement, options: IGridViewOptions = {}) {
this.element = append(container, $('.monaco-grid-view'));
constructor(options: IGridViewOptions = {}) {
this.element = $('.monaco-grid-view');
this.styles = options.styles || defaultStyles;
this.root = new BranchNode(Orientation.VERTICAL, this.styles);
}
......@@ -757,7 +757,5 @@ export class GridView implements IDisposable {
if (this.element && this.element.parentElement) {
this.element.parentElement.removeChild(this.element);
}
this.element = null;
}
}
\ No newline at end of file
}
......@@ -4,7 +4,7 @@
*--------------------------------------------------------------------------------------------*/
import * as assert from 'assert';
import { Direction, Grid, getRelativeLocation, Orientation, SerializableGrid, ISerializableView, IViewDeserializer, GridNode, Sizing, isGridBranchNode, sanitizeGridNodeDescriptor, GridNodeDescriptor, createSerializedGrid } from 'vs/base/browser/ui/grid/grid';
import { Direction, getRelativeLocation, Orientation, SerializableGrid, ISerializableView, IViewDeserializer, GridNode, Sizing, isGridBranchNode, sanitizeGridNodeDescriptor, GridNodeDescriptor, createSerializedGrid, Grid } from 'vs/base/browser/ui/grid/grid';
import { TestView, nodesToArrays } from './util';
import { deepClone } from 'vs/base/common/objects';
......@@ -56,7 +56,8 @@ suite('Grid', function () {
test('empty', function () {
const view1 = new TestView(100, Number.MAX_VALUE, 100, Number.MAX_VALUE);
const gridview = new Grid(container, view1);
const gridview = new Grid(view1);
container.appendChild(gridview.container);
gridview.layout(800, 600);
assert.deepEqual(view1.size, [800, 600]);
......@@ -64,7 +65,8 @@ suite('Grid', function () {
test('two views vertically', function () {
const view1 = new TestView(50, Number.MAX_VALUE, 50, Number.MAX_VALUE);
const grid = new Grid(container, view1);
const grid = new Grid(view1);
container.appendChild(grid.container);
grid.layout(800, 600);
assert.deepEqual(view1.size, [800, 600]);
......@@ -76,7 +78,9 @@ suite('Grid', function () {
test('two views horizontally', function () {
const view1 = new TestView(50, Number.MAX_VALUE, 50, Number.MAX_VALUE);
const grid = new Grid(container, view1);
const grid = new Grid(view1);
container.appendChild(grid.container);
grid.layout(800, 600);
assert.deepEqual(view1.size, [800, 600]);
......@@ -88,7 +92,9 @@ suite('Grid', function () {
test('simple layout', function () {
const view1 = new TestView(50, Number.MAX_VALUE, 50, Number.MAX_VALUE);
const grid = new Grid(container, view1);
const grid = new Grid(view1);
container.appendChild(grid.container);
grid.layout(800, 600);
assert.deepEqual(view1.size, [800, 600]);
......@@ -121,7 +127,9 @@ suite('Grid', function () {
test('another simple layout with automatic size distribution', function () {
const view1 = new TestView(50, Number.MAX_VALUE, 50, Number.MAX_VALUE);
const grid = new Grid(container, view1);
const grid = new Grid(view1);
container.appendChild(grid.container);
grid.layout(800, 600);
assert.deepEqual(view1.size, [800, 600]);
......@@ -163,7 +171,9 @@ suite('Grid', function () {
test('another simple layout with split size distribution', function () {
const view1 = new TestView(50, Number.MAX_VALUE, 50, Number.MAX_VALUE);
const grid = new Grid(container, view1);
const grid = new Grid(view1);
container.appendChild(grid.container);
grid.layout(800, 600);
assert.deepEqual(view1.size, [800, 600]);
......@@ -205,7 +215,9 @@ suite('Grid', function () {
test('3/2 layout with split', function () {
const view1 = new TestView(50, Number.MAX_VALUE, 50, Number.MAX_VALUE);
const grid = new Grid(container, view1);
const grid = new Grid(view1);
container.appendChild(grid.container);
grid.layout(800, 600);
assert.deepEqual(view1.size, [800, 600]);
......@@ -238,7 +250,9 @@ suite('Grid', function () {
test('sizing should be correct after branch demotion #50564', function () {
const view1 = new TestView(50, Number.MAX_VALUE, 50, Number.MAX_VALUE);
const grid = new Grid(container, view1);
const grid = new Grid(view1);
container.appendChild(grid.container);
grid.layout(800, 600);
const view2 = new TestView(50, Number.MAX_VALUE, 50, Number.MAX_VALUE);
......@@ -262,7 +276,9 @@ suite('Grid', function () {
test('sizing should be correct after branch demotion #50675', function () {
const view1 = new TestView(50, Number.MAX_VALUE, 50, Number.MAX_VALUE);
const grid = new Grid(container, view1);
const grid = new Grid(view1);
container.appendChild(grid.container);
grid.layout(800, 600);
const view2 = new TestView(50, Number.MAX_VALUE, 50, Number.MAX_VALUE);
......@@ -286,7 +302,9 @@ suite('Grid', function () {
test('getNeighborViews should work on single view layout', function () {
const view1 = new TestView(50, Number.MAX_VALUE, 50, Number.MAX_VALUE);
const grid = new Grid(container, view1);
const grid = new Grid(view1);
container.appendChild(grid.container);
grid.layout(800, 600);
assert.deepEqual(grid.getNeighborViews(view1, Direction.Up), []);
......@@ -302,7 +320,9 @@ suite('Grid', function () {
test('getNeighborViews should work on simple layout', function () {
const view1 = new TestView(50, Number.MAX_VALUE, 50, Number.MAX_VALUE);
const grid = new Grid(container, view1);
const grid = new Grid(view1);
container.appendChild(grid.container);
grid.layout(800, 600);
const view2 = new TestView(50, Number.MAX_VALUE, 50, Number.MAX_VALUE);
......@@ -344,7 +364,9 @@ suite('Grid', function () {
test('getNeighborViews should work on a complex layout', function () {
const view1 = new TestView(50, Number.MAX_VALUE, 50, Number.MAX_VALUE);
const grid = new Grid(container, view1);
const grid = new Grid(view1);
container.appendChild(grid.container);
grid.layout(800, 600);
const view2 = new TestView(50, Number.MAX_VALUE, 50, Number.MAX_VALUE);
......@@ -383,7 +405,9 @@ suite('Grid', function () {
test('getNeighborViews should work on another simple layout', function () {
const view1 = new TestView(50, Number.MAX_VALUE, 50, Number.MAX_VALUE);
const grid = new Grid(container, view1);
const grid = new Grid(view1);
container.appendChild(grid.container);
grid.layout(800, 600);
const view2 = new TestView(50, Number.MAX_VALUE, 50, Number.MAX_VALUE);
......@@ -403,7 +427,9 @@ suite('Grid', function () {
test('getNeighborViews should only return immediate neighbors', function () {
const view1 = new TestView(50, Number.MAX_VALUE, 50, Number.MAX_VALUE);
const grid = new Grid(container, view1);
const grid = new Grid(view1);
container.appendChild(grid.container);
grid.layout(800, 600);
const view2 = new TestView(50, Number.MAX_VALUE, 50, Number.MAX_VALUE);
......@@ -460,6 +486,7 @@ function nodesToNames(node: GridNode<TestSerializableView>): any {
}
suite('SerializableGrid', function () {
let container: HTMLElement;
setup(function () {
......@@ -475,7 +502,8 @@ suite('SerializableGrid', function () {
test('serialize empty', function () {
const view1 = new TestSerializableView('view1', 50, Number.MAX_VALUE, 50, Number.MAX_VALUE);
const grid = new SerializableGrid(container, view1);
const grid = new SerializableGrid(view1);
container.appendChild(grid.container);
grid.layout(800, 600);
assert.deepEqual(grid.serialize(), {
......@@ -500,7 +528,8 @@ suite('SerializableGrid', function () {
test('serialize simple layout', function () {
const view1 = new TestSerializableView('view1', 50, Number.MAX_VALUE, 50, Number.MAX_VALUE);
const grid = new SerializableGrid(container, view1);
const grid = new SerializableGrid(view1);
container.appendChild(grid.container);
grid.layout(800, 600);
const view2 = new TestSerializableView('view2', 50, Number.MAX_VALUE, 50, Number.MAX_VALUE);
......@@ -553,14 +582,15 @@ suite('SerializableGrid', function () {
test('deserialize empty', function () {
const view1 = new TestSerializableView('view1', 50, Number.MAX_VALUE, 50, Number.MAX_VALUE);
const grid = new SerializableGrid(container, view1);
const grid = new SerializableGrid(view1);
container.appendChild(grid.container);
grid.layout(800, 600);
const json = grid.serialize();
grid.dispose();
const deserializer = new TestViewDeserializer();
const grid2 = SerializableGrid.deserialize(container, json, deserializer);
const grid2 = SerializableGrid.deserialize(json, deserializer);
grid2.layout(800, 600);
assert.deepEqual(nodesToNames(grid2.getViews()), ['view1']);
......@@ -568,7 +598,9 @@ suite('SerializableGrid', function () {
test('deserialize simple layout', function () {
const view1 = new TestSerializableView('view1', 50, Number.MAX_VALUE, 50, Number.MAX_VALUE);
const grid = new SerializableGrid(container, view1);
const grid = new SerializableGrid(view1);
container.appendChild(grid.container);
grid.layout(800, 600);
const view2 = new TestSerializableView('view2', 50, Number.MAX_VALUE, 50, Number.MAX_VALUE);
......@@ -587,7 +619,7 @@ suite('SerializableGrid', function () {
grid.dispose();
const deserializer = new TestViewDeserializer();
const grid2 = SerializableGrid.deserialize(container, json, deserializer);
const grid2 = SerializableGrid.deserialize(json, deserializer);
const view1Copy = deserializer.getView('view1');
const view2Copy = deserializer.getView('view2');
......@@ -614,7 +646,9 @@ suite('SerializableGrid', function () {
test('deserialize simple layout with scaling', function () {
const view1 = new TestSerializableView('view1', 50, Number.MAX_VALUE, 50, Number.MAX_VALUE);
const grid = new SerializableGrid(container, view1);
const grid = new SerializableGrid(view1);
container.appendChild(grid.container);
grid.layout(800, 600);
const view2 = new TestSerializableView('view2', 50, Number.MAX_VALUE, 50, Number.MAX_VALUE);
......@@ -633,7 +667,7 @@ suite('SerializableGrid', function () {
grid.dispose();
const deserializer = new TestViewDeserializer();
const grid2 = SerializableGrid.deserialize(container, json, deserializer);
const grid2 = SerializableGrid.deserialize(json, deserializer);
const view1Copy = deserializer.getView('view1');
const view2Copy = deserializer.getView('view2');
......@@ -651,7 +685,8 @@ suite('SerializableGrid', function () {
test('deserialize 4 view layout (ben issue #2)', function () {
const view1 = new TestSerializableView('view1', 50, Number.MAX_VALUE, 50, Number.MAX_VALUE);
const grid = new SerializableGrid(container, view1);
const grid = new SerializableGrid(view1);
container.appendChild(grid.container);
grid.layout(800, 600);
const view2 = new TestSerializableView('view2', 50, Number.MAX_VALUE, 50, Number.MAX_VALUE);
......@@ -667,7 +702,7 @@ suite('SerializableGrid', function () {
grid.dispose();
const deserializer = new TestViewDeserializer();
const grid2 = SerializableGrid.deserialize(container, json, deserializer);
const grid2 = SerializableGrid.deserialize(json, deserializer);
const view1Copy = deserializer.getView('view1');
const view2Copy = deserializer.getView('view2');
......@@ -684,7 +719,9 @@ suite('SerializableGrid', function () {
test('deserialize 2 view layout (ben issue #3)', function () {
const view1 = new TestSerializableView('view1', 50, Number.MAX_VALUE, 50, Number.MAX_VALUE);
const grid = new SerializableGrid(container, view1);
const grid = new SerializableGrid(view1);
container.appendChild(grid.container);
grid.layout(800, 600);
const view2 = new TestSerializableView('view2', 50, Number.MAX_VALUE, 50, Number.MAX_VALUE);
......@@ -694,7 +731,7 @@ suite('SerializableGrid', function () {
grid.dispose();
const deserializer = new TestViewDeserializer();
const grid2 = SerializableGrid.deserialize(container, json, deserializer);
const grid2 = SerializableGrid.deserialize(json, deserializer);
const view1Copy = deserializer.getView('view1');
const view2Copy = deserializer.getView('view2');
......@@ -707,7 +744,9 @@ suite('SerializableGrid', function () {
test('deserialize simple view layout #50609', function () {
const view1 = new TestSerializableView('view1', 50, Number.MAX_VALUE, 50, Number.MAX_VALUE);
const grid = new SerializableGrid(container, view1);
const grid = new SerializableGrid(view1);
container.appendChild(grid.container);
grid.layout(800, 600);
const view2 = new TestSerializableView('view2', 50, Number.MAX_VALUE, 50, Number.MAX_VALUE);
......@@ -722,7 +761,7 @@ suite('SerializableGrid', function () {
grid.dispose();
const deserializer = new TestViewDeserializer();
const grid2 = SerializableGrid.deserialize(container, json, deserializer);
const grid2 = SerializableGrid.deserialize(json, deserializer);
const view2Copy = deserializer.getView('view2');
const view3Copy = deserializer.getView('view3');
......@@ -763,4 +802,4 @@ suite('SerializableGrid', function () {
height: 1
});
});
});
\ No newline at end of file
});
......@@ -4,31 +4,33 @@
*--------------------------------------------------------------------------------------------*/
import * as assert from 'assert';
import { $ } from 'vs/base/browser/dom';
import { GridView, IView, Sizing } from 'vs/base/browser/ui/grid/gridview';
import { nodesToArrays, TestView } from './util';
suite('Gridview', function () {
let container: HTMLElement;
let gridview: GridView;
setup(function () {
container = document.createElement('div');
gridview = new GridView();
const container = $('.container');
container.style.position = 'absolute';
container.style.width = `${200}px`;
container.style.height = `${200}px`;
container.appendChild(gridview.element);
});
teardown(function () {
container = null;
gridview = null;
});
test('empty gridview is empty', function () {
const gridview = new GridView(container);
assert.deepEqual(nodesToArrays(gridview.getViews()), []);
gridview.dispose();
});
test('gridview addView', function () {
const gridview = new GridView(container);
const view = new TestView(20, 20, 20, 20);
assert.throws(() => gridview.addView(view, 200, []), 'empty location');
......@@ -51,7 +53,6 @@ suite('Gridview', function () {
});
test('gridview addView nested', function () {
const gridview = new GridView(container);
const views = [
new TestView(20, 20, 20, 20),
......@@ -71,7 +72,6 @@ suite('Gridview', function () {
});
test('gridview addView deep nested', function () {
const gridview = new GridView(container);
const view1 = new TestView(20, 20, 20, 20);
gridview.addView(view1 as IView, 200, [0]);
......@@ -109,84 +109,82 @@ suite('Gridview', function () {
});
test('simple layout', function () {
const grid = new GridView(container);
grid.layout(800, 600);
gridview.layout(800, 600);
const view1 = new TestView(50, Number.MAX_VALUE, 50, Number.MAX_VALUE);
grid.addView(view1, 200, [0]);
gridview.addView(view1, 200, [0]);
assert.deepEqual(view1.size, [800, 600]);
assert.deepEqual(grid.getViewSize([0]), { width: 800, height: 600 });
assert.deepEqual(gridview.getViewSize([0]), { width: 800, height: 600 });
const view2 = new TestView(50, Number.MAX_VALUE, 50, Number.MAX_VALUE);
grid.addView(view2, 200, [0]);
gridview.addView(view2, 200, [0]);
assert.deepEqual(view1.size, [800, 400]);
assert.deepEqual(grid.getViewSize([1]), { width: 800, height: 400 });
assert.deepEqual(gridview.getViewSize([1]), { width: 800, height: 400 });
assert.deepEqual(view2.size, [800, 200]);
assert.deepEqual(grid.getViewSize([0]), { width: 800, height: 200 });
assert.deepEqual(gridview.getViewSize([0]), { width: 800, height: 200 });
const view3 = new TestView(50, Number.MAX_VALUE, 50, Number.MAX_VALUE);
grid.addView(view3, 200, [1, 1]);
gridview.addView(view3, 200, [1, 1]);
assert.deepEqual(view1.size, [600, 400]);
assert.deepEqual(grid.getViewSize([1, 0]), { width: 600, height: 400 });
assert.deepEqual(gridview.getViewSize([1, 0]), { width: 600, height: 400 });
assert.deepEqual(view2.size, [800, 200]);
assert.deepEqual(grid.getViewSize([0]), { width: 800, height: 200 });
assert.deepEqual(gridview.getViewSize([0]), { width: 800, height: 200 });
assert.deepEqual(view3.size, [200, 400]);
assert.deepEqual(grid.getViewSize([1, 1]), { width: 200, height: 400 });
assert.deepEqual(gridview.getViewSize([1, 1]), { width: 200, height: 400 });
const view4 = new TestView(50, Number.MAX_VALUE, 50, Number.MAX_VALUE);
grid.addView(view4, 200, [0, 0]);
gridview.addView(view4, 200, [0, 0]);
assert.deepEqual(view1.size, [600, 400]);
assert.deepEqual(grid.getViewSize([1, 0]), { width: 600, height: 400 });
assert.deepEqual(gridview.getViewSize([1, 0]), { width: 600, height: 400 });
assert.deepEqual(view2.size, [600, 200]);
assert.deepEqual(grid.getViewSize([0, 1]), { width: 600, height: 200 });
assert.deepEqual(gridview.getViewSize([0, 1]), { width: 600, height: 200 });
assert.deepEqual(view3.size, [200, 400]);
assert.deepEqual(grid.getViewSize([1, 1]), { width: 200, height: 400 });
assert.deepEqual(gridview.getViewSize([1, 1]), { width: 200, height: 400 });
assert.deepEqual(view4.size, [200, 200]);
assert.deepEqual(grid.getViewSize([0, 0]), { width: 200, height: 200 });
assert.deepEqual(gridview.getViewSize([0, 0]), { width: 200, height: 200 });
const view5 = new TestView(50, Number.MAX_VALUE, 50, Number.MAX_VALUE);
grid.addView(view5, 100, [1, 0, 1]);
gridview.addView(view5, 100, [1, 0, 1]);
assert.deepEqual(view1.size, [600, 300]);
assert.deepEqual(grid.getViewSize([1, 0, 0]), { width: 600, height: 300 });
assert.deepEqual(gridview.getViewSize([1, 0, 0]), { width: 600, height: 300 });
assert.deepEqual(view2.size, [600, 200]);
assert.deepEqual(grid.getViewSize([0, 1]), { width: 600, height: 200 });
assert.deepEqual(gridview.getViewSize([0, 1]), { width: 600, height: 200 });
assert.deepEqual(view3.size, [200, 400]);
assert.deepEqual(grid.getViewSize([1, 1]), { width: 200, height: 400 });
assert.deepEqual(gridview.getViewSize([1, 1]), { width: 200, height: 400 });
assert.deepEqual(view4.size, [200, 200]);
assert.deepEqual(grid.getViewSize([0, 0]), { width: 200, height: 200 });
assert.deepEqual(gridview.getViewSize([0, 0]), { width: 200, height: 200 });
assert.deepEqual(view5.size, [600, 100]);
assert.deepEqual(grid.getViewSize([1, 0, 1]), { width: 600, height: 100 });
assert.deepEqual(gridview.getViewSize([1, 0, 1]), { width: 600, height: 100 });
});
test('simple layout with automatic size distribution', function () {
const grid = new GridView(container);
grid.layout(800, 600);
gridview.layout(800, 600);
const view1 = new TestView(50, Number.MAX_VALUE, 50, Number.MAX_VALUE);
grid.addView(view1, Sizing.Distribute, [0]);
gridview.addView(view1, Sizing.Distribute, [0]);
assert.deepEqual(view1.size, [800, 600]);
assert.deepEqual(grid.getViewSize([0]), { width: 800, height: 600 });
assert.deepEqual(gridview.getViewSize([0]), { width: 800, height: 600 });
const view2 = new TestView(50, Number.MAX_VALUE, 50, Number.MAX_VALUE);
grid.addView(view2, Sizing.Distribute, [0]);
gridview.addView(view2, Sizing.Distribute, [0]);
assert.deepEqual(view1.size, [800, 300]);
assert.deepEqual(view2.size, [800, 300]);
const view3 = new TestView(50, Number.MAX_VALUE, 50, Number.MAX_VALUE);
grid.addView(view3, Sizing.Distribute, [1, 1]);
gridview.addView(view3, Sizing.Distribute, [1, 1]);
assert.deepEqual(view1.size, [400, 300]);
assert.deepEqual(view2.size, [800, 300]);
assert.deepEqual(view3.size, [400, 300]);
const view4 = new TestView(50, Number.MAX_VALUE, 50, Number.MAX_VALUE);
grid.addView(view4, Sizing.Distribute, [0, 0]);
gridview.addView(view4, Sizing.Distribute, [0, 0]);
assert.deepEqual(view1.size, [400, 300]);
assert.deepEqual(view2.size, [400, 300]);
assert.deepEqual(view3.size, [400, 300]);
assert.deepEqual(view4.size, [400, 300]);
const view5 = new TestView(50, Number.MAX_VALUE, 50, Number.MAX_VALUE);
grid.addView(view5, Sizing.Distribute, [1, 0, 1]);
gridview.addView(view5, Sizing.Distribute, [1, 0, 1]);
assert.deepEqual(view1.size, [400, 150]);
assert.deepEqual(view2.size, [400, 300]);
assert.deepEqual(view3.size, [400, 300]);
......@@ -195,18 +193,17 @@ suite('Gridview', function () {
});
test('addviews before layout call 1', function () {
const grid = new GridView(container);
const view1 = new TestView(50, Number.MAX_VALUE, 50, Number.MAX_VALUE);
grid.addView(view1, 200, [0]);
gridview.addView(view1, 200, [0]);
const view2 = new TestView(50, Number.MAX_VALUE, 50, Number.MAX_VALUE);
grid.addView(view2, 200, [0]);
gridview.addView(view2, 200, [0]);
const view3 = new TestView(50, Number.MAX_VALUE, 50, Number.MAX_VALUE);
grid.addView(view3, 200, [1, 1]);
gridview.addView(view3, 200, [1, 1]);
grid.layout(800, 600);
gridview.layout(800, 600);
assert.deepEqual(view1.size, [400, 300]);
assert.deepEqual(view2.size, [800, 300]);
......@@ -214,21 +211,20 @@ suite('Gridview', function () {
});
test('addviews before layout call 2', function () {
const grid = new GridView(container);
const view1 = new TestView(50, Number.MAX_VALUE, 50, Number.MAX_VALUE);
grid.addView(view1, 200, [0]);
gridview.addView(view1, 200, [0]);
const view2 = new TestView(50, Number.MAX_VALUE, 50, Number.MAX_VALUE);
grid.addView(view2, 200, [0]);
gridview.addView(view2, 200, [0]);
const view3 = new TestView(50, Number.MAX_VALUE, 50, Number.MAX_VALUE);
grid.addView(view3, 200, [0, 0]);
gridview.addView(view3, 200, [0, 0]);
grid.layout(800, 600);
gridview.layout(800, 600);
assert.deepEqual(view1.size, [800, 300]);
assert.deepEqual(view2.size, [400, 300]);
assert.deepEqual(view3.size, [400, 300]);
});
});
\ No newline at end of file
});
......@@ -79,7 +79,6 @@ export class EditorPart extends Part implements EditorGroupsServiceImpl, IEditor
private groupViews: Map<GroupIdentifier, IEditorGroupView> = new Map<GroupIdentifier, IEditorGroupView>();
private mostRecentActiveGroups: GroupIdentifier[] = [];
private container: HTMLElement;
private gridWidget: SerializableGrid<IEditorGroupView>;
private _whenRestored: TPromise<void>;
......@@ -318,7 +317,7 @@ export class EditorPart extends Part implements EditorGroupsServiceImpl, IEditor
}
applyLayout(layout: EditorGroupLayout): void {
const gridHasFocus = isAncestor(document.activeElement, this.container);
const gridHasFocus = isAncestor(document.activeElement, this.gridWidget.container);
// Determine how many groups we need overall
let layoutGroupsCount = 0;
......@@ -355,7 +354,7 @@ export class EditorPart extends Part implements EditorGroupsServiceImpl, IEditor
});
// Recreate gridwidget with descriptor
this.doCreateGridControlWithState(this.container, gridDescriptor, activeGroup.id, currentGroupViews);
this.doCreateGridControlWithState(gridDescriptor, activeGroup.id, currentGroupViews);
// Layout
this.doLayout(this.dimension);
......@@ -540,7 +539,7 @@ export class EditorPart extends Part implements EditorGroupsServiceImpl, IEditor
}
private doRemoveEmptyGroup(groupView: IEditorGroupView): void {
const gridHasFocus = isAncestor(document.activeElement, this.container);
const gridHasFocus = isAncestor(document.activeElement, this.gridWidget.container);
// Activate next group if the removed one was active
if (this._activeGroup === groupView) {
......@@ -688,38 +687,38 @@ export class EditorPart extends Part implements EditorGroupsServiceImpl, IEditor
}
protected updateStyles(): void {
this.container.style.backgroundColor = this.getColor(editorBackground);
this.gridWidget.container.style.backgroundColor = this.getColor(editorBackground);
this.gridWidget.style({ separatorBorder: this.gridSeparatorBorder });
}
createContentArea(parent: HTMLElement): HTMLElement {
// Grid control
this.doCreateGridControl();
// Container
this.container = document.createElement('div');
addClass(this.container, 'content');
parent.appendChild(this.container);
addClass(this.gridWidget.container, 'content');
parent.appendChild(this.gridWidget.container);
// Grid control
this.doCreateGridControl(this.container);
// Drop support
this._register(this.instantiationService.createInstance(EditorDropTarget, this, this.container));
this._register(this.instantiationService.createInstance(EditorDropTarget, this, this.gridWidget.container));
return this.container;
return this.gridWidget.container;
}
private doCreateGridControl(container: HTMLElement): void {
private doCreateGridControl(): void {
// Grid Widget (with previous UI state)
if (this.restorePreviousState) {
this.doCreateGridControlWithPreviousState(container);
this.doCreateGridControlWithPreviousState();
}
// Grid Widget (no previous UI state or failed to restore)
if (!this.gridWidget) {
const initialGroup = this.doCreateGroupView();
this.gridWidget = new SerializableGrid(container, initialGroup);
this.gridWidget = new SerializableGrid(initialGroup);
// Ensure a group is active
this.doSetGroupActive(initialGroup);
......@@ -732,7 +731,7 @@ export class EditorPart extends Part implements EditorGroupsServiceImpl, IEditor
this.updateContainer();
}
private doCreateGridControlWithPreviousState(container: HTMLElement): void {
private doCreateGridControlWithPreviousState(): void {
const uiState = this.doGetPreviousState();
if (uiState && uiState.serializedGrid) {
try {
......@@ -742,17 +741,17 @@ export class EditorPart extends Part implements EditorGroupsServiceImpl, IEditor
this.mostRecentActiveGroups = uiState.mostRecentActiveGroups;
// Grid Widget
this.doCreateGridControlWithState(container, uiState.serializedGrid, uiState.activeGroup);
this.doCreateGridControlWithState(uiState.serializedGrid, uiState.activeGroup);
// Ensure last active group has focus
this._activeGroup.focus();
} catch (error) {
if (this.gridWidget) {
clearNode(this.gridWidget.container);
this.gridWidget.dispose();
this.gridWidget = void 0;
}
clearNode(container);
this.groupViews.forEach(group => group.dispose());
this.groupViews.clear();
this._activeGroup = void 0;
......@@ -763,7 +762,7 @@ export class EditorPart extends Part implements EditorGroupsServiceImpl, IEditor
}
}
private doCreateGridControlWithState(container: HTMLElement, serializedGrid: ISerializedGrid, activeGroupId: GroupIdentifier, editorGroupViewsToReuse?: IEditorGroupView[]): void {
private doCreateGridControlWithState(serializedGrid: ISerializedGrid, activeGroupId: GroupIdentifier, editorGroupViewsToReuse?: IEditorGroupView[]): void {
// Dispose old
if (this.gridWidget) {
......@@ -779,7 +778,7 @@ export class EditorPart extends Part implements EditorGroupsServiceImpl, IEditor
}
// Create new
this.gridWidget = SerializableGrid.deserialize(container, serializedGrid, {
this.gridWidget = SerializableGrid.deserialize(serializedGrid, {
fromJSON: (serializedEditorGroup: ISerializedEditorGroup) => {
let groupView: IEditorGroupView;
if (reuseGroupViews.length > 0) {
......@@ -915,7 +914,7 @@ export class EditorPart extends Part implements EditorGroupsServiceImpl, IEditor
}
private updateContainer(): void {
toggleClass(this.container, 'empty', this.isEmpty());
toggleClass(this.gridWidget.container, 'empty', this.isEmpty());
}
private isEmpty(): boolean {
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册