Improved action bar buttons

Now supports space bar.
HFJ-1549
pull/18/head
Frode Petterson 2016-04-08 13:18:35 +02:00
parent 41c98cc13c
commit 9741dd882d
1 changed files with 36 additions and 4 deletions

View File

@ -146,18 +146,49 @@ H5P.init = function (target) {
// Create action bar // Create action bar
var $actions = H5P.jQuery('<ul class="h5p-actions"></ul>'); var $actions = H5P.jQuery('<ul class="h5p-actions"></ul>');
/**
* Helper for creating action bar buttons.
*
* @private
* @param {string} type
* @param {function} handler
* @param {string} customClass Instead of type class
*/
var addActionButton = function (type, handler, customClass) {
H5P.jQuery('<li/>', {
'class': 'h5p-button h5p-' + (customClass ? customClass : type),
role: 'button',
tabindex: 0,
title: H5P.t(type + 'Description'),
html: H5P.t(type),
on: {
click: handler,
keypress: function (e) {
if (e.which === 32) {
handler();
e.preventDefault(); // (since return false will block other inputs)
}
}
},
appendTo: $actions
});
};
// Register action bar buttons
if (!(contentData.disable & H5P.DISABLE_DOWNLOAD)) { if (!(contentData.disable & H5P.DISABLE_DOWNLOAD)) {
// Add export button // Add export button
H5P.jQuery('<li class="h5p-button h5p-export" role="button" tabindex="0" title="' + H5P.t('downloadDescription') + '">' + H5P.t('download') + '</li>').appendTo($actions).click(function () { addActionButton('download', function () {
// Use button for download to avoid people linking directly to the .h5p
window.location.href = contentData.exportUrl; window.location.href = contentData.exportUrl;
}); }, 'export');
} }
if (!(contentData.disable & H5P.DISABLE_COPYRIGHT)) { if (!(contentData.disable & H5P.DISABLE_COPYRIGHT)) {
var copyright = H5P.getCopyrights(instance, library.params, contentId); var copyright = H5P.getCopyrights(instance, library.params, contentId);
if (copyright) { if (copyright) {
// Add copyright dialog button // Add copyright dialog button
H5P.jQuery('<li class="h5p-button h5p-copyrights" role="button" tabindex="0" title="' + H5P.t('copyrightsDescription') + '">' + H5P.t('copyrights') + '</li>').appendTo($actions).click(function () { addActionButton('copyrights', function () {
// Open dialog with copyright information // Open dialog with copyright information
var dialog = new H5P.Dialog('copyrights', H5P.t('copyrightInformation'), copyright, $container); var dialog = new H5P.Dialog('copyrights', H5P.t('copyrightInformation'), copyright, $container);
dialog.open(); dialog.open();
@ -166,7 +197,8 @@ H5P.init = function (target) {
} }
if (!(contentData.disable & H5P.DISABLE_EMBED)) { if (!(contentData.disable & H5P.DISABLE_EMBED)) {
// Add embed button // Add embed button
H5P.jQuery('<li class="h5p-button h5p-embed" role="button" tabindex="0" title="' + H5P.t('embedDescription') + '">' + H5P.t('embed') + '</li>').appendTo($actions).click(function () { addActionButton('embed', function () {
// Open dialog with embed information
H5P.openEmbedDialog($actions, contentData.embedCode, contentData.resizeCode, { H5P.openEmbedDialog($actions, contentData.embedCode, contentData.resizeCode, {
width: $element.width(), width: $element.width(),
height: $element.height() height: $element.height()