h5p-php-library/js/h5p-action-bar.js

101 lines
2.6 KiB
JavaScript
Raw Normal View History

2017-02-07 13:48:42 +01:00
/**
* @class
* @augments H5P.EventDispatcher
* @param {Object} displayOptions
* @param {boolean} displayOptions.export Triggers the display of the 'Download' button
* @param {boolean} displayOptions.copyright Triggers the display of the 'Copyright' button
* @param {boolean} displayOptions.embed Triggers the display of the 'Embed' button
* @param {boolean} displayOptions.icon Triggers the display of the 'H5P icon' link
*/
H5P.ActionBar = (function ($, EventDispatcher) {
"use strict";
function ActionBar(displayOptions) {
EventDispatcher.call(this);
2017-02-07 13:48:42 +01:00
/** @alias H5P.ActionBar# */
var self = this;
var hasActions = false;
// Create action bar
var $actions = H5P.jQuery('<ul class="h5p-actions"></ul>');
/**
* Helper for creating action bar buttons.
*
* @private
* @param {string} type
* @param {string} customClass Instead of type class
*/
var addActionButton = function (type, customClass) {
2017-01-30 08:43:47 +01:00
/**
* Handles selection of action
*/
var handler = function () {
self.trigger(type);
};
H5P.jQuery('<li/>', {
2017-03-31 13:36:40 +02:00
'class': 'h5p-button h5p-noselect 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
});
hasActions = true;
};
// Register action bar buttons
if (displayOptions.export) {
// Add export button
addActionButton('download', 'export');
}
if (displayOptions.copyright) {
addActionButton('copyrights');
}
if (displayOptions.embed) {
addActionButton('embed');
}
if (displayOptions.icon) {
// Add about H5P button icon
H5P.jQuery('<li><a class="h5p-link" href="http://h5p.org" target="_blank" title="' + H5P.t('h5pDescription') + '"></a></li>').appendTo($actions);
hasActions = true;
}
2016-12-16 11:38:47 +01:00
/**
* Returns a reference to the dom element
*
* @return {H5P.jQuery}
*/
self.getDOMElement = function () {
return $actions;
};
2016-12-16 11:38:47 +01:00
/**
* Does the actionbar contain actions?
*
* @return {Boolean}
*/
self.hasActions = function () {
return hasActions;
2017-01-30 08:43:47 +01:00
};
}
ActionBar.prototype = Object.create(EventDispatcher.prototype);
ActionBar.prototype.constructor = ActionBar;
return ActionBar;
})(H5P.jQuery, H5P.EventDispatcher);