OLD | NEW |
1 // Copyright 2014 The Chromium Authors. All rights reserved. | 1 // Copyright 2014 The Chromium Authors. All rights reserved. |
2 // Use of this source code is governed by a BSD-style license that can be | 2 // Use of this source code is governed by a BSD-style license that can be |
3 // found in the LICENSE file. | 3 // found in the LICENSE file. |
4 | 4 |
5 /** | 5 /** |
6 * @fileoverview A collection of JavaScript utilities used to simplify working | 6 * @fileoverview A collection of JavaScript utilities used to simplify working |
7 * with ARIA (http://www.w3.org/TR/wai-aria). | 7 * with ARIA (http://www.w3.org/TR/wai-aria). |
8 */ | 8 */ |
9 | 9 |
10 | 10 |
(...skipping 13 matching lines...) Expand all Loading... |
24 | 24 |
25 | 25 |
26 /** | 26 /** |
27 * A mapping from ARIA role names to their message ids. | 27 * A mapping from ARIA role names to their message ids. |
28 * Note: If you are adding a new mapping, the new message identifier needs a | 28 * Note: If you are adding a new mapping, the new message identifier needs a |
29 * corresponding braille message. For example, a message id 'tag_button' | 29 * corresponding braille message. For example, a message id 'tag_button' |
30 * requires another message 'tag_button_brl' within messages.js. | 30 * requires another message 'tag_button_brl' within messages.js. |
31 * @type {Object<string>} | 31 * @type {Object<string>} |
32 */ | 32 */ |
33 cvox.AriaUtil.WIDGET_ROLE_TO_NAME = { | 33 cvox.AriaUtil.WIDGET_ROLE_TO_NAME = { |
34 'alert' : 'aria_role_alert', | 34 'alert' : 'role_alert', |
35 'alertdialog' : 'aria_role_alertdialog', | 35 'alertdialog' : 'role_alertdialog', |
36 'button' : 'aria_role_button', | 36 'button' : 'role_button', |
37 'checkbox' : 'aria_role_checkbox', | 37 'checkbox' : 'role_checkbox', |
38 'columnheader' : 'aria_role_columnheader', | 38 'columnheader' : 'role_columnheader', |
39 'combobox' : 'aria_role_combobox', | 39 'combobox' : 'role_combobox', |
40 'dialog' : 'aria_role_dialog', | 40 'dialog' : 'role_dialog', |
41 'grid' : 'aria_role_grid', | 41 'grid' : 'role_grid', |
42 'gridcell' : 'aria_role_gridcell', | 42 'gridcell' : 'role_gridcell', |
43 'link' : 'aria_role_link', | 43 'link' : 'role_link', |
44 'listbox' : 'aria_role_listbox', | 44 'listbox' : 'role_listbox', |
45 'log' : 'aria_role_log', | 45 'log' : 'role_log', |
46 'marquee' : 'aria_role_marquee', | 46 'marquee' : 'role_marquee', |
47 'menu' : 'aria_role_menu', | 47 'menu' : 'role_menu', |
48 'menubar' : 'aria_role_menubar', | 48 'menubar' : 'role_menubar', |
49 'menuitem' : 'aria_role_menuitem', | 49 'menuitem' : 'role_menuitem', |
50 'menuitemcheckbox' : 'aria_role_menuitemcheckbox', | 50 'menuitemcheckbox' : 'role_menuitemcheckbox', |
51 'menuitemradio' : 'aria_role_menuitemradio', | 51 'menuitemradio' : 'role_menuitemradio', |
52 'option' : 'aria_role_option', | 52 'option' : 'role_option', |
53 'progressbar' : 'aria_role_progressbar', | 53 'progressbar' : 'role_progressbar', |
54 'radio' : 'aria_role_radio', | 54 'radio' : 'role_radio', |
55 'radiogroup' : 'aria_role_radiogroup', | 55 'radiogroup' : 'role_radiogroup', |
56 'rowheader' : 'aria_role_rowheader', | 56 'rowheader' : 'role_rowheader', |
57 'scrollbar' : 'aria_role_scrollbar', | 57 'scrollbar' : 'role_scrollbar', |
58 'slider' : 'aria_role_slider', | 58 'slider' : 'role_slider', |
59 'spinbutton' : 'aria_role_spinbutton', | 59 'spinbutton' : 'role_spinbutton', |
60 'status' : 'aria_role_status', | 60 'status' : 'role_status', |
61 'tab' : 'aria_role_tab', | 61 'tab' : 'role_tab', |
62 'tablist' : 'aria_role_tablist', | 62 'tablist' : 'role_tablist', |
63 'tabpanel' : 'aria_role_tabpanel', | 63 'tabpanel' : 'role_tabpanel', |
64 'textbox' : 'aria_role_textbox', | 64 'textbox' : 'role_textbox', |
65 'timer' : 'aria_role_timer', | 65 'timer' : 'role_timer', |
66 'toolbar' : 'aria_role_toolbar', | 66 'toolbar' : 'role_toolbar', |
67 'tooltip' : 'aria_role_tooltip', | 67 'tooltip' : 'role_tooltip', |
68 'treeitem' : 'aria_role_treeitem' | 68 'treeitem' : 'role_treeitem' |
69 }; | 69 }; |
70 | 70 |
71 | 71 |
72 /** | 72 /** |
73 * Note: If you are adding a new mapping, the new message identifier needs a | 73 * Note: If you are adding a new mapping, the new message identifier needs a |
74 * corresponding braille message. For example, a message id 'tag_button' | 74 * corresponding braille message. For example, a message id 'tag_button' |
75 * requires another message 'tag_button_brl' within messages.js. | 75 * requires another message 'tag_button_brl' within messages.js. |
76 * @type {Object<string>} | 76 * @type {Object<string>} |
77 */ | 77 */ |
78 cvox.AriaUtil.STRUCTURE_ROLE_TO_NAME = { | 78 cvox.AriaUtil.STRUCTURE_ROLE_TO_NAME = { |
79 'article' : 'aria_role_article', | 79 'article' : 'role_article', |
80 'application' : 'aria_role_application', | 80 'application' : 'role_application', |
81 'banner' : 'aria_role_banner', | 81 'banner' : 'role_banner', |
82 'columnheader' : 'aria_role_columnheader', | 82 'columnheader' : 'role_columnheader', |
83 'complementary' : 'aria_role_complementary', | 83 'complementary' : 'role_complementary', |
84 'contentinfo' : 'aria_role_contentinfo', | 84 'contentinfo' : 'role_contentinfo', |
85 'definition' : 'aria_role_definition', | 85 'definition' : 'role_definition', |
86 'directory' : 'aria_role_directory', | 86 'directory' : 'role_directory', |
87 'document' : 'aria_role_document', | 87 'document' : 'role_document', |
88 'form' : 'aria_role_form', | 88 'form' : 'role_form', |
89 'group' : 'aria_role_group', | 89 'group' : 'role_group', |
90 'heading' : 'aria_role_heading', | 90 'heading' : 'role_heading', |
91 'img' : 'aria_role_img', | 91 'img' : 'role_img', |
92 'list' : 'aria_role_list', | 92 'list' : 'role_list', |
93 'listitem' : 'aria_role_listitem', | 93 'listitem' : 'role_listitem', |
94 'main' : 'aria_role_main', | 94 'main' : 'role_main', |
95 'math' : 'aria_role_math', | 95 'math' : 'role_math', |
96 'navigation' : 'aria_role_navigation', | 96 'navigation' : 'role_navigation', |
97 'note' : 'aria_role_note', | 97 'note' : 'role_note', |
98 'region' : 'aria_role_region', | 98 'region' : 'role_region', |
99 'rowheader' : 'aria_role_rowheader', | 99 'rowheader' : 'role_rowheader', |
100 'search' : 'aria_role_search', | 100 'search' : 'role_search', |
101 'separator' : 'aria_role_separator' | 101 'separator' : 'role_separator' |
102 }; | 102 }; |
103 | 103 |
104 | 104 |
105 /** | 105 /** |
106 * @type {Array<Object>} | 106 * @type {Array<Object>} |
107 */ | 107 */ |
108 cvox.AriaUtil.ATTRIBUTE_VALUE_TO_STATUS = [ | 108 cvox.AriaUtil.ATTRIBUTE_VALUE_TO_STATUS = [ |
109 { name: 'aria-autocomplete', values: | 109 { name: 'aria-autocomplete', values: |
110 {'inline' : 'aria_autocomplete_inline', | 110 {'inline' : 'aria_autocomplete_inline', |
111 'list' : 'aria_autocomplete_list', | 111 'list' : 'aria_autocomplete_list', |
(...skipping 180 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
292 * @return {string} The role name message identifier for the targetNode. | 292 * @return {string} The role name message identifier for the targetNode. |
293 */ | 293 */ |
294 cvox.AriaUtil.getRoleNameMsg = function(targetNode) { | 294 cvox.AriaUtil.getRoleNameMsg = function(targetNode) { |
295 var roleName; | 295 var roleName; |
296 if (targetNode && targetNode.getAttribute) { | 296 if (targetNode && targetNode.getAttribute) { |
297 var role = cvox.AriaUtil.getRoleAttribute(targetNode); | 297 var role = cvox.AriaUtil.getRoleAttribute(targetNode); |
298 | 298 |
299 // Special case for pop-up buttons. | 299 // Special case for pop-up buttons. |
300 if (targetNode.getAttribute('aria-haspopup') == 'true' && | 300 if (targetNode.getAttribute('aria-haspopup') == 'true' && |
301 cvox.AriaUtil.isButton(targetNode)) { | 301 cvox.AriaUtil.isButton(targetNode)) { |
302 return 'aria_role_popup_button'; | 302 return 'role_popup_button'; |
303 } | 303 } |
304 | 304 |
305 if (role) { | 305 if (role) { |
306 roleName = cvox.AriaUtil.getRoleNameMsgForRole_(role); | 306 roleName = cvox.AriaUtil.getRoleNameMsgForRole_(role); |
307 if (!roleName) { | 307 if (!roleName) { |
308 roleName = cvox.AriaUtil.STRUCTURE_ROLE_TO_NAME[role]; | 308 roleName = cvox.AriaUtil.STRUCTURE_ROLE_TO_NAME[role]; |
309 } | 309 } |
310 } | 310 } |
311 | 311 |
312 // To a user, a menu item within a menu bar is called a "menu"; | 312 // To a user, a menu item within a menu bar is called a "menu"; |
(...skipping 25 matching lines...) Expand all Loading... |
338 | 338 |
339 /** | 339 /** |
340 * Returns a string to be presented to the user that identifies what the | 340 * Returns a string to be presented to the user that identifies what the |
341 * targetNode's role is. | 341 * targetNode's role is. |
342 * | 342 * |
343 * @param {Node} targetNode The node to get the role name for. | 343 * @param {Node} targetNode The node to get the role name for. |
344 * @return {string} The role name for the targetNode. | 344 * @return {string} The role name for the targetNode. |
345 */ | 345 */ |
346 cvox.AriaUtil.getRoleName = function(targetNode) { | 346 cvox.AriaUtil.getRoleName = function(targetNode) { |
347 var roleMsg = cvox.AriaUtil.getRoleNameMsg(targetNode); | 347 var roleMsg = cvox.AriaUtil.getRoleNameMsg(targetNode); |
348 var roleName = cvox.ChromeVox.msgs.getMsg(roleMsg); | 348 var roleName = Msgs.getMsg(roleMsg); |
349 var role = cvox.AriaUtil.getRoleAttribute(targetNode); | 349 var role = cvox.AriaUtil.getRoleAttribute(targetNode); |
350 if ((role == 'heading') && (targetNode.hasAttribute('aria-level'))) { | 350 if ((role == 'heading') && (targetNode.hasAttribute('aria-level'))) { |
351 roleName += ' ' + targetNode.getAttribute('aria-level'); | 351 roleName += ' ' + targetNode.getAttribute('aria-level'); |
352 } | 352 } |
353 return roleName ? roleName : ''; | 353 return roleName ? roleName : ''; |
354 }; | 354 }; |
355 | 355 |
356 /** | 356 /** |
357 * Returns a string that gives information about the state of the targetNode. | 357 * Returns a string that gives information about the state of the targetNode. |
358 * | 358 * |
(...skipping 175 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
534 | 534 |
535 if (activeDescendant) { | 535 if (activeDescendant) { |
536 var descendantSelector = '*[role~="row"]'; | 536 var descendantSelector = '*[role~="row"]'; |
537 var rows = parentControl.querySelectorAll(descendantSelector); | 537 var rows = parentControl.querySelectorAll(descendantSelector); |
538 var currentIndex = null; | 538 var currentIndex = null; |
539 for (var j = 0; j < rows.length; j++) { | 539 for (var j = 0; j < rows.length; j++) { |
540 var gridcells = rows[j].querySelectorAll('*[role~="gridcell"]'); | 540 var gridcells = rows[j].querySelectorAll('*[role~="gridcell"]'); |
541 for (var k = 0; k < gridcells.length; k++) { | 541 for (var k = 0; k < gridcells.length; k++) { |
542 if (gridcells[k] == activeDescendant) { | 542 if (gridcells[k] == activeDescendant) { |
543 return /** @type {cvox.NodeState} */ ( | 543 return /** @type {cvox.NodeState} */ ( |
544 [['aria_role_gridcell_pos', j + 1, k + 1]]); | 544 [['role_gridcell_pos', j + 1, k + 1]]); |
545 } | 545 } |
546 } | 546 } |
547 } | 547 } |
548 } | 548 } |
549 return []; | 549 return []; |
550 }; | 550 }; |
551 | 551 |
552 | 552 |
553 /** | 553 /** |
554 * Returns the id of a node's active descendant | 554 * Returns the id of a node's active descendant |
(...skipping 414 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
969 * @param {Node} node The node to be checked. | 969 * @param {Node} node The node to be checked. |
970 * @return {boolean} Whether or not the node is an ARIA math node. | 970 * @return {boolean} Whether or not the node is an ARIA math node. |
971 */ | 971 */ |
972 cvox.AriaUtil.isMath = function(node) { | 972 cvox.AriaUtil.isMath = function(node) { |
973 if (!node || !node.getAttribute) { | 973 if (!node || !node.getAttribute) { |
974 return false; | 974 return false; |
975 } | 975 } |
976 var role = cvox.AriaUtil.getRoleAttribute(node); | 976 var role = cvox.AriaUtil.getRoleAttribute(node); |
977 return role == 'math'; | 977 return role == 'math'; |
978 }; | 978 }; |
OLD | NEW |