EditDataTest Merge (removal of angular in edit data) (#8951)

* another commmit

* Now shows blank grid, nullcheck in queryhistory

* renamed onAngularLoaded to onComponentLoaded

* removed whitespace

* removed unused dataservice import

* now displays data, need to fix contextmenu actions

* minor changes

* another small commit

* added timeout for context menu

* updated queryhistoryserviceimpl

* removed log

* added commented out contextmenuregistrations

* context menu now shows up need to test

* added plugin registration WIP

* another commit

* yet another commit

* added wip function

* Clean up commit

* more cleaning up

* removed accessor

* renamed instances of parts

* updated

* fixed merge conflicts

* refactored bootstrapparams

* fixed code

* small changes to format

* set editable to true for testing

* added more options

* moved options to separate variable

* added texteditorclass for later

* added rudimentary create editor support

* changed grid.resize.emit to fire

* added formatterfactory

* added tslint disable

* removed debug message

* added more functions from Slickgrid.ts

* added wip handlechanges function

* another change

* added columndefinitions

* Managed to display table using handlechange

* added ability to edit for now

* added changes to table creation

* added setupevents

* added onInit

* fixed sql.xlf

* minor changes

* tidying up

* more cleaning up

* changed console.log messages to debug ones.

* added this.enableEditing

* made changes to getoverridabletexteditor

* fixed opencontextmenu

* added timeout for detectChange

* need to find way to run oncontext asynchronously

* check stuff

* oncontextmenu now no longer constantly refreshes

* added oldDataRows for future use

* add check for datarows

* small changes made

* set enableediting to true

* more changes

* added additional information for handlechanges

* another change

* more changes

* set enableediting to true

* fixed rerender

* added small test mssage for jquery

* text editor is in getOverridableTextEditorClass()

* removed debug messages

* added transparency for input.editor for table.

* need to find out how to add editing for input

* Added grid div to make slickgrid style work

* reinstated selected.

* disabled selectedcellcssclass

* restored selected

* removed selectionmodel due to not being found in the original code

* Added externalSelectionModel for correct results

* removed selectionmodel as its not used.

* WIP work on refreshresultsets

* temporarily bringing back selection model for now

* added getSelectedRanges from slickgrid into Table

* added getselectedranges from slickgrid into table

* small cleanup changes

* removed detectchanges

* removed last of detectchanges

* return of toprownumber

* no need for toprownumber

* removed isColumnLoading

* some small formatting

* fixed null check

* added back todo comment

* Added fix for context menu

* small change

* added missing value to getFormatter in grid panel

* added fix for last row italics

* added fix for null inconsistencies

* Some consolidation

* added new check for null cells

* minor change

* add check for selections (usually undefined)

* removed null check in formatters

* Some changes made

* changed plugins array

* removed todo

* renamed some variables

* deleted html file

* Moved height and width to editData.css

* added box-sizing for slickgridcontainer

* fixed editdatagridpanel css

* added small changes

* More minor changes

* removed params

* renamed refreshResultsets to refreshDatasets

* removed the  stylesheet.remove lines

* added fix for null

* removed tables

* removed spaces in refreshGrid

* More minor changes

* optimization and formatting

* removal of unnecessary lines

* replaced firstRender in some parts with firstLoad

* Added timeout fix

* minor changes

* Still testing

* cleanup

* restored 200 timeout

* added styling changes for editdata

* removed angular2-slickgrid and added styling

* Small formatting changes to editDataGridPanel

* consolidation

src/sql/base/browser/ui/table/asyncDataView.ts

@@ -15,6 +15,10 @@ export interface IObservableCollection<T> {
 	dispose(): void;
 }
 
+export interface ISlickColumn<T> extends Slick.Column<T> {
+	isEditable?: boolean;
+}
+
 class DataWindow<T> {
 	private _data: T[] | undefined;
 	private _length: number = 0;
@@ -179,7 +183,7 @@ export class VirtualizedCollection<T extends Slick.SlickData> implements IObserv
 		return this.placeHolderGenerator(index);
 	}
 
-	private resetWindowsAroundIndex(index: number): void {
+	public resetWindowsAroundIndex(index: number): void {
 
 		let bufferWindowBeforeStart = Math.max(0, index - this.windowSize * 1.5);
 		let bufferWindowBeforeEnd = Math.max(0, index - this.windowSize / 2);

src/sql/base/browser/ui/table/media/slickColorTheme.css

@@ -69,8 +69,8 @@
 	--color-grid-dirty-text: #101010;
 }
 /* grid styling */
-
-.vs slick-grid.active .grid .slick-cell.active {
+.vs .slickgridContainer .grid .slick-cell .active,
+.vs slick-grid.active .grid .slick-cell .active {
 	border-color: var(--color-cell-border-active);
 }
 
@@ -204,7 +204,7 @@
 }
 
 /* grid styling */
-
+.vs-dark .slickgridContainer .grid .slick-cell.active,
 .vs-dark slick-grid.active .grid .slick-cell.active {
 	border-color: var(--color-cell-border-active);
 }

src/sql/base/browser/ui/table/table.ts

@@ -19,6 +19,7 @@ import { Widget } from 'vs/base/browser/ui/widget';
 import { isArray, isBoolean } from 'vs/base/common/types';
 import { Event, Emitter } from 'vs/base/common/event';
 import { range } from 'vs/base/common/arrays';
+import { AsyncDataProvider } from 'sql/base/browser/ui/table/asyncDataView';
 
 function getDefaultOptions<T>(): Slick.GridOptions<T> {
 	return <Slick.GridOptions<T>>{
@@ -49,6 +50,9 @@ export class Table<T extends Slick.SlickData> extends Widget implements IDisposa
 	private _onClick = new Emitter<ITableMouseEvent>();
 	public readonly onClick: Event<ITableMouseEvent> = this._onClick.event;
 
+	private _onHeaderClick = new Emitter<ITableMouseEvent>();
+	public readonly onHeaderClick: Event<ITableMouseEvent> = this._onHeaderClick.event;
+
 	private _onColumnResize = new Emitter<void>();
 	public readonly onColumnResize = this._onColumnResize.event;
 
@@ -111,9 +115,17 @@ export class Table<T extends Slick.SlickData> extends Widget implements IDisposa
 
 		this.mapMouseEvent(this._grid.onContextMenu, this._onContextMenu);
 		this.mapMouseEvent(this._grid.onClick, this._onClick);
+		this.mapMouseEvent(this._grid.onHeaderClick, this._onHeaderClick);
 		this._grid.onColumnsResized.subscribe(() => this._onColumnResize.fire());
 	}
 
+	public rerenderGrid(start: number, end: number) {
+		this._grid.updateRowCount();
+		this._grid.setColumns(this._grid.getColumns());
+		this._grid.invalidateAllRows();
+		this._grid.render();
+	}
+
 	private mapMouseEvent(slickEvent: Slick.Event<any>, emitter: Emitter<ITableMouseEvent>) {
 		slickEvent.subscribe((e: JQuery.Event) => {
 			const originalEvent = e.originalEvent;
@@ -151,8 +163,9 @@ export class Table<T extends Slick.SlickData> extends Widget implements IDisposa
 
 	setData(data: Array<T>): void;
 	setData(data: TableDataView<T>): void;
-	setData(data: Array<T> | TableDataView<T>): void {
-		if (data instanceof TableDataView) {
+	setData(data: AsyncDataProvider<T>): void;
+	setData(data: Array<T> | TableDataView<T> | AsyncDataProvider<T>): void {
+		if (data instanceof TableDataView || data instanceof AsyncDataProvider) {
 			this._data = data;
 		} else {
 			this._data = new TableDataView<T>(data);
@@ -197,6 +210,18 @@ export class Table<T extends Slick.SlickData> extends Widget implements IDisposa
 		this._grid.setSelectionModel(model);
 	}
 
+	getSelectionModel(): Slick.SelectionModel<T, Array<Slick.Range>> {
+		return this._grid.getSelectionModel();
+	}
+
+	getSelectedRanges(): Slick.Range[] {
+		let selectionModel = this._grid.getSelectionModel();
+		if (selectionModel && selectionModel.getSelectedRanges) {
+			return selectionModel.getSelectedRanges();
+		}
+		return <Slick.Range[]><unknown>undefined;
+	}
+
 	focus(): void {
 		this._grid.focus();
 	}
@@ -205,6 +230,10 @@ export class Table<T extends Slick.SlickData> extends Widget implements IDisposa
 		this._grid.setActiveCell(row, cell);
 	}
 
+	setActive(): void {
+		this._grid.setActiveCell(0, 1);
+	}
+
 	get activeCell(): Slick.Cell {
 		return this._grid.getActiveCell();
 	}