ckaczor/azuredatastudio
1
0
Fork 0
mirror of https://github.com/ckaczor/azuredatastudio.git synced 2026-02-16 10:58:30 -05:00
Code Issues Packages Projects Releases Wiki Activity

Adds aria labels to all input ui (#1136)

Browse Source 
* adds aria-label to inputs for connection

* formatting

* add ariaLabels to all checkboxes/inputboxes/dropdowns
This commit is contained in:
Anthony Dresser
2018-04-13 12:09:25 -07:00
committed by GitHub
parent 13fb9fdfd2
commit f739c47984
13 changed files with 97 additions and 37 deletions
Download Patch File Download Diff File Expand all files Collapse all files

37
src/sql/parts/disasterRecovery/backup/backup.component.ts
View File

@@ -207,7 +207,10 @@ export class BackupComponent {
let self = this;
this.addFooterButtons();
this.recoveryBox = new InputBox(this.recoveryModelElement.nativeElement, this._bootstrapService.contextViewService, { placeholder: this.recoveryModel });
this.recoveryBox = new InputBox(this.recoveryModelElement.nativeElement, this._bootstrapService.contextViewService, {
placeholder: this.recoveryModel,
ariaLabel: this.recoveryModelLabel
});
// Set backup type
this.backupTypeSelectBox = new SelectBox([], '', this._bootstrapService.contextViewService);
this.backupTypeSelectBox.render(this.backupTypeElement.nativeElement);
@@ -216,39 +219,46 @@ export class BackupComponent {
this.copyOnlyCheckBox = new Checkbox(this.copyOnlyElement.nativeElement, {
label: this.copyOnlyLabel,
checked: false,
onChange: (viaKeyboard) => { }
onChange: (viaKeyboard) => { },
ariaLabel: this.copyOnlyLabel
});
// Encryption checkbox
this.encryptCheckBox = new Checkbox(this.encryptElement.nativeElement, {
label: this.encryptionLabel,
checked: false,
onChange: (viaKeyboard) => self.onChangeEncrypt()
onChange: (viaKeyboard) => self.onChangeEncrypt(),
ariaLabel: this.encryptionLabel
});
// Verify backup checkbox
this.verifyCheckBox = new Checkbox(this.verifyElement.nativeElement, {
label: this.verifyContainerLabel,
checked: false,
onChange: (viaKeyboard) => { }
onChange: (viaKeyboard) => { },
ariaLabel: this.verifyContainerLabel
});
// Perform checksum checkbox
this.checksumCheckBox = new Checkbox(this.checksumElement.nativeElement, {
label: this.checksumContainerLabel,
checked: false,
onChange: (viaKeyboard) => { }
onChange: (viaKeyboard) => { },
ariaLabel: this.checksumContainerLabel
});
// Continue on error checkbox
this.continueOnErrorCheckBox = new Checkbox(this.continueOnErrorElement.nativeElement, {
label: this.continueOnErrorContainerLabel,
checked: false,
onChange: (viaKeyboard) => { }
onChange: (viaKeyboard) => { },
ariaLabel: this.continueOnErrorContainerLabel
});
// Set backup name
this.backupNameBox = new InputBox(this.backupNameElement.nativeElement, this._bootstrapService.contextViewService);
this.backupNameBox = new InputBox(this.backupNameElement.nativeElement, this._bootstrapService.contextViewService, {
ariaLabel: this.backupNameLabel
});
// Set backup path list
this.pathListBox = new ListBox([], '', this._bootstrapService.contextViewService, this._bootstrapService.clipboardService);
@@ -279,10 +289,14 @@ export class BackupComponent {
{
validationOptions: {
validation: (value: string) => !value ? ({ type: MessageType.ERROR, content: this.mediaNameRequiredError }) : null
}
});
},
ariaLabel: this.newMediaSetNameLabel
}
);
this.mediaDescriptionBox = new InputBox(this.mediaDescriptionElement.nativeElement, this._bootstrapService.contextViewService);
this.mediaDescriptionBox = new InputBox(this.mediaDescriptionElement.nativeElement, this._bootstrapService.contextViewService, {
ariaLabel: this.newMediaSetDescriptionLabel
});
// Set backup retain days
let invalidInputMessage = localize('backupComponent.invalidInput', 'Invalid input. Value must be greater than or equal 0.');
@@ -300,7 +314,8 @@ export class BackupComponent {
return null;
}
}
}
},
ariaLabel: this.setBackupRetainDaysLabel
});
// Disable elements

26
src/sql/parts/disasterRecovery/restore/restoreDialog.ts
View File

@@ -40,6 +40,7 @@ import * as DOM from 'vs/base/browser/dom';
import * as sqlops from 'sqlops';
import * as strings from 'vs/base/common/strings';
import { ServiceOptionType } from 'sql/workbench/api/common/sqlExtHostTypes';
import { mixin } from 'vs/base/common/objects';
interface FileListElement {
logicalFileName: string;
@@ -48,6 +49,11 @@ interface FileListElement {
restoreAs: string;
}
const LocalizedStrings = {
BACKFILEPATH: localize('backupFilePath', "Backup file path"),
TARGETDATABASE: localize('targetDatabase', 'Target database')
};
export class RestoreDialog extends Modal {
public viewModel: RestoreViewModel;
@@ -176,12 +182,13 @@ export class RestoreDialog extends Modal {
validationOptions: {
validation: (value: string) => !value ? ({ type: MessageType.ERROR, content: errorMessage }) : null
},
placeholder: localize('multipleBackupFilePath', 'Please enter one or more file paths separated by commas')
placeholder: localize('multipleBackupFilePath', 'Please enter one or more file paths separated by commas'),
ariaLabel: LocalizedStrings.BACKFILEPATH
};
filePathContainer.div({ class: 'dialog-input-section' }, (inputContainer) => {
inputContainer.div({ class: 'dialog-label' }, (labelContainer) => {
labelContainer.innerHtml(localize('backupFilePath', "Backup file path"));
labelContainer.safeInnerHtml(LocalizedStrings.BACKFILEPATH);
});
inputContainer.div({ class: 'dialog-input' }, (inputCellContainer) => {
@@ -218,7 +225,7 @@ export class RestoreDialog extends Modal {
destinationContainer.div({ class: 'dialog-input-section' }, (inputContainer) => {
inputContainer.div({ class: 'dialog-label' }, (labelContainer) => {
labelContainer.innerHtml(localize('targetDatabase', 'Target database'));
labelContainer.innerHtml(LocalizedStrings.TARGETDATABASE);
});
inputContainer.div({ class: 'dialog-input' }, (inputCellContainer) => {
@@ -226,7 +233,8 @@ export class RestoreDialog extends Modal {
inputCellContainer.style('width', '100%');
this._databaseDropdown = new Dropdown(inputCellContainer.getHTMLElement(), this._contextViewService, this._themeService,
{
strictSelection: false
strictSelection: false,
ariaLabel: LocalizedStrings.TARGETDATABASE
}
);
this._databaseDropdown.onValueChange(s => {
@@ -514,7 +522,8 @@ export class RestoreDialog extends Modal {
checkbox = new Checkbox(inputCellContainer.getHTMLElement(), {
label: label,
checked: isChecked,
onChange: onCheck
onChange: onCheck,
ariaLabel: label
});
});
return checkbox;
@@ -537,13 +546,16 @@ export class RestoreDialog extends Modal {
private createInputBoxHelper(container: Builder, label: string, options?: IInputOptions): InputBox {
let inputBox: InputBox;
let ariaOptions = {
ariaLabel: label
};
container.div({ class: 'dialog-input-section' }, (inputContainer) => {
inputContainer.div({ class: 'dialog-label' }, (labelContainer) => {
labelContainer.innerHtml(label);
labelContainer.safeInnerHtml(label);
});
inputContainer.div({ class: 'dialog-input' }, (inputCellContainer) => {
inputBox = new InputBox(inputCellContainer.getHTMLElement(), this._contextViewService, options);
inputBox = new InputBox(inputCellContainer.getHTMLElement(), this._contextViewService, mixin(ariaOptions, options));
});
});
return inputBox;