ckaczor/azuredatastudio
1
0
Fork 0
mirror of https://github.com/ckaczor/azuredatastudio.git synced 2026-02-07 17:23:56 -05:00
Code Issues Packages Projects Releases Wiki Activity

Move dashboard properties, fix scroll (#758)

Browse Source 
* started moving properties to home tab

* moved properties

* refactored panel in dashboard

* fix errors

* fix miss-naming
This commit is contained in:
Anthony Dresser
2018-02-23 13:34:11 -08:00
committed by GitHub
parent fdc956e116
commit f9d8f479b5
10 changed files with 156 additions and 115 deletions
Download Patch File Download Diff File Expand all files Collapse all files

90
src/sql/parts/dashboard/common/dashboardPage.component.ts
View File

@@ -30,7 +30,6 @@ import * as types from 'vs/base/common/types';
import { Severity } from 'vs/platform/message/common/message';
import { Disposable, IDisposable } from 'vs/base/common/lifecycle';
import * as nls from 'vs/nls';
import { ScrollableElement } from 'vs/base/browser/ui/scrollbar/scrollableElement';
import { ScrollbarVisibility } from 'vs/base/common/scrollable';
import { addDisposableListener, getContentHeight, EventType } from 'vs/base/browser/dom';
import { IColorTheme } from 'vs/workbench/services/themes/common/workbenchThemeService';
@@ -50,11 +49,9 @@ const dashboardRegistry = Registry.as<IDashboardRegistry>(DashboardExtensions.Da
})
export abstract class DashboardPage extends Disposable implements OnDestroy {
protected SKELETON_WIDTH = 5;
protected tabs: Array<TabConfig> = [];
private _originalConfig: WidgetConfig[];
private _scrollableElement: ScrollableElement;
private _widgetConfigLocation: string;
private _propertiesConfigLocation: string;
@@ -63,10 +60,6 @@ export abstract class DashboardPage extends Disposable implements OnDestroy {
private _tabsDispose: Array<IDisposable> = [];
private _pinnedTabs: Array<PinConfig> = [];
@ViewChild('properties') private _properties: DashboardWidgetWrapper;
@ViewChild('scrollable', { read: ElementRef }) private _scrollable: ElementRef;
@ViewChild('scrollContainer', { read: ElementRef }) private _scrollContainer: ElementRef;
@ViewChild('propertiesContainer', { read: ElementRef }) private _propertiesContainer: ElementRef;
@ViewChildren(DashboardTab) private _tabs: QueryList<DashboardTab>;
@ViewChild(PanelComponent) private _panel: PanelComponent;
@@ -91,6 +84,9 @@ export abstract class DashboardPage extends Disposable implements OnDestroy {
widgetHelper.validateGridConfig
];
protected abstract propertiesWidget: WidgetConfig;
protected abstract get context(): string;
constructor(
@Inject(forwardRef(() => DashboardServiceInterface)) protected dashboardService: DashboardServiceInterface,
@Inject(BOOTSTRAP_SERVICE_ID) protected bootstrapService: IBootstrapService,
@@ -122,51 +118,6 @@ export abstract class DashboardPage extends Disposable implements OnDestroy {
}
}
ngAfterViewInit(): void {
this._register(this.dashboardService.themeService.onDidColorThemeChange(this.updateTheme, this));
this.updateTheme(this.dashboardService.themeService.getColorTheme());
let container = this._scrollContainer.nativeElement as HTMLElement;
let scrollable = this._scrollable.nativeElement as HTMLElement;
container.removeChild(scrollable);
this._scrollableElement = new ScrollableElement(scrollable, {
horizontal: ScrollbarVisibility.Hidden,
vertical: ScrollbarVisibility.Auto,
useShadows: false
});
this._scrollableElement.onScroll(e => {
scrollable.style.bottom = e.scrollTop + 'px';
});
container.appendChild(this._scrollableElement.getDomNode());
let initalHeight = getContentHeight(scrollable);
this._scrollableElement.setScrollDimensions({
scrollHeight: Math.max(getContentHeight(scrollable), getContentHeight(container)),
height: getContentHeight(container)
});
this._register(addDisposableListener(window, EventType.RESIZE, () => {
// Todo: Need to set timeout because we have to make sure that the grids have already rearraged before the getContentHeight gets called.
setTimeout(() => {
this._scrollableElement.setScrollDimensions({
scrollHeight: Math.max(getContentHeight(scrollable), getContentHeight(container)),
height: getContentHeight(container)
});
}, 100);
}));
// unforunately because of angular rendering behavior we need to do a double check to make sure nothing changed after this point
setTimeout(() => {
let currentheight = getContentHeight(scrollable);
if (initalHeight !== currentheight) {
this._scrollableElement.setScrollDimensions({
scrollHeight: Math.max(getContentHeight(scrollable), getContentHeight(container)),
height: getContentHeight(container)
});
}
}, 100);
}
private createTabs(homeWidgets: WidgetConfig[]) {
// Clear all tabs
this.tabs = [];
@@ -296,40 +247,13 @@ export abstract class DashboardPage extends Disposable implements OnDestroy {
if (!existedTab) {
this.tabs.push(tab);
this._cd.detectChanges();
let tabComponents = this._tabs.find(i => i.id === tab.id);
this._register(tabComponents.onResize(() => {
this._scrollableElement.setScrollDimensions({
scrollHeight: Math.max(getContentHeight(this._scrollable.nativeElement), getContentHeight(this._scrollContainer.nativeElement)),
height: getContentHeight(this._scrollContainer.nativeElement)
});
}));
}
}
private updateTheme(theme: IColorTheme): void {
let el = this._propertiesContainer.nativeElement as HTMLElement;
let border = theme.getColor(colors.contrastBorder, true);
let borderColor = theme.getColor(themeColors.SIDE_BAR_BACKGROUND, true);
if (border) {
el.style.borderColor = border.toString();
el.style.borderBottomWidth = '1px';
el.style.borderBottomStyle = 'solid';
} else if (borderColor) {
el.style.borderBottom = '1px solid ' + borderColor.toString();
} else {
el.style.border = 'none';
}
}
ngOnDestroy() {
this.dispose();
}
protected abstract propertiesWidget: WidgetConfig;
protected abstract get context(): string;
private getProperties(): Array<WidgetConfig> {
let properties = this.dashboardService.getSettings<IPropertiesConfig[]>([this.context, 'properties'].join('.'));
this._propertiesConfigLocation = 'default';
@@ -353,9 +277,7 @@ export abstract class DashboardPage extends Disposable implements OnDestroy {
public refresh(refreshConfig: boolean = false): void {
if (refreshConfig) {
this.init();
this.refreshProperties();
} else {
this.refreshProperties();
if (this._tabs) {
this._tabs.forEach(tabContent => {
tabContent.refresh();
@@ -364,12 +286,6 @@ export abstract class DashboardPage extends Disposable implements OnDestroy {
}
}
private refreshProperties(): void {
if (this._properties) {
this._properties.refresh();
}
}
public enableEdit(): void {
if (this._tabs) {
this._tabs.forEach(tabContent => {