Skip to content

Commit

Permalink
Merge pull request #2485 from oat-sa/feature/ADF-1695/multiple-previe…
Browse files Browse the repository at this point in the history
…w-buttons

Feature/ADF-1695/Show multiple preview buttons
  • Loading branch information
jsconan authored Jul 9, 2024
2 parents f4f4295 + f2901b3 commit 7897aa5
Show file tree
Hide file tree
Showing 4 changed files with 68 additions and 24 deletions.
71 changes: 56 additions & 15 deletions views/js/controller/creator/creator.js
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@
* along with this program; if not, write to the Free Software
* Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
*
* Copyright (c) 2014-2021 (original work) Open Assessment Technologies SA (under the project TAO-PRODUCT);
* Copyright (c) 2014-2024 (original work) Open Assessment Technologies SA (under the project TAO-PRODUCT);
*/
/**
* @author Bertrand Chevrier <[email protected]>
Expand Down Expand Up @@ -74,6 +74,23 @@ define([
('use strict');
const logger = loggerFactory('taoQtiTest/controller/creator');

/**
* We assume the ClientLibConfigRegistry is filled up with something like this:
* 'taoQtiTest/controller/creator/creator' => [
* 'provider' => 'qtiTest',
* ],
*
* Or, with something like this for allowing multiple buttons in case of several providers are available:
* 'taoQtiTest/controller/creator/creator' => [
* 'provider' => 'qtiTest',
* 'providers' => [
* ['id' => 'qtiTest', 'label' => 'Preview'],
* ['id' => 'xxxx', 'label' => 'xxxx'],
* ...
* ],
* ],
*/

/**
* The test creator controller is the main entry point
* and orchestrates data retrieval and view/components loading.
Expand All @@ -94,7 +111,7 @@ define([
start(options) {
const $container = $('#test-creator');
const $saver = $('#saver');
const $previewer = $('#previewer');
const $menu = $('ul.test-editor-menu');
const $back = $('#authoringBack');

let creatorContext;
Expand All @@ -119,21 +136,42 @@ define([
});

//preview button
if (!Object.keys(options.labels).length) {
$previewer.attr('disabled', true).addClass('disabled');
}
$previewer.on('click', e => {
e.preventDefault();
if (!$previewer.hasClass('disabled')) {
creatorContext.trigger('preview');
let previewId = 0;
const createPreviewButton = ({ id, label } = {}) => {
// configured labels will need to to be registered elsewhere for the translations
const translate = text => text && __(text);

const btnIdx = previewId ? `-${previewId}` : '';
const $button = $(
templates.menuButton({
id: `previewer${btnIdx}`,
testId: `preview-test${btnIdx}`,
icon: 'preview',
label: translate(label) || __('Preview')
})
).on('click', e => {
e.preventDefault();
if (!$(e.currentTarget).hasClass('disabled')) {
creatorContext.trigger('preview', id, previewId);
}
});
if (!Object.keys(options.labels).length) {
$button.attr('disabled', true).addClass('disabled');
}
});
$menu.append($button);
previewId++;
return $button;
};
const previewButtons = options.providers
? options.providers.map(createPreviewButton)
: [createPreviewButton()];

const isTestContainsItems = () => {
if ($container.find('.test-content').find('.itemref').length) {
$previewer.attr('disabled', false).removeClass('disabled');
previewButtons.forEach($previewer => $previewer.attr('disabled', false).removeClass('disabled'));
return true;
} else {
$previewer.attr('disabled', true).addClass('disabled');
previewButtons.forEach($previewer => $previewer.attr('disabled', true).addClass('disabled'));
return false;
}
};
Expand Down Expand Up @@ -222,12 +260,13 @@ define([
}
});

creatorContext.on('preview', function () {
creatorContext.on('preview', provider => {
if (isTestContainsItems() && !creatorContext.isTestHasErrors()) {
const saveUrl = options.routes.save;
const testUri = saveUrl.slice(saveUrl.indexOf('uri=') + 4);
const config = module.config();
return previewerFactory(config.provider, decodeURIComponent(testUri), {
const type = provider || config.provider || 'qtiTest';
return previewerFactory(type, decodeURIComponent(testUri), {
readOnly: false,
fullPage: true,
pluginsOptions: config.pluginsOptions
Expand All @@ -251,7 +290,9 @@ define([
if (creatorContext.isTestHasErrors()) {
event.preventDefault();
feedback().warning(
__('The test cannot be saved because it currently contains invalid settings.\nPlease fix the invalid settings and try again.')
__(
'The test cannot be saved because it currently contains invalid settings.\nPlease fix the invalid settings and try again.'
)
);
} else {
creatorContext.trigger('save');
Expand Down
7 changes: 5 additions & 2 deletions views/js/controller/creator/templates/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -33,7 +33,8 @@ define([
'tpl!taoQtiTest/controller/creator/templates/itemref-props-weight',
'tpl!taoQtiTest/controller/creator/templates/rubricblock-props',
'tpl!taoQtiTest/controller/creator/templates/category-presets',
'tpl!taoQtiTest/controller/creator/templates/subsection'
'tpl!taoQtiTest/controller/creator/templates/subsection',
'tpl!taoQtiTest/controller/creator/templates/menu-button'
],
function(
defaults,
Expand All @@ -49,7 +50,8 @@ function(
itemRefPropsWeight,
rubricBlockProps,
categoryPresets,
subsection
subsection,
menuButton
){
'use strict';

Expand All @@ -66,6 +68,7 @@ function(
rubricblock : applyTemplateConfiguration(rubricBlock),
outcomes : applyTemplateConfiguration(outcomes),
subsection : applyTemplateConfiguration(subsection),
menuButton : applyTemplateConfiguration(menuButton),
properties : {
test : applyTemplateConfiguration(testProps),
testpart : applyTemplateConfiguration(testPartProps),
Expand Down
6 changes: 6 additions & 0 deletions views/js/controller/creator/templates/menu-button.tpl
Original file line number Diff line number Diff line change
@@ -0,0 +1,6 @@
<li id="{{id}}" class="btn-info small" data-testid="{{testId}}">
<span class="li-inner">
<span class="icon-{{icon}}"></span>
{{label}}
</span>
</li>
8 changes: 1 addition & 7 deletions views/templates/creator.tpl
Original file line number Diff line number Diff line change
Expand Up @@ -19,19 +19,13 @@
<!-- test editor -->
<section class="test-creator-test test-creator-area test-creator-content">
<div class="action-bar plain content-action-bar horizontal-action-bar">
<ul class="action-group plain clearfix authoring-back-box item-editor-menu">
<ul class="test-editor-menu action-group plain clearfix authoring-back-box item-editor-menu">
<li id="saver" class="btn-info small" data-testid="save-test">
<span class="li-inner">
<span class="icon-save"></span>
<?=__('Save')?>
</span>
</li>
<li id="previewer" class="btn-info small" data-testid="preview-test">
<span class="li-inner">
<span class="icon-preview"></span>
<?=__('Preview')?>
</span>
</li>
</ul>
</div>
<h1><span data-bind="title"></span>
Expand Down

0 comments on commit 7897aa5

Please sign in to comment.