mirror of
https://github.com/ckaczor/azuredatastudio.git
synced 2026-01-14 01:25:37 -05:00
fix arrow keys not working in server group dialog (#16825)
* fix arro keys not working in server group dialog * use existing container instead of dom element * proper fix with code cleaning
This commit is contained in:
@@ -9,7 +9,7 @@ import { Colorbox } from 'sql/base/browser/ui/colorbox/colorbox';
|
||||
import { MessageType } from 'vs/base/browser/ui/inputbox/inputBox';
|
||||
import * as DOM from 'vs/base/browser/dom';
|
||||
import { StandardKeyboardEvent } from 'vs/base/browser/keyboardEvent';
|
||||
import { KeyCode, KeyMod } from 'vs/base/common/keyCodes';
|
||||
import { KeyCode } from 'vs/base/common/keyCodes';
|
||||
import { IThemeService } from 'vs/platform/theme/common/themeService';
|
||||
import { attachInputBoxStyler, attachCheckboxStyler, attachButtonStyler } from 'vs/platform/theme/common/styler';
|
||||
import { Event, Emitter } from 'vs/base/common/event';
|
||||
@@ -120,14 +120,8 @@ export class ServerGroupDialog extends Modal {
|
||||
this._serverGroupContainer = DOM.append(body, DOM.$('.group-color-options'));
|
||||
this.fillGroupColors(this._serverGroupContainer);
|
||||
|
||||
DOM.addStandardDisposableListener(body, DOM.EventType.KEY_DOWN, (event: StandardKeyboardEvent) => {
|
||||
if (event.equals(KeyMod.Shift | KeyCode.Tab)) {
|
||||
this.preventDefaultKeyboardEvent(event);
|
||||
this.focusPrevious();
|
||||
} else if (event.equals(KeyCode.Tab)) {
|
||||
this.preventDefaultKeyboardEvent(event);
|
||||
this.focusNext();
|
||||
} else if (event.equals(KeyCode.RightArrow) || event.equals(KeyCode.LeftArrow)) {
|
||||
DOM.addStandardDisposableListener(this._serverGroupContainer, DOM.EventType.KEY_DOWN, (event: StandardKeyboardEvent) => {
|
||||
if (event.equals(KeyCode.RightArrow) || event.equals(KeyCode.LeftArrow)) {
|
||||
this.preventDefaultKeyboardEvent(event);
|
||||
this.focusNextColor(event.equals(KeyCode.RightArrow));
|
||||
}
|
||||
@@ -139,48 +133,6 @@ export class ServerGroupDialog extends Modal {
|
||||
e.stopPropagation();
|
||||
}
|
||||
|
||||
private isFocusOnColors(): boolean {
|
||||
let result = false;
|
||||
this._colorColorBoxesMap.forEach(({ colorbox: colorbox }) => {
|
||||
if (document.activeElement === colorbox.domNode) {
|
||||
result = true;
|
||||
}
|
||||
});
|
||||
|
||||
return result;
|
||||
}
|
||||
|
||||
private focusNext(): void {
|
||||
const renderedDialog = this.withRenderedDialog;
|
||||
if (renderedDialog.groupNameInputBox.hasFocus()) {
|
||||
renderedDialog.groupDescriptionInputBox.focus();
|
||||
} else if (renderedDialog.groupDescriptionInputBox.hasFocus()) {
|
||||
this._colorColorBoxesMap[this._selectedColorOption ?? 0].colorbox.focus();
|
||||
} else if (this.isFocusOnColors()) {
|
||||
renderedDialog.addServerButton.enabled ? renderedDialog.addServerButton.focus() : renderedDialog.closeButton.focus();
|
||||
} else if (document.activeElement === renderedDialog.addServerButton.element) {
|
||||
renderedDialog.closeButton.focus();
|
||||
}
|
||||
else if (document.activeElement === renderedDialog.closeButton.element) {
|
||||
renderedDialog.groupNameInputBox.focus();
|
||||
}
|
||||
}
|
||||
|
||||
private focusPrevious(): void {
|
||||
const renderedDialog = this.withRenderedDialog;
|
||||
if (document.activeElement === renderedDialog.closeButton.element) {
|
||||
renderedDialog.addServerButton.enabled ? renderedDialog.addServerButton.focus() : this._colorColorBoxesMap[this._selectedColorOption ?? 0].colorbox.focus();
|
||||
} else if (document.activeElement === renderedDialog.addServerButton.element) {
|
||||
this._colorColorBoxesMap[this._selectedColorOption ?? 0].colorbox.focus();
|
||||
} else if (this.isFocusOnColors()) {
|
||||
renderedDialog.groupDescriptionInputBox.focus();
|
||||
} else if (renderedDialog.groupDescriptionInputBox.hasFocus()) {
|
||||
renderedDialog.groupNameInputBox.focus();
|
||||
} else if (renderedDialog.groupNameInputBox.hasFocus()) {
|
||||
renderedDialog.closeButton.focus();
|
||||
}
|
||||
}
|
||||
|
||||
private focusNextColor(moveRight: boolean): void {
|
||||
let focusIndex: number = -1;
|
||||
for (let i = 0; i < this._colorColorBoxesMap.length; i++) {
|
||||
|
||||
Reference in New Issue
Block a user