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

Merge branch 'release' of github.com:h5p/h5p-php-library into release

pull/22/head
Frode Petterson 2016-06-07 12:58:40 +02:00
parent f4cee6e284 87658ed42b
commit 2ebc9225ee
1 changed files with 40 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -44,6 +44,16 @@ H5P.ConfirmationDialog = (function (EventDispatcher) {
e.preventDefault();
}
/**
* Flow focus to element
* @param {HTMLElement} element Next element to be focused
* @param {Event} e Original tab event
*/
function flowTo(element, e) {
element.focus();
e.preventDefault();
}
// Offset of exit button
var exitButtonOffset = 2 * 16;
var shadowOffset = 8;
@ -59,7 +69,14 @@ H5P.ConfirmationDialog = (function (EventDispatcher) {
// Create outer popup
var popup = document.createElement('div');
popup.classList.add('h5p-confirmation-dialog-popup', 'hidden');
popup.setAttribute('role', 'dialog');
popupBackground.appendChild(popup);
popup.onkeydown = function (e) {
if (e.which === 27) {// Esc key
// Exit dialog
dialogCanceled(e);
}
};
// Popup header
var header = document.createElement('div');
@ -93,19 +110,31 @@ H5P.ConfirmationDialog = (function (EventDispatcher) {
var cancelButton = document.createElement('button');
cancelButton.classList.add('h5p-core-cancel-button');
cancelButton.textContent = options.cancelText;
cancelButton.onclick = dialogCanceled;
cancelButton.onkeydown = function (e) {
if (e.which === 32) { // Space
dialogCanceled(e);
}
};
buttons.appendChild(cancelButton);
// Confirm button
var confirmButton = document.createElement('button');
confirmButton.classList.add('h5p-core-button',
'h5p-confirmation-dialog-confirm-button');
confirmButton.textContent = options.confirmText;
// Exit button
var exitButton = document.createElement('button');
exitButton.classList.add('h5p-confirmation-dialog-exit');
exitButton.title = options.cancelText;
// Cancel handler
cancelButton.onclick = dialogCanceled;
cancelButton.onkeydown = function (e) {
if (e.which === 32) { // Space
dialogCanceled(e);
}
else if (e.which === 9 && e.shiftKey) { // Shift-tab
flowTo(exitButton, e);
}
};
buttons.appendChild(cancelButton);
// Confirm handler
confirmButton.onclick = dialogConfirmed;
confirmButton.onkeydown = function (e) {
if (e.which === 32) { // Space
@ -114,15 +143,15 @@ H5P.ConfirmationDialog = (function (EventDispatcher) {
};
buttons.appendChild(confirmButton);
// Exit button
var exitButton = document.createElement('button');
exitButton.classList.add('h5p-confirmation-dialog-exit');
exitButton.title = options.cancelText;
// Exit handler
exitButton.onclick = dialogCanceled;
exitButton.onkeydown = function (e) {
if (e.which === 32) { // Space
dialogCanceled(e);
}
else if (e.which === 9 && !e.shiftKey) { // Tab
flowTo(cancelButton, e);
}
};
popup.appendChild(exitButton);