diff --git a/css/questionset.css b/css/questionset.css index 946926b..19130c0 100644 --- a/css/questionset.css +++ b/css/questionset.css @@ -22,15 +22,6 @@ .questionset.hidden { display: none; } - -/* Quick fix for hiding check buttons in integrated h5p content: */ -.questionset .h5p-word button.h5p-button.h5p-check-button { - display: none; -} -.questionset .h5p-multichoice > .h5p-show-solution, .questionset .dragndrop > .h5p-show-solution, .h5p-blanks .h5p-button { - display: none; -} - .questionset, .intro-page, .questionset-results { position: relative; } @@ -100,7 +91,7 @@ .qs-footer { overflow: hidden; } -.qs-footer .button, .qs-startbutton, .qs-finishbutton, .questionset-results .button, .video-container > .button { +.qs-footer .h5p-button, .qs-startbutton, .qs-finishbutton, .questionset-results .h5p-button, .video-container > .h5p-button { display: inline-block; padding: 0 0.7em; border: 0.2em solid #fff; @@ -118,7 +109,7 @@ background: -ms-linear-gradient(top, rgba(100,152,254,1) 0%,rgba(4,104,206,1) 100%); /* IE10+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#6498fe', endColorstr='#0468ce',GradientType=0 ); /* IE6-9 */ } -.qs-footer .button:hover, .qs-startbutton:hover, .questionset-results .button:hover, .video-container > .button:hover { +.qs-footer .h5p-button:hover, .qs-startbutton:hover, .questionset-results .h5p-button:hover, .video-container > .h5p-button:hover { text-decoration: none; box-shadow: 0 0 0.5em #999; color: #ffffff; @@ -139,16 +130,26 @@ float: none; } +.qs-footer > .qs-retrybutton { + float: none; +} + +.questionset-results a.h5p-button.qs-retrybutton:before { + font-family: 'H5PFontAwesome4'; + padding-right: 0.5em; + content: "\f021"; +} + .qs-footer > .next, .qs-footer > .finish, .qs-finishbutton { float: right; } -.qs-footer a.next.button:after { +.qs-footer a.next.h5p-button:after { font-family: 'H5PFontAwesome4'; content: "\f054"; /* TODO: Use margin not whitespace, spacing is not content! */ } -.qs-footer a.prev.button:before { +.qs-footer a.prev.h5p-button:before { font-family: 'H5PFontAwesome4'; content: "\f053"; } @@ -157,12 +158,12 @@ display: none; } -.qs-footer a.finish.button:before { +.qs-footer a.finish.h5p-button:before { font-family: 'H5PFontAwesome4'; content: "\f00c "; } -.questionset-results a.button.qs-solutionbutton:before { +.questionset-results a.h5p-button.qs-solutionbutton:before { font-family: 'H5PFontAwesome4'; content: "\f06e "; } @@ -173,7 +174,7 @@ .video-container > video { background-color: #000; } -.video-container > .button { +.video-container > .h5p-button { position: absolute; top: 0.5em; right: 0.5em; @@ -267,4 +268,4 @@ font-style: normal; color: #6aa81b; text-align: left; -} \ No newline at end of file +} diff --git a/js/questionset.js b/js/questionset.js index 10db075..a49e05f 100644 --- a/js/questionset.js +++ b/js/questionset.js @@ -26,7 +26,7 @@ H5P.QuestionSet = function (options, contentId) { ' <% if (introPage.introduction) { %>' + '
<%= introPage.introduction %>
' + ' <% } %>' + - '
<%= introPage.startButtonText %>
' + + '
<%= introPage.startButtonText %>
' + '' + '<% } %>' + '
' + @@ -45,9 +45,9 @@ H5P.QuestionSet = function (options, contentId) { ' ' + ' <% } %>' + '
' + - ' ' + - ' ' + - ' <%= texts.finishButton %>' + + ' ' + + ' ' + + ' <%= texts.finishButton %>' + ' ' + ''; @@ -58,7 +58,7 @@ H5P.QuestionSet = function (options, contentId) { '
' + '
<% if (comment) { %>

<%= comment %>

<% } %><%= score %>
<%= resulttext %>
' + ' ' + - '
<%= finishButtonText %><%= solutionButtonText %>
' + + '
<%= finishButtonText %><%= solutionButtonText %>
' + ''; var defaults = { @@ -89,8 +89,14 @@ H5P.QuestionSet = function (options, contentId) { scoreString: 'You got @score points of @total possible.', finishButtonText: 'Finish', solutionButtonText: 'Show solution', + retryButtonText: 'Retry', showAnimations: false }, + override: { + overrideButtons: false, + overrideShowSolutionButton: false, + overrideRetryButton: false + }, postUserStatistics: (H5P.postUserStatistics === true) }; @@ -103,13 +109,23 @@ H5P.QuestionSet = function (options, contentId) { var $myDom; renderSolutions = false; + + // Instantiate question instances for (var i = 0; i < params.questions.length; i++) { var question = params.questions[i]; // TODO: Render on init, inject in template. + // override content parameters. + if (params.override.overrideButtons) { + // Extend subcontent with the overrided settings. + $.extend(question.params, { + enableRetryButton: params.override.overrideRetryButton, + enableSolutionsButton: params.override.overrideShowSolutionButton + }); + } + $.extend(question.params, { - displaySolutionsButton: false, postUserStatistics: false }); questionInstances.push(H5P.newRunnable(question, contentId)); @@ -123,18 +139,18 @@ H5P.QuestionSet = function (options, contentId) { } if (currentQuestion === 0) { - $('.prev.button', $myDom).hide(); + $('.prev.h5p-button', $myDom).hide(); } else { - $('.prev.button', $myDom).show(); + $('.prev.h5p-button', $myDom).show(); } if (currentQuestion === (params.questions.length - 1)) { - $('.next.button', $myDom).hide(); + $('.next.h5p-button', $myDom).hide(); if (answered) { - $('.finish.button', $myDom).show(); + $('.finish.h5p-button', $myDom).show(); } } else { - $('.next.button', $myDom).show(); - $('.finish.button', $myDom).hide(); + $('.next.h5p-button', $myDom).show(); + $('.finish.h5p-button', $myDom).hide(); } }; @@ -173,12 +189,42 @@ H5P.QuestionSet = function (options, contentId) { return currentQuestion; }; + /** + * Show solutions for subcontent, and hide subcontent buttons. + * Used for contracts with integrated content. + * @public + */ var showSolutions = function () { for (var i = 0; i < questionInstances.length; i++) { - questionInstances[i].showSolutions(); + try { + questionInstances[i].showSolutions(); + } + catch(error) { + console.log(error); + console.log("subcontent does not contain a valid showSolutions() function"); + } } }; + /** + * Resets the task and every subcontent task. + * Used for contracts with integrated content. + * @public + */ + var resetTask = function () { + for (var i = 0; i < questionInstances.length; i++) { + try { + questionInstances[i].resetTask(); + } + catch(error) { + console.log(error); + console.log("subcontent does not contain a valid resetTask() function"); + } + } + //Force the last page to be reRendered + rendered = false; + }; + var rendered = false; var reRender = function () { @@ -190,6 +236,8 @@ H5P.QuestionSet = function (options, contentId) { $myDom.children().hide().filter('.questionset-results').show(); return; } + //Remove old score screen. + $myDom.children().hide().filter('.questionset-results').remove(); rendered = true; // Get total score. @@ -232,6 +280,12 @@ H5P.QuestionSet = function (options, contentId) { $myDom.children().hide().filter('.questionset').show(); _showQuestion(params.initialQuestion); }); + $('.qs-retrybutton', $myDom) + .html(params.endGame.retryButtonText) + .click(function () { + resetTask(); + $myDom.children().hide().filter('.questionset').show(); + _showQuestion(params.initialQuestion);}); }; if (params.endGame.showAnimations) { @@ -254,7 +308,7 @@ H5P.QuestionSet = function (options, contentId) { video.play(); if (params.endGame.skipButtonText) { - $('').click(function () { + $('').click(function () { video.stop(); $videoContainer.hide(); displayResults(); @@ -325,13 +379,13 @@ H5P.QuestionSet = function (options, contentId) { $('.progress-dot', $myDom).click(function () { _showQuestion($(this).index()); }); - $('.next.button', $myDom).click(function () { + $('.next.h5p-button', $myDom).click(function () { _showQuestion(currentQuestion + 1); }); - $('.prev.button', $myDom).click(function () { + $('.prev.h5p-button', $myDom).click(function () { _showQuestion(currentQuestion - 1); }); - $('.finish.button', $myDom).click(function () { + $('.finish.h5p-button', $myDom).click(function () { _displayEndGame(); }); @@ -426,4 +480,4 @@ H5P.QuestionSet = function (options, contentId) { getCopyrights: getCopyrights }; return returnObject; -}; +}; \ No newline at end of file diff --git a/semantics.json b/semantics.json index 38ab49a..73f17ab 100644 --- a/semantics.json +++ b/semantics.json @@ -104,7 +104,8 @@ "H5P.MultiChoice 1.0", "H5P.DragQuestion 1.0", "H5P.Blanks 1.0", - "H5P.MarkTheWords 1.0" + "H5P.MarkTheWords 1.0", + "H5P.DragText 1.0" ] } }, @@ -240,6 +241,13 @@ "default": "Show solution", "description": "Text for the solution button." }, + { + "name": "retryButtonText", + "type": "text", + "label": "Retry button label", + "default": "Retry", + "description": "Text for the retry button." + }, { "name": "finishButtonText", "type": "text", @@ -260,8 +268,7 @@ "name": "skipButtonText", "type": "text", "label": "Skip video button label", - "default": "Skip video", - "common": true + "default": "Skip video" }, { "name": "successVideo", @@ -278,5 +285,36 @@ "description": "This video will be played if the user failes the quiz." } ] + }, + { + "name": "override", + "type": "group", + "label": "Override native button options", + "description": "These options will let you override when to display \"Show solution\" and \"Retry\" buttons in integrated h5p content.", + "common": true, + "optional": true, + "fields": [ + { + "name": "overrideButtons", + "type": "boolean", + "label": "Override native button settings.", + "description": "Enabling this option will let you override display settings for integrated content buttons with the following options.", + "default": false + }, + { + "name": "overrideShowSolutionButton", + "type": "boolean", + "label": "Enable \"Show solution\" button for subcontent.", + "description": "Enabling this option will override subcontent to show the \"Show solution\" button.", + "default": false + }, + { + "name": "overrideRetryButton", + "type": "boolean", + "label": "Enable \"Retry\" button for subcontent.", + "description": "Enabling this option will override subcontent to show the \"Retry\" button.", + "default": false + } + ] } ]