forked from microsoft/pxt
-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathaccessibility.ts
More file actions
65 lines (57 loc) · 2.35 KB
/
accessibility.ts
File metadata and controls
65 lines (57 loc) · 2.35 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
// Helpers designed to help to make a simulator accessible.
namespace pxsim.accessibility {
let liveRegion: HTMLDivElement;
export function makeFocusable(elem: SVGElement): void {
elem.setAttribute("focusable", "true");
elem.setAttribute("tabindex", "0");
}
export function enableKeyboardInteraction(elem: Element, handlerKeyDown?: () => void, handlerKeyUp?: () => void): void {
if (handlerKeyDown) {
elem.addEventListener('keydown', (e: KeyboardEvent) => {
const charCode = (typeof e.which == "number") ? e.which : e.keyCode;
if (charCode === 32 || charCode === 13) { // Enter or Space key
handlerKeyDown();
}
});
}
if (handlerKeyUp) {
elem.addEventListener('keyup', (e: KeyboardEvent) => {
const charCode = (typeof e.which == "number") ? e.which : e.keyCode;
if (charCode === 32 || charCode === 13) { // Enter or Space key
handlerKeyUp();
}
});
}
}
export function setAria(elem: Element, role?: string, label?: string): void {
if (role && !elem.hasAttribute("role")) {
elem.setAttribute("role", role);
}
if (label && !elem.hasAttribute("aria-label")) {
elem.setAttribute("aria-label", label);
}
}
export function setLiveContent(value: string): void {
if (!liveRegion) {
let style = "position: absolute !important;" +
"display: block;" +
"visibility: visible;" +
"overflow: hidden;" +
"width: 1px;" +
"height: 1px;" +
"margin: -1px;" +
"border: 0;" +
"padding: 0;" +
"clip: rect(0 0 0 0);";
liveRegion = document.createElement("div");
liveRegion.setAttribute("role", "status");
liveRegion.setAttribute("aria-live", "polite");
liveRegion.setAttribute("aria-hidden", "false");
liveRegion.setAttribute("style", style);
document.body.appendChild(liveRegion);
}
if (liveRegion.textContent !== value) {
liveRegion.textContent = value;
}
}
}