diff --git a/.gitignore b/.gitignore
index e266972..c30f2fe 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1,2 +1,3 @@
*~
-/nbproject/private/
\ No newline at end of file
+/nbproject/private/
+.idea
\ No newline at end of file
diff --git a/css/questionset.css b/css/questionset.css
index 90cf581..22e65d2 100644
--- a/css/questionset.css
+++ b/css/questionset.css
@@ -52,7 +52,12 @@
background: #fff;
background: #cecece;
}
-.progress-dot:hover {
+
+.progress-dot.disabled {
+ cursor: default;
+}
+
+.progress-dot:not(.disabled):hover {
box-shadow: 0 0 0.5em #c7c7c7;
}
.progress-dot.answered {
@@ -61,6 +66,11 @@
.progress-dot.current {
background: #285585;
}
+
+.progress-dot.disabled:focus {
+ outline: none
+}
+
.progress-dot:focus {
outline-color: rgb(40, 130, 211);
outline-width: thin;
@@ -151,6 +161,12 @@
width: 2.1875em;
}
+.h5p-question .h5p-question-prev.truncated,
+.h5p-question .h5p-question-next.truncated {
+ padding: 0;
+ line-height: 2.2335em;
+}
+
.h5p-question .h5p-question-next,
.h5p-question .h5p-question-finish {
margin: 0 0 1.5em 0.5em;
diff --git a/js/questionset.js b/js/questionset.js
index 912b8b3..9503447 100644
--- a/js/questionset.js
+++ b/js/questionset.js
@@ -8,11 +8,12 @@ var H5P = H5P || {};
*
* @param {Array} options
* @param {int} contentId
+ * @param {Object} contentData
* @returns {H5P.QuestionSet} Instance
*/
-H5P.QuestionSet = function (options, contentId) {
+H5P.QuestionSet = function (options, contentId, contentData) {
if (!(this instanceof H5P.QuestionSet)) {
- return new H5P.QuestionSet(options, contentId);
+ return new H5P.QuestionSet(options, contentId, contentData);
}
H5P.EventDispatcher.call(this);
var $ = H5P.jQuery;
@@ -41,11 +42,16 @@ H5P.QuestionSet = function (options, contentId) {
' <% if (progressType == "dots") { %>' +
'
' +
' <% for (var i=0; i' +
- ' - " tabindex="-1">
' +
+ ' - ' +
+ ' " tabindex="-1" ' +
+ ' <% if (disableBackwardsNavigation) { %> aria-disabled="true" <% } %>' +
+ ' >' +
+ '
' +
' <% } %>' +
' ' +
' <% } else if (progressType == "textual") { %>' +
@@ -76,7 +82,6 @@ H5P.QuestionSet = function (options, contentId) {
'';
var defaults = {
- randomOrder: false,
initialQuestion: 0,
progressType: 'dots',
passPercentage: 50,
@@ -113,21 +118,109 @@ H5P.QuestionSet = function (options, contentId) {
retryButtonText: 'Retry',
showAnimations: false,
skipButtonText: 'Skip video'
- }
+ },
+ disableBackwardsNavigation: false
};
var template = new EJS({text: texttemplate});
var endTemplate = new EJS({text: resulttemplate});
var params = $.extend(true, {}, defaults, options);
+ var poolOrder; // Order of questions in a pool
var currentQuestion = 0;
var questionInstances = [];
+ var questionOrder; //Stores order of questions to allow resuming of question set
var $myDom;
var scoreBar;
var up;
- renderSolutions = false;
+ var renderSolutions = false;
+ var showingSolutions = false;
+ contentData = contentData || {};
+ // Bring question set up to date when resuming
+ if (contentData.previousState) {
+ if (contentData.previousState.progress) {
+ currentQuestion = contentData.previousState.progress;
+ }
+ questionOrder = contentData.previousState.order;
+ }
+
+ // Create a pool of questions if necessary
+ /**
+ * Randomizes questions in an array and updates an array containing their order
+ * @param {array} questions
+ * @param {array} questionOrder
+ * @return {Object.} questionOrdering
+ */
+ var randomizeQuestionOrdering = function (questions, questionOrder) {
+
+ // Save the original order of the questions in a multidimensional array [[question0,0],[question1,1]...
+ var questionOrdering = questions.map(function(questionInstance, index) { return [questionInstance, index] });
+
+ // Shuffle the multidimensional array
+ questionOrdering = H5P.shuffleArray(questionOrdering);
+
+ // Retrieve question objects from the first index
+ var questions = [];
+ for (var i = 0; i < questionOrdering.length; i++) {
+ questions[i] = questionOrdering[i][0];
+ }
+
+ // Retrieve the new shuffled order from the second index
+ var newOrder = [];
+ for (var i = 0; i< questionOrdering.length; i++) {
+
+ // Use a previous order if it exists
+ if(questionOrder) {
+ newOrder[i] = questionOrder[questionOrdering[i][1]];
+ }
+ else {
+ newOrder[i] = questionOrdering[i][1];
+ }
+ }
+
+ // Return the questions in their new order *with* their new order
+ return {
+ questions: questions,
+ questionOrder: newOrder
+ };
+ }
+
+ // Create a pool (a subset) of questions if necessary
+ if (params.poolSize && params.poolSize < params.questions.length) {
+
+ // If a previous pool exists, recreate it
+ if(contentData.previousState && contentData.previousState.poolOrder) {
+ poolOrder = contentData.previousState.poolOrder;
+
+ // Recreate the pool from the saved data
+ var pool = [];
+ for (var i = 0; i < poolOrder.length; i++) {
+ pool[i] = params.questions[poolOrder[i]];
+ }
+
+ // Replace original questions with just the ones in the pool
+ params.questions = pool;
+ }
+ else { // Otherwise create a new pool
+ // Randomize and get the results
+ var poolResult = randomizeQuestionOrdering(params.questions, poolOrder);
+ var poolQuestions = poolResult.questions;
+ poolOrder = poolResult.questionOrder;
+
+ // Discard extra questions
+
+ poolQuestions = poolQuestions.slice(0, params.poolSize);
+ poolOrder = poolOrder.slice(0, params.poolSize);
+
+ // Replace original questions with just the ones in the pool
+ params.questions = poolQuestions;
+ }
+ }
+
+ // Create the html template for the question container
var $template = $(template.render(params));
+
// Set overrides for questions
var override;
if (params.override.showSolutionButton || params.override.retryButton) {
@@ -147,7 +240,16 @@ H5P.QuestionSet = function (options, contentId) {
// Instantiate question instances
for (var i = 0; i < params.questions.length; i++) {
- var question = params.questions[i];
+
+ var question;
+ // If a previous order exists, use it
+ if (questionOrder !== undefined) {
+ question = params.questions[questionOrder[i]];
+ }
+ else {
+ // Use a generic order when initialzing for the first time
+ question = params.questions[i];
+ }
if (override) {
// Extend subcontent with the overrided settings.
@@ -158,8 +260,12 @@ H5P.QuestionSet = function (options, contentId) {
question.params.overrideSettings = question.params.overrideSettings || {};
question.params.overrideSettings.$confirmationDialogParent = $template.last();
question.params.overrideSettings.instance = this;
-
- var questionInstance = H5P.newRunnable(question, contentId, undefined, undefined, {parent: self});
+ var hasAnswers = contentData.previousState && contentData.previousState.answers;
+ var questionInstance = H5P.newRunnable(question, contentId, undefined, undefined,
+ {
+ previousState: hasAnswers ? contentData.previousState.answers[i] : undefined,
+ parent: self
+ });
questionInstance.on('resize', function () {
up = true;
self.trigger('resize');
@@ -167,6 +273,13 @@ H5P.QuestionSet = function (options, contentId) {
questionInstances.push(questionInstance);
}
+ // Randomize questions only on instantiation
+ if (params.randomQuestions && contentData.previousState === undefined) {
+ var result = randomizeQuestionOrdering(questionInstances,questionOrder);
+ questionInstances = result.questions;
+ questionOrder = result.questionOrder;
+ }
+
// Resize all interactions on resize
self.on('resize', function () {
if (up) {
@@ -182,6 +295,17 @@ H5P.QuestionSet = function (options, contentId) {
// Update button state.
var _updateButtons = function () {
+ // Verify that current question is answered when backward nav is disabled
+ if (params.disableBackwardsNavigation) {
+ if (questionInstances[currentQuestion].getAnswerGiven()
+ && questionInstances.length-1 !== currentQuestion) {
+ questionInstances[currentQuestion].showButton('next');
+ }
+ else {
+ questionInstances[currentQuestion].hideButton('next');
+ }
+ }
+
var answered = true;
for (var i = questionInstances.length - 1; i >= 0; i--) {
answered = answered && (questionInstances[i]).getAnswerGiven();
@@ -271,7 +395,18 @@ H5P.QuestionSet = function (options, contentId) {
* @public
*/
var showSolutions = function () {
+ showingSolutions = true;
for (var i = 0; i < questionInstances.length; i++) {
+
+ // Enable back and forth navigation in solution mode
+ toggleDotsNavigation(true);
+ if (i < questionInstances.length - 1) {
+ questionInstances[i].showButton('next');
+ }
+ if (i > 0) {
+ questionInstances[i].showButton('prev');
+ }
+
try {
// Do not read answers
questionInstances[i].toggleReadSpeaker(true);
@@ -285,15 +420,45 @@ H5P.QuestionSet = function (options, contentId) {
}
};
+ /**
+ * Toggles whether dots are enabled for navigation
+ */
+ var toggleDotsNavigation = function (enable) {
+ $('.progress-dot', $myDom).each(function () {
+ $(this).toggleClass('disabled', !enable);
+ $(this).attr('aria-disabled', enable ? 'false' : 'true');
+ // Remove tabindex
+ if (!enable) {
+ $(this).attr('tabindex', '-1');
+ }
+ });
+ };
+
/**
* Resets the task and every subcontent task.
* Used for contracts with integrated content.
* @public
*/
var resetTask = function () {
+ showingSolutions = false;
for (var i = 0; i < questionInstances.length; i++) {
try {
questionInstances[i].resetTask();
+
+ // Hide back and forth navigation in normal mode
+ if (params.disableBackwardsNavigation) {
+ toggleDotsNavigation(false);
+
+ // Check if first question is answered by default
+ if (i === 0 && questionInstances[i].getAnswerGiven()) {
+ questionInstances[i].showButton('next');
+ }
+ else {
+ questionInstances[i].hideButton('next');
+ }
+
+ questionInstances[i].hideButton('prev');
+ }
}
catch(error) {
H5P.error("subcontent does not contain a valid resetTask function");
@@ -311,6 +476,11 @@ H5P.QuestionSet = function (options, contentId) {
//Force the last page to be reRendered
rendered = false;
+
+ if (params.randomQuestions) {
+ randomizeQuestions();
+ }
+
};
var rendered = false;
@@ -319,13 +489,77 @@ H5P.QuestionSet = function (options, contentId) {
rendered = false;
};
+ /**
+ * Randomizes question instances
+ */
+ var randomizeQuestions = function () {
+
+ var result = randomizeQuestionOrdering(questionInstances,questionOrder);
+ questionInstances = result.questions;
+ questionOrder = result.questionOrder;
+
+ // Find all question containers and detach questions from them
+ $('.question-container', $myDom).each(function (){
+ $(this).children().detach();
+ });
+
+ // Reattach questions and their buttons in the new order
+ for (var i = 0; i < questionInstances.length; i++) {
+
+ var question = questionInstances[i];
+
+ // Make sure styles are not being added twice
+ $('.question-container:eq(' + i + ')', $myDom).attr('class', 'question-container');
+
+ question.attach($('.question-container:eq(' + i + ')', $myDom));
+
+ //Show buttons if necessary
+ if(questionInstances[questionInstances.length -1] === question
+ && question.hasButton('finish')) {
+ question.showButton('finish');
+ }
+
+ if(questionInstances[questionInstances.length -1] !== question
+ && question.hasButton('next')) {
+ question.showButton('next');
+ }
+
+ if(questionInstances[0] !== question
+ && question.hasButton('prev')
+ && !params.disableBackwardsNavigation) {
+ question.showButton('prev');
+ }
+
+ // Hide relevant buttons since the order has changed
+ if (questionInstances[0] === question) {
+ question.hideButton('prev');
+ }
+
+ if (questionInstances[questionInstances.length-1] === question) {
+ question.hideButton('next');
+ }
+
+ if (questionInstances[questionInstances.length-1] !== question) {
+ question.hideButton('finish');
+ }
+
+ }
+
+ }
+
var moveQuestion = function (direction) {
+ if (params.disableBackwardsNavigation && !questionInstances[currentQuestion].getAnswerGiven()) {
+ questionInstances[currentQuestion].hideButton('next');
+ questionInstances[currentQuestion].hideButton('finish');
+ return;
+ }
+
_stopQuestion(currentQuestion);
if (currentQuestion + direction >= questionInstances.length) {
_displayEndGame();
-
}
else {
+ // Allow movement if backward navigation enabled or answer given
_showQuestion(currentQuestion + direction);
}
};
@@ -377,9 +611,10 @@ H5P.QuestionSet = function (options, contentId) {
label += ', ' + texts.currentQuestionText;
}
+ var disabledTabindex = params.disableBackwardsNavigation && !showingSolutions;
$el.toggleClass('current', isCurrent)
.attr('aria-label', label)
- .attr('tabindex', isCurrent ? 0 : -1);
+ .attr('tabindex', isCurrent && !disabledTabindex ? 0 : -1);
};
var _displayEndGame = function () {
@@ -395,7 +630,7 @@ H5P.QuestionSet = function (options, contentId) {
// Get total score.
var finals = self.getScore();
- var totals = self.totalScore();
+ var totals = self.getMaxScore();
var scoreString = params.endGame.scoreString.replace("@score", finals).replace("@total", totals);
var success = ((100 * finals / totals) >= params.passPercentage);
var eventData = {
@@ -420,7 +655,7 @@ H5P.QuestionSet = function (options, contentId) {
};
var displayResults = function () {
- self.triggerXAPICompleted(self.getScore(), self.totalScore(), success);
+ self.triggerXAPICompleted(self.getScore(), self.getMaxScore(), success);
var eparams = {
message: params.endGame.showResultPage ? params.endGame.message : params.endGame.noResultMessage,
@@ -511,7 +746,7 @@ H5P.QuestionSet = function (options, contentId) {
});
video.play();
- if (params.endGame.skipButtonText) {
+ if (params.endGame.skippable) {
$('' + params.endGame.skipButtonText + '').click(function () {
video.pause();
$videoContainer.hide();
@@ -577,28 +812,27 @@ H5P.QuestionSet = function (options, contentId) {
// Listen for image resize
registerImageLoadedListener(question);
- // Add next/finish button
- if (questionInstances[questionInstances.length -1] === question) {
+ // Add finish button
+ question.addButton('finish', params.texts.finishButton,
+ moveQuestion.bind(this, 1), false);
- // Add finish question set button
- question.addButton('finish', params.texts.finishButton,
- moveQuestion.bind(this, 1), false);
-
- } else {
-
- // Add next question button
- question.addButton('next', '', moveQuestion.bind(this, 1), true, {
+ // Add next button
+ question.addButton('next', '', moveQuestion.bind(this, 1),
+ !params.disableBackwardsNavigation || !!question.getAnswerGiven(), {
href: '#', // Use href since this is a navigation button
'aria-label': params.texts.nextButton
});
- }
- // Add previous question button
- if (questionInstances[0] !== question) {
- question.addButton('prev', '', moveQuestion.bind(this, -1), true, {
+ // Add previous button
+ question.addButton('prev', '', moveQuestion.bind(this, -1),
+ !(questionInstances[0] === question || params.disableBackwardsNavigation), {
href: '#', // Use href since this is a navigation button
'aria-label': params.texts.prevButton
});
+
+ // Hide next button if it is the last question
+ if(questionInstances[questionInstances.length -1] === question) {
+ question.hideButton('next');
}
question.on('xAPI', function (event) {
@@ -619,6 +853,9 @@ H5P.QuestionSet = function (options, contentId) {
}
event.data.statement.context.extensions['http://id.tincanapi.com/extension/ending-point'] = currentQuestion + 1;
});
+
+ // Mark question if answered
+ toggleAnsweredDot(i, question.getAnswerGiven());
}
// Allow other libraries to add transitions after the questions have been inited
@@ -637,9 +874,13 @@ H5P.QuestionSet = function (options, contentId) {
* @param {Object} [event]
*/
var handleProgressDotClick = function (event) {
+ // Disable dots when backward nav disabled
+ event.preventDefault();
+ if (params.disableBackwardsNavigation && !showingSolutions) {
+ return;
+ }
_stopQuestion(currentQuestion);
_showQuestion($(this).parent().index());
- event.preventDefault();
};
// Set event listeners.
@@ -675,12 +916,14 @@ H5P.QuestionSet = function (options, contentId) {
- // Hide all but initial Question.
- _showQuestion(params.initialQuestion, true);
+ // Hide all but current question
+ _showQuestion(currentQuestion, true);
if (renderSolutions) {
showSolutions();
}
+ // Update buttons in case they have changed (restored user state)
+ _updateButtons();
this.trigger('resize');
@@ -697,7 +940,7 @@ H5P.QuestionSet = function (options, contentId) {
};
// Get total score possible for questionset.
- this.totalScore = function () {
+ this.getMaxScore = function () {
var score = 0;
for (var i = questionInstances.length - 1; i >= 0; i--) {
score += questionInstances[i].getMaxScore();
@@ -705,6 +948,15 @@ H5P.QuestionSet = function (options, contentId) {
return score;
};
+
+ /**
+ * @deprecated since version 1.9.2
+ * @returns {number}
+ */
+ this.totalScore = function () {
+ return this.getMaxScore();
+ };
+
/**
* Gather copyright information for the current content.
*
@@ -795,6 +1047,22 @@ H5P.QuestionSet = function (options, contentId) {
H5P.error(err);
}
};
+
+ /**
+ * Returns the complete state of question set and sub-content
+ *
+ * @returns {Object} current state
+ */
+ this.getCurrentState = function () {
+ return {
+ progress: showingSolutions ? questionInstances.length - 1 : currentQuestion,
+ answers: questionInstances.map(function (qi) {
+ return qi.getCurrentState();
+ }),
+ order: questionOrder,
+ poolOrder: poolOrder
+ };
+ };
};
H5P.QuestionSet.prototype = Object.create(H5P.EventDispatcher.prototype);
diff --git a/language/ar.json b/language/ar.json
index 247754b..838ccf7 100644
--- a/language/ar.json
+++ b/language/ar.json
@@ -103,6 +103,18 @@
}
]
},
+ {
+ "label": "Disable backwards navigation",
+ "description": "This option will only allow you to move forward in Question Set"
+ },
+ {
+ "label": "Randomize questions",
+ "description": "Enable to randomize the order of questions on display."
+ },
+ {
+ "label": "Number of questions to be shown:",
+ "description": "Create a randomized batch of questions from the total."
+ },
{
"label": "انتهاء المسابقة",
"fields": [
diff --git a/language/de.json b/language/de.json
index 8c828f4..f76f891 100644
--- a/language/de.json
+++ b/language/de.json
@@ -108,6 +108,18 @@
}
]
},
+ {
+ "label": "Disable backwards navigation",
+ "description": "This option will only allow you to move forward in Question Set"
+ },
+ {
+ "label": "Randomize questions",
+ "description": "Enable to randomize the order of questions on display."
+ },
+ {
+ "label": "Number of questions to be shown:",
+ "description": "Create a randomized batch of questions from the total."
+ },
{
"label": "Quiz beendet",
"fields": [
diff --git a/language/fr.json b/language/fr.json
index e11b512..8819830 100644
--- a/language/fr.json
+++ b/language/fr.json
@@ -108,6 +108,18 @@
}
]
},
+ {
+ "label": "Disable backwards navigation",
+ "description": "This option will only allow you to move forward in Question Set"
+ },
+ {
+ "label": "Randomize questions",
+ "description": "Enable to randomize the order of questions on display."
+ },
+ {
+ "label": "Number of questions to be shown:",
+ "description": "Create a randomized batch of questions from the total."
+ },
{
"label": "Quiz terminé",
"fields": [
diff --git a/language/it.json b/language/it.json
index 3125ef1..d520b11 100644
--- a/language/it.json
+++ b/language/it.json
@@ -103,6 +103,18 @@
}
]
},
+ {
+ "label": "Disable backwards navigation",
+ "description": "This option will only allow you to move forward in Question Set"
+ },
+ {
+ "label": "Randomize questions",
+ "description": "Enable to randomize the order of questions on display."
+ },
+ {
+ "label": "Number of questions to be shown:",
+ "description": "Create a randomized batch of questions from the total."
+ },
{
"label": "Quiz terminato",
"fields": [
diff --git a/language/nb.json b/language/nb.json
index 17b8b6e..077eb71 100644
--- a/language/nb.json
+++ b/language/nb.json
@@ -105,6 +105,18 @@
}
]
},
+ {
+ "label": "Slå av bakoverknapp",
+ "description": "Slå på for å nekte å gå tilbake i Question Set"
+ },
+ {
+ "label": "Randomize questions",
+ "description": "Enable to randomize the order of questions on display."
+ },
+ {
+ "label": "Number of questions to be shown:",
+ "description": "Create a randomized batch of questions from the total."
+ },
{
"label": "Spørsmålssett avslutning",
"fields": [
diff --git a/language/nn.json b/language/nn.json
index 7904bc5..eb95e40 100644
--- a/language/nn.json
+++ b/language/nn.json
@@ -105,6 +105,18 @@
}
]
},
+ {
+ "label": "Slå av bakoverknapp",
+ "description": "Slå på for å nekte å gå tilbake i Question Set"
+ },
+ {
+ "label": "Randomize questions",
+ "description": "Enable to randomize the order of questions on display."
+ },
+ {
+ "label": "Number of questions to be shown:",
+ "description": "Create a randomized batch of questions from the total."
+ },
{
"label": "Spørsmålssett avslutning",
"fields": [
diff --git a/library.json b/library.json
index c334485..1191c1b 100644
--- a/library.json
+++ b/library.json
@@ -3,7 +3,7 @@
"description": "Put together a set of different questions that has to be solved. (Quiz)",
"contentType": "question",
"majorVersion": 1,
- "minorVersion": 9,
+ "minorVersion": 10,
"patchVersion": 0,
"embedTypes": [
"iframe"
diff --git a/semantics.json b/semantics.json
index be5a854..0e4698b 100644
--- a/semantics.json
+++ b/semantics.json
@@ -114,7 +114,8 @@
"H5P.DragQuestion 1.7",
"H5P.Blanks 1.7",
"H5P.MarkTheWords 1.6",
- "H5P.DragText 1.5"
+ "H5P.DragText 1.5",
+ "H5P.TrueFalse 1.0"
]
}
},
@@ -193,6 +194,29 @@
}
]
},
+ {
+ "name": "disableBackwardsNavigation",
+ "type": "boolean",
+ "label": "Disable backwards navigation",
+ "description": "This option will only allow you to move forward in Question Set",
+ "optional": true,
+ "default": false
+ },
+ {
+ "name": "randomQuestions",
+ "type": "boolean",
+ "label": "Randomize questions",
+ "description": "Enable to randomize the order of questions on display.",
+ "default": false
+ },
+ {
+ "name": "poolSize",
+ "type": "number",
+ "min": 1,
+ "label": "Number of questions to be shown:",
+ "description": "Create a randomized batch of questions from the total.",
+ "optional": true
+ },
{
"name": "endGame",
"type": "group",
@@ -385,4 +409,4 @@
}
]
}
-]
\ No newline at end of file
+]