maxmustermann/vscode
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

aria: add status role

Browse source
This commit is contained in:
Benjamin Pasero 2016-02-04 08:04:45 +01:00
parent 88be7dfe6e
commit 22a03fe9fd
3 changed files with 25 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
src/vs/base/browser/ui/aria/aria.css
View file

@ -3,6 +3,6 @@
* Licensed under the MIT License. See License.txt in the project root for license information.
*--------------------------------------------------------------------------------------------*/
.aria-alert-container {
.aria-container {
position: absolute; /* try to hide from workbench but not from screen readers */
}

30
src/vs/base/browser/ui/aria/aria.ts
View file

@ -8,20 +8,36 @@
import 'vs/css!./aria';
import {Builder, $} from 'vs/base/browser/builder';
let ariaAlertContainer: Builder;
export function setAlertContainer(parent: HTMLElement) {
ariaAlertContainer = $('.aria-alert-container').attr({ 'role': 'alert', 'aria-atomic': 'true' }).appendTo(parent);
let ariaContainer: Builder;
let alertContainer: Builder;
let statusContainer: Builder;
export function setARIAContainer(parent: HTMLElement) {
ariaContainer = $('.aria-container').appendTo(parent);
alertContainer = $('.alert').appendTo(ariaContainer).attr({ 'role': 'alert', 'aria-atomic': 'true' });
statusContainer = $('.status').appendTo(ariaContainer).attr({ 'role': 'status', 'aria-atomic': 'true' });
}
/**
* Given the provided message, will make sure that it is read as alert to screen readers.
*/
export function alert(msg: string): void {
if (!ariaAlertContainer) {
console.warn('ARIA alert support needs a container. Call setAlertContainer() first.');
insertMessage(alertContainer, msg);
}
/**
* Given the provided message, will make sure that it is read as status to screen readers.
*/
export function status(msg: string): void {
insertMessage(statusContainer, msg);
}
function insertMessage(target: Builder, msg: string): void {
if (!ariaContainer) {
console.warn('ARIA support needs a container. Call setARIAContainer() first.');
return;
}
$(ariaAlertContainer).empty();
$('span').text(msg).appendTo(ariaAlertContainer);
$(target).empty();
$(target).text(msg);
}

2
src/vs/workbench/electron-browser/shell.ts
View file

@ -194,7 +194,7 @@ export class WorkbenchShell {
private createContents(parent: Builder): Builder {
// ARIA
aria.setAlertContainer(document.body);
aria.setARIAContainer(document.body);
// Workbench Container
let workbenchContainer = $(parent).div();