EDUCATIC
/
h5p-php-library
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Use aria-labelledby to describe dialog, instead of alert. 

HFJ-2003
pull/22/head
Thomas Marstrander 2016-06-09 13:18:09 +02:00
parent e10594fb49
commit 51851f14c3
1 changed files with 8 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
js/h5p-confirmation-dialog.js
View File

@ -17,6 +17,10 @@ H5P.ConfirmationDialog = (function (EventDispatcher) {
EventDispatcher.call(this); EventDispatcher.call(this);
var self = this; var self = this;
// Make sure confirmation dialogs have unique id
H5P.ConfirmationDialog.uniqueId += 1;
var uniqueId = H5P.ConfirmationDialog.uniqueId;
// Default options // Default options
options = options || {}; options = options || {};
options.headerText = options.headerText || H5P.t('confirmDialogHeader'); options.headerText = options.headerText || H5P.t('confirmDialogHeader');
@ -70,6 +74,7 @@ H5P.ConfirmationDialog = (function (EventDispatcher) {
var popup = document.createElement('div'); var popup = document.createElement('div');
popup.classList.add('h5p-confirmation-dialog-popup', 'hidden'); popup.classList.add('h5p-confirmation-dialog-popup', 'hidden');
popup.setAttribute('role', 'dialog'); popup.setAttribute('role', 'dialog');
popup.setAttribute('aria-labelledby', 'h5p-confirmation-dialog-dialog-text-' + uniqueId);
popupBackground.appendChild(popup); popupBackground.appendChild(popup);
popup.addEventListener('keydown', function (e) { popup.addEventListener('keydown', function (e) {
if (e.which === 27) {// Esc key if (e.which === 27) {// Esc key
@ -97,8 +102,8 @@ H5P.ConfirmationDialog = (function (EventDispatcher) {
// Popup text // Popup text
var text = document.createElement('div'); var text = document.createElement('div');
text.classList.add('h5p-confirmation-dialog-text'); text.classList.add('h5p-confirmation-dialog-text');
text.setAttribute('role', 'alert');
text.innerHTML = options.dialogText; text.innerHTML = options.dialogText;
text.id = 'h5p-confirmation-dialog-dialog-text-' + uniqueId;
body.appendChild(text); body.appendChild(text);
// Popup buttons // Popup buttons
@ -346,3 +351,5 @@ H5P.ConfirmationDialog = (function (EventDispatcher) {
return ConfirmationDialog; return ConfirmationDialog;
}(H5P.EventDispatcher)); }(H5P.EventDispatcher));
H5P.ConfirmationDialog.uniqueId = -1;