Revert "Revert "Results grid options (#962)"" (#982)

* Revert "Revert "Results grid options (#962)" (#979)"

This reverts commit ab91c88b34.

* fix angular2-slickgrid compiled files

src/sql/parts/grid/views/query/query.component.html

@@ -26,7 +26,8 @@
 						(mousedown)="navigateToGrid(i)"
 						[selectionModel]="selectionModel"
 						[plugins]="slickgridPlugins"
-						class="boxCol content vertBox slickgrid">
+						class="boxCol content vertBox slickgrid"
+						[rowHeight]="rowHeight">
 			</slick-grid>
 			<span class="boxCol content vertBox">
 				<div class="boxRow content maxHeight" *ngFor="let icon of dataIcons">

src/sql/parts/grid/views/query/query.component.ts

@@ -133,6 +133,7 @@ export class QueryComponent extends GridParentComponent implements OnInit, OnDes
 	private resizing = false;
 	private resizeHandleTop: string = '0';
 	private scrollEnabled = true;
+	private rowHeight: number;
 	// tslint:disable-next-line:no-unused-variable
 	private firstRender = true;
 	private totalElapsedTimeSpan: number;
@@ -157,6 +158,16 @@ export class QueryComponent extends GridParentComponent implements OnInit, OnDes
 	) {
 		super(el, cd, bootstrapService);
 		this._el.nativeElement.className = 'slickgridContainer';
+		this.rowHeight = bootstrapService.configurationService.getValue<any>('resultsGrid').rowHeight;
+		bootstrapService.configurationService.onDidChangeConfiguration(e => {
+			if (e.affectsConfiguration('resultsGrid')) {
+				this.rowHeight = bootstrapService.configurationService.getValue<any>('resultsGrid').rowHeight;
+				this.slickgrids.forEach(i => {
+					i.rowHeight = this.rowHeight;
+				});
+				this.resizeGrids();
+			}
+		});
 	}
 
 	/**

src/sql/parts/query/common/queryResultsInput.ts

@@ -23,6 +23,7 @@ export class QueryResultsInput extends EditorInput {
 
 	// Holds the HTML content for the editor when the editor discards this input and loads another
 	private _editorContainer: HTMLElement;
+	public css: HTMLStyleElement;
 
 	constructor(private _uri: string) {
 		super();

src/sql/parts/query/editor/queryResultsEditor.ts

@@ -11,16 +11,60 @@ import { EditorOptions } from 'vs/workbench/common/editor';
 import { ITelemetryService } from 'vs/platform/telemetry/common/telemetry';
 import { RawContextKey } from 'vs/platform/contextkey/common/contextkey';
 import { BaseEditor } from 'vs/workbench/browser/parts/editor/baseEditor';
+import { IConfigurationService } from 'vs/platform/configuration/common/configuration';
+import { BareFontInfo } from 'vs/editor/common/config/fontInfo';
+import { getZoomLevel } from 'vs/base/browser/browser';
+import { Configuration } from 'vs/editor/browser/config/configuration';
+import { IThemeService } from 'vs/platform/theme/common/themeService';
+import * as dom from 'vs/base/browser/dom';
+import * as types from 'vs/base/common/types';
+
 import { QueryResultsInput } from 'sql/parts/query/common/queryResultsInput';
 import { IQueryModelService } from 'sql/parts/query/execution/queryModel';
 import { IBootstrapService } from 'sql/services/bootstrap/bootstrapService';
 import { QueryComponentParams } from 'sql/services/bootstrap/bootstrapParams';
-import { IThemeService } from 'vs/platform/theme/common/themeService';
 import { QueryOutputModule } from 'sql/parts/query/views/queryOutput.module';
 import { QUERY_OUTPUT_SELECTOR } from 'sql/parts/query/views/queryOutput.component';
 
+export const RESULTS_GRID_DEFAULTS = {
+	cellPadding: [6, 10, 5],
+	rowHeight: 29
+};
+
 export const TextCompareEditorVisible = new RawContextKey<boolean>('textCompareEditorVisible', false);
 
+export class BareResultsGridInfo extends BareFontInfo {
+
+	public static createFromRawSettings(opts: {
+		fontFamily?: string;
+		fontWeight?: string;
+		fontSize?: number | string;
+		lineHeight?: number | string;
+		letterSpacing?: number | string;
+		cellPadding?: number | number[];
+	}, zoomLevel: number): BareResultsGridInfo {
+		let cellPadding = !types.isUndefinedOrNull(opts.cellPadding) ? opts.cellPadding : RESULTS_GRID_DEFAULTS.cellPadding;
+
+		return new BareResultsGridInfo(BareFontInfo.createFromRawSettings(opts, zoomLevel), { cellPadding });
+	}
+
+	readonly cellPadding: number | number[];
+
+	protected constructor(fontInfo: BareFontInfo, opts: {
+		cellPadding: number | number[];
+	}) {
+		super({
+			zoomLevel: fontInfo.zoomLevel,
+			fontFamily: fontInfo.fontFamily,
+			fontWeight: fontInfo.fontWeight,
+			fontSize: fontInfo.fontSize,
+			lineHeight: fontInfo.lineHeight,
+			letterSpacing: fontInfo.letterSpacing
+		});
+		this.cellPadding = opts.cellPadding;
+	}
+}
+
 /**
  * Editor associated with viewing and editing the data of a query results grid.
  */
@@ -28,14 +72,45 @@ export class QueryResultsEditor extends BaseEditor {
 
 	public static ID: string = 'workbench.editor.queryResultsEditor';
 	public static AngularSelectorString: string = 'slickgrid-container.slickgridContainer';
+	protected _rawOptions: BareResultsGridInfo;
+	protected _input: QueryResultsInput;
 
 	constructor(
 		@ITelemetryService telemetryService: ITelemetryService,
 		@IThemeService themeService: IThemeService,
 		@IQueryModelService private _queryModelService: IQueryModelService,
-		@IBootstrapService private _bootstrapService: IBootstrapService
+		@IBootstrapService private _bootstrapService: IBootstrapService,
+		@IConfigurationService private _configurationService: IConfigurationService
 	) {
 		super(QueryResultsEditor.ID, telemetryService, themeService);
+		this._rawOptions = BareResultsGridInfo.createFromRawSettings(this._configurationService.getValue('resultsGrid'), getZoomLevel());
+		this._configurationService.onDidChangeConfiguration(e => {
+			if (e.affectsConfiguration('resultsGrid')) {
+				this._rawOptions = BareResultsGridInfo.createFromRawSettings(this._configurationService.getValue('resultsGrid'), getZoomLevel());
+				this.applySettings();
+			}
+		});
+	}
+
+	public get input(): QueryResultsInput {
+		return this._input;
+	}
+
+	private applySettings() {
+		if (this.input && this.input.container) {
+			Configuration.applyFontInfoSlow(this.getContainer().getHTMLElement(), this._rawOptions);
+			if (!this.input.css) {
+				this.input.css = dom.createStyleSheet(this.input.container);
+			}
+			let cssRuleText = '';
+			if (types.isNumber(this._rawOptions.cellPadding)) {
+				cssRuleText = this._rawOptions.cellPadding + 'px';
+			} else {
+				cssRuleText = this._rawOptions.cellPadding.join('px ') + 'px;';
+			}
+			let content = `.grid .slick-cell { padding: ${cssRuleText}; }`;
+			this.input.css.innerHTML = content;
+		}
 	}
 
 	createEditor(parent: Builder): void {
@@ -46,6 +121,7 @@ export class QueryResultsEditor extends BaseEditor {
 
 	setInput(input: QueryResultsInput, options: EditorOptions): TPromise<void> {
 		super.setInput(input, options);
+		this.applySettings();
 		if (!input.hasBootstrapped) {
 			this._bootstrapAngular();
 		}

src/sql/parts/query/editor/resultsGridContribution.ts

@@ -0,0 +1,70 @@
+/*---------------------------------------------------------------------------------------------
+ *  Copyright (c) Microsoft Corporation. All rights reserved.
+ *  Licensed under the Source EULA. See License.txt in the project root for license information.
+ *--------------------------------------------------------------------------------------------*/
+
+'use strict';
+import { Extensions, IConfigurationRegistry, IConfigurationNode, ConfigurationScope } from 'vs/platform/configuration/common/configurationRegistry';
+import { Registry } from 'vs/platform/registry/common/platform';
+import * as nls from 'vs/nls';
+import * as editorOptions from 'vs/editor/common/config/editorOptions';
+import EDITOR_DEFAULTS = editorOptions.EDITOR_DEFAULTS;
+import EDITOR_FONT_DEFAULTS = editorOptions.EDITOR_FONT_DEFAULTS;
+import EDITOR_MODEL_DEFAULTS = editorOptions.EDITOR_MODEL_DEFAULTS;
+
+import { RESULTS_GRID_DEFAULTS } from 'sql/parts/query/editor/queryResultsEditor';
+
+const configurationRegistry = <IConfigurationRegistry>Registry.as(Extensions.Configuration);
+
+const resultsGridConfiguration: IConfigurationNode = {
+	id: 'resultsGrid',
+	type: 'object',
+	title: nls.localize('resultsGridConfigurationTitle', "Results Grid"),
+	overridable: true,
+	scope: ConfigurationScope.RESOURCE,
+	properties: {
+		'resultsGrid.fontFamily': {
+			type: 'string',
+			default: EDITOR_FONT_DEFAULTS.fontFamily,
+			description: nls.localize('fontFamily', "Controls the font family.")
+		},
+		'resultsGrid.fontWeight': {
+			type: 'string',
+			enum: ['normal', 'bold', '100', '200', '300', '400', '500', '600', '700', '800', '900'],
+			default: EDITOR_FONT_DEFAULTS.fontWeight,
+			description: nls.localize('fontWeight', "Controls the font weight.")
+		},
+		'resultsGrid.fontSize': {
+			type: 'number',
+			default: EDITOR_FONT_DEFAULTS.fontSize,
+			description: nls.localize('fontSize', "Controls the font size in pixels.")
+		},
+		'resultsGrid.letterSpacing': {
+			type: 'number',
+			default: EDITOR_FONT_DEFAULTS.letterSpacing,
+			description: nls.localize('letterSpacing', "Controls the letter spacing in pixels.")
+		},
+		'resultsGrid.rowHeight': {
+			type: 'number',
+			default: RESULTS_GRID_DEFAULTS.rowHeight,
+			description: nls.localize('rowHeight', "Controls the row height in pixels")
+		},
+		'resultsGrid.cellPadding': {
+			oneOf: [
+				{
+					type: 'number'
+				},
+				{
+					type: 'array',
+					items: {
+						type: 'number'
+					}
+				}
+			],
+			default: RESULTS_GRID_DEFAULTS.cellPadding,
+			description: nls.localize('cellPadding', "Controls the cell padding in pixels")
+		}
+	}
+};
+
+configurationRegistry.registerConfiguration(resultsGridConfiguration);