Support position property in editor component (#2314)

* Support position property in editor component
- This needs to be set directly on the editor component so cannot just use CSSStyles feature
- Given its importance to this scenario, it also warrants a dedicated property.

* Fix window resize when action bar clicked

* Renamed per Abbie's suggestion

* Changed name to clarify the comments
This commit is contained in:
Kevin Cunnane
2018-08-23 17:32:13 -07:00
committed by GitHub
parent 4ab5d84b94
commit 2bfc3a6c85
6 changed files with 51 additions and 18 deletions

View File

@@ -13,10 +13,14 @@ import { DialogPane } from 'sql/platform/dialog/dialogPane';
import { ComponentEventType } from 'sql/parts/modelComponents/interfaces';
import { Event, Emitter } from 'vs/base/common/event';
export interface LayoutRequestParams {
modelViewId?: string;
alwaysRefresh?: boolean;
}
export interface DialogComponentParams extends IBootstrapParams {
modelViewId: string;
validityChangedCallback: (valid: boolean) => void;
onLayoutRequested: Event<string>;
onLayoutRequested: Event<LayoutRequestParams>;
dialogPane: DialogPane;
}
@@ -50,8 +54,8 @@ export class DialogContainer implements AfterViewInit {
@Inject(forwardRef(() => ElementRef)) private _el: ElementRef,
@Inject(IBootstrapParams) private _params: DialogComponentParams) {
this.modelViewId = this._params.modelViewId;
this._params.onLayoutRequested(e => {
if (this.modelViewId === e) {
this._params.onLayoutRequested(layoutParams => {
if (layoutParams && (layoutParams.alwaysRefresh || layoutParams.modelViewId === this.modelViewId)) {
this.layout();
}
});

View File

@@ -14,7 +14,7 @@ import { DialogTab } from 'sql/platform/dialog/dialogTypes';
import { TabbedPanel, IPanelTab, IPanelView } from 'sql/base/browser/ui/panel/panel';
import { bootstrapAngular } from 'sql/services/bootstrap/bootstrapService';
import { DialogModule } from 'sql/platform/dialog/dialog.module';
import { DialogComponentParams } from 'sql/platform/dialog/dialogContainer.component';
import { DialogComponentParams, LayoutRequestParams } from 'sql/platform/dialog/dialogContainer.component';
import * as DOM from 'vs/base/browser/dom';
import { Builder } from 'vs/base/browser/builder';
@@ -32,7 +32,7 @@ export class DialogPane extends Disposable implements IThemable {
private _body: HTMLElement;
private _selectedTabIndex: number = 0; //TODO: can be an option
private _onTabChange = new Emitter<string>();
private _onLayoutChange = new Emitter<LayoutRequestParams>();
private _selectedTabContent: string;
public pageNumber?: number;
@@ -65,7 +65,7 @@ export class DialogPane extends Disposable implements IThemable {
this.initializeModelViewContainer(tabContainer, tab.content, tab);
this._tabbedPanel.onTabChange(e => {
tabContainer.style.height = (this.getTabDimension().height - this._tabbedPanel.headersize) + 'px';
this._onTabChange.fire(tab.content);
this._onLayoutChange.fire({ modelViewId: tab.content });
});
this._tabbedPanel.pushTab({
title: tab.title,
@@ -92,10 +92,16 @@ export class DialogPane extends Disposable implements IThemable {
return new DOM.Dimension(DOM.getContentWidth(this._body) - 5, DOM.getContentHeight(this._body) - 5);
}
public layout(): void {
public layout(alwaysRefresh: boolean = false): void {
let layoutParams: LayoutRequestParams = {
alwaysRefresh: alwaysRefresh,
modelViewId: this._selectedTabContent
};
if (this._tabbedPanel) {
this._tabbedPanel.layout(this.getTabDimension());
this._onTabChange.fire(this._selectedTabContent);
this._onLayoutChange.fire(layoutParams);
} else if (alwaysRefresh) {
this._onLayoutChange.fire(layoutParams);
}
}
@@ -115,7 +121,7 @@ export class DialogPane extends Disposable implements IThemable {
tab.notifyValidityChanged(valid);
}
},
onLayoutRequested: this._onTabChange.event,
onLayoutRequested: this._onLayoutChange.event,
dialogPane: this
} as DialogComponentParams,
undefined,