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

Adding keyboard shortcuts for column resizing in slickgrid (#21100)

Browse Source 
* Adding column resize keyboard shortcuts in slickgrid

* Switching to standard keyboard evt

* Adding comment for the functionality

* Cleaning up code and adding more comments

* Using quick input to get column resize width

* Adding check for negative sizes

* Fixing some stuff
This commit is contained in:
Aasim Khan
2022-11-04 16:15:04 -07:00
committed by GitHub
parent e98f2e2745
commit 00b797b4f3
33 changed files with 192 additions and 62 deletions
Download Patch File Download Diff File Expand all files Collapse all files

50
src/sql/base/browser/ui/table/table.ts
View File

@@ -20,7 +20,11 @@ import { Event, Emitter } from 'vs/base/common/event';
import { range } from 'vs/base/common/arrays';
import { AsyncDataProvider } from 'sql/base/browser/ui/table/asyncDataView';
import { IDisposableDataProvider } from 'sql/base/common/dataProvider';
import { StandardKeyboardEvent } from 'vs/base/browser/keyboardEvent';
import { KeyCode } from 'vs/base/common/keyCodes';
import { IAccessibilityProvider } from 'sql/base/browser/ui/accessibility/accessibilityProvider';
import { IQuickInputProvider } from 'sql/base/browser/ui/qucikInput/quickInputProvider';
import { localize } from 'vs/nls';
function getDefaultOptions<T>(): Slick.GridOptions<T> {
return <Slick.GridOptions<T>>{
@@ -66,7 +70,12 @@ export class Table<T extends Slick.SlickData> extends Widget implements IDisposa
private _onBlur = new Emitter<void>();
public readonly onBlur = this._onBlur.event;
constructor(parent: HTMLElement, accessibilityProvider: IAccessibilityProvider, configuration?: ITableConfiguration<T>, options?: Slick.GridOptions<T>) {
constructor(
parent: HTMLElement,
accessibilityProvider: IAccessibilityProvider,
private _quickInputProvider: IQuickInputProvider,
configuration?: ITableConfiguration<T>,
options?: Slick.GridOptions<T>) {
super();
if (!configuration || !configuration.dataProvider || isArray(configuration.dataProvider)) {
this._data = new TableDataView<T>(configuration && configuration.dataProvider as Array<T>);
@@ -135,8 +144,16 @@ export class Table<T extends Slick.SlickData> extends Widget implements IDisposa
this.mapMouseEvent(this._grid.onDblClick, this._onDoubleClick);
this._grid.onColumnsResized.subscribe(() => this._onColumnResize.fire());
this._grid.onKeyDown.subscribe((e, args: Slick.OnKeyDownEventArgs<T>) => {
this._grid.onKeyDown.subscribe(async (e, args: Slick.OnKeyDownEventArgs<T>) => {
const evt = (e as JQuery.TriggeredEvent).originalEvent as KeyboardEvent;
const stdEvt = new StandardKeyboardEvent(evt);
if (stdEvt.altKey && stdEvt.shiftKey && stdEvt.keyCode === KeyCode.KeyS) {
const newWidth = this.resizeActiveCellColumnByQuickInput();
if (newWidth) {
stdEvt.stopPropagation();
stdEvt.preventDefault();
}
}
this._onKeyDown.fire({
event: evt,
cell: {
@@ -147,6 +164,35 @@ export class Table<T extends Slick.SlickData> extends Widget implements IDisposa
});
}
private async resizeActiveCellColumnByQuickInput(): Promise<number | undefined> {
const activeCell = this._grid.getActiveCell();
if (activeCell) {
const columns = this._grid.getColumns();
if (columns[activeCell.cell].resizable) {
const newColumnWidth = await this._quickInputProvider.input({
placeHolder: localize('table.resizeColumn', "Provide new column width"),
prompt: localize('table.resizeColumn', "Provide new column width"),
value: columns[activeCell.cell].width.toString(),
validateInput: async (value: string) => {
if (!Number(value)) {
return localize('table.resizeColumn.invalid', "Invalid column width");
} else if (parseInt(value) <= 0) {
return localize('table.resizeColumn.negativeSize', "Size cannot be 0 or negative");
}
return undefined;
}
});
if (newColumnWidth) {
columns[activeCell.cell].width = parseInt(newColumnWidth);
this._grid.setColumns(columns);
this.grid.setActiveCell(activeCell.row, activeCell.cell);
}
return parseInt(newColumnWidth);
}
}
return undefined;
}
public rerenderGrid() {
this._grid.updateRowCount();
this._grid.setColumns(this._grid.getColumns());