random-mirrors/cosmos-explorer
1
0
Fork 0
mirror of https://github.com/Azure/cosmos-explorer.git synced 2025-12-19 00:41:31 +00:00
Code Issues Packages Projects Releases Wiki Activity

keyboard accessibility added to rows in table entities

Browse Source
This commit is contained in:
Sampath
2023-06-06 17:22:27 +05:30
parent 45b9f6b244
commit b48c3d7735
1 changed files with 40 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

44
src/Explorer/Tables/DataTable/DataTableBindingManager.ts
View File

@@ -1,15 +1,14 @@
import * as ko from "knockout"; import * as ko from "knockout";
import * as _ from "underscore"; import * as _ from "underscore";
import QueryTablesTab from "../../Tabs/QueryTablesTab";
import * as Constants from "../Constants"; import * as Constants from "../Constants";
import * as ViewModels from "../../../Contracts/ViewModels"; import * as Entities from "../Entities";
import * as Utilities from "../Utilities";
import * as DataTableBuilder from "./DataTableBuilder"; import * as DataTableBuilder from "./DataTableBuilder";
import DataTableOperationManager from "./DataTableOperationManager"; import DataTableOperationManager from "./DataTableOperationManager";
import * as DataTableOperations from "./DataTableOperations"; import * as DataTableOperations from "./DataTableOperations";
import QueryTablesTab from "../../Tabs/QueryTablesTab";
import TableEntityListViewModel from "./TableEntityListViewModel"; import TableEntityListViewModel from "./TableEntityListViewModel";
import * as Utilities from "../Utilities";
import * as Entities from "../Entities";
/** /**
* Custom binding manager of datatable * Custom binding manager of datatable
@@ -42,6 +41,10 @@ function bindDataTable(element: any, valueAccessor: any, allBindings: any, viewM
createDataTable(0, tableEntityListViewModel, queryTablesTab); // Fake a DataTable to start. createDataTable(0, tableEntityListViewModel, queryTablesTab); // Fake a DataTable to start.
$(window).resize(updateTableScrollableRegionMetrics); $(window).resize(updateTableScrollableRegionMetrics);
operationManager.focusTable(); // Also selects the first row if needed. operationManager.focusTable(); // Also selects the first row if needed.
// Attach the arrow key event handler to the table element
$dataTable.on("keydown", (event: JQueryEventObject) => {
handlearrowkey(element, valueAccessor, allBindings, viewModel, bindingContext, event);
});
} }
function onTableColumnChange(enablePrompt: boolean = true, queryTablesTab: QueryTablesTab) { function onTableColumnChange(enablePrompt: boolean = true, queryTablesTab: QueryTablesTab) {
@@ -210,6 +213,39 @@ function selectionChanged(element: any, valueAccessor: any, allBindings: any, vi
}); });
//selected = bindingContext.$data.selected(); //selected = bindingContext.$data.selected();
} }
function handlearrowkey(
element: any,
valueAccessor: any,
allBindings: any,
viewModel: any,
bindingContext: any,
event: JQueryEventObject
) {
let isUpArrowKey: boolean = event.keyCode === Constants.keyCodes.UpArrow;
let isDownArrowKey: boolean = event.keyCode === Constants.keyCodes.DownArrow;
if (isUpArrowKey || isDownArrowKey) {
let $dataTable = $(element);
let $selectedRow = $dataTable.find("tr.selected");
if ($selectedRow.length === 0) {
// No row is currently selected, select the first row
$selectedRow = $dataTable.find("tr:first");
$selectedRow.addClass("selected");
} else {
let $targetRow = isUpArrowKey ? $selectedRow.prev("tr") : $selectedRow.next("tr");
if ($targetRow.length > 0) {
// Remove the selected class from the current row and add it to the target row
$selectedRow.removeClass("selected").attr("tabindex", "-1");
$targetRow.addClass("selected").attr("tabindex", "0");
$targetRow.focus();
}
}
event.preventDefault();
}
}
function dataChanged(element: any, valueAccessor: any, allBindings: any, viewModel: any, bindingContext: any) { function dataChanged(element: any, valueAccessor: any, allBindings: any, viewModel: any, bindingContext: any) {
// do nothing for now // do nothing for now