EDUCATIC
/
h5p-question-set
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Merge branch 'master' into release

pull/7/head
Frode Petterson 2016-07-27 12:40:01 +02:00
parent 87a1d722ca b7a991fc3c
commit e03e6e74f6
9 changed files with 376 additions and 79 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
css/questionset.css
View File

@ -35,6 +35,12 @@
.dots-container {
text-align: center;
line-height: 2em;
padding: 0;
margin: 0;
}
.progress-item {
list-style: none;
display: inline-block;
}
.progress-dot {
display: inline-block;
@ -95,6 +101,7 @@
}
.qs-footer {
overflow: hidden;
clear: both;
}
.qs-footer > .prev {
@ -125,6 +132,13 @@
transition: none;
}
.qs-progress-announcer {
height: 0;
width: 0;
position: absolute;
overflow: hidden;
}
.h5p-question .h5p-question-prev,
.h5p-question .h5p-question-finish,
.h5p-question .h5p-question-next {

178
js/questionset.js
View File

@ -31,6 +31,7 @@ H5P.QuestionSet = function (options, contentId) {
' <div class="buttons"><a class="qs-startbutton h5p-joubelui-button h5p-button"><%= introPage.startButtonText %></a></div>' +
'</div>' +
'<% } %>' +
'<div tabindex="-1" class="qs-progress-announcer"></div>' +
'<div class="questionset<% if (introPage.showIntroPage) { %> hidden<% } %>">' +
' <% for (var i=0; i<questions.length; i++) { %>' +
' <div class="question-container"></div>' +
@ -38,10 +39,14 @@ H5P.QuestionSet = function (options, contentId) {
' <div class="qs-footer">' +
' <div class="qs-progress">' +
' <% if (progressType == "dots") { %>' +
' <div class="dots-container">' +
' <ul class="dots-container" role="navigation">' +
' <% for (var i=0; i<questions.length; i++) { %>' +
' <a href="#" class="progress-dot unanswered" aria-label="<%= texts.jumpToQuestion.replace("%d", i + 1) %>"></a>' +
' <%} %>' +
' <li class="progress-item"><a href="#" class="progress-dot unanswered" ' +
' aria-label="<%=' +
' texts.jumpToQuestion.replace("%d", i + 1).replace("%total", questions.length)' +
' + ", " + texts.unansweredText' +
' %>" tabindex="-1"></a></li>' +
' <% } %>' +
' </div>' +
' <% } else if (progressType == "textual") { %>' +
' <span class="progress-text"></span>' +
@ -87,8 +92,12 @@ H5P.QuestionSet = function (options, contentId) {
nextButton: 'Next question',
finishButton: 'Finish',
textualProgress: 'Question: @current of @total questions',
jumpToQuestion: 'Jump to question %d',
questionLabel: 'Question'
jumpToQuestion: 'Question %d of %total',
questionLabel: 'Question',
readSpeakerProgress: 'Question @current of @total',
unansweredText: 'Unanswered',
answeredText: 'Answered',
currentQuestionText: 'Current question'
},
endGame: {
showResultPage: true,
@ -178,9 +187,14 @@ H5P.QuestionSet = function (options, contentId) {
answered = answered && (questionInstances[i]).getAnswerGiven();
}
if (currentQuestion === (params.questions.length - 1) && answered &&
if (currentQuestion === (params.questions.length - 1) &&
questionInstances[currentQuestion]) {
questionInstances[currentQuestion].showButton('finish');
if (answered) {
questionInstances[currentQuestion].showButton('finish');
}
else {
questionInstances[currentQuestion].hideButton('finish');
}
}
};
@ -190,7 +204,7 @@ H5P.QuestionSet = function (options, contentId) {
}
};
var _showQuestion = function (questionNumber) {
var _showQuestion = function (questionNumber, preventAnnouncement) {
// Sanitize input.
if (questionNumber < 0) {
questionNumber = 0;
@ -220,8 +234,29 @@ H5P.QuestionSet = function (options, contentId) {
}
else {
// Set currentNess
$('.progress-dot.current', $myDom).removeClass('current');
$('.progress-dot:eq(' + questionNumber +')', $myDom).addClass('current');
var previousQuestion = $('.progress-dot.current', $myDom).parent().index();
if (previousQuestion >= 0) {
toggleCurrentDot(previousQuestion, false);
toggleAnsweredDot(previousQuestion, questionInstances[previousQuestion].getAnswerGiven());
}
toggleCurrentDot(questionNumber, true);
}
if (!preventAnnouncement) {
// Announce question number of total, must use timeout because of buttons logic
setTimeout(function () {
var humanizedProgress = params.texts.readSpeakerProgress
.replace('@current', (currentQuestion + 1).toString())
.replace('@total', questionInstances.length.toString());
$('.qs-progress-announcer', $myDom)
.html(humanizedProgress)
.show().focus();
if (instance && instance.readFeedback) {
instance.readFeedback();
}
}, 0);
}
// Remember where we are
@ -238,7 +273,10 @@ H5P.QuestionSet = function (options, contentId) {
var showSolutions = function () {
for (var i = 0; i < questionInstances.length; i++) {
try {
// Do not read answers
questionInstances[i].toggleReadSpeaker(true);
questionInstances[i].showSolutions();
questionInstances[i].toggleReadSpeaker(false);
}
catch(error) {
H5P.error("subcontent does not contain a valid showSolutions function");
@ -267,7 +305,9 @@ H5P.QuestionSet = function (options, contentId) {
questionInstances[questionInstances.length - 1].hideButton('finish');
// Mark all tasks as unanswered:
$('.progress-dot').removeClass('answered').addClass('unanswered');
$('.progress-dot').each(function (idx) {
toggleAnsweredDot(idx, false);
});
//Force the last page to be reRendered
rendered = false;
@ -290,7 +330,60 @@ H5P.QuestionSet = function (options, contentId) {
}
};
/**
* Toggle answered state of dot at given index
* @param {number} dotIndex Index of dot
* @param {boolean} isAnswered True if is answered, False if not answered
*/
var toggleAnsweredDot = function(dotIndex, isAnswered) {
var $el = $('.progress-dot:eq(' + dotIndex +')', $myDom);
// Skip current button
if ($el.hasClass('current')) {
return;
}
// Ensure boolean
isAnswered = !!isAnswered;
var label = params.texts.jumpToQuestion
.replace('%d', (dotIndex + 1).toString())
.replace('%total', $('.progress-dot', $myDom).length) +
', ' +
(isAnswered ? params.texts.answeredText : params.texts.unansweredText);
$el.toggleClass('unanswered', !isAnswered)
.toggleClass('answered', isAnswered)
.attr('aria-label', label);
};
/**
* Toggle current state of dot at given index
* @param dotIndex
* @param isCurrent
*/
var toggleCurrentDot = function (dotIndex, isCurrent) {
var $el = $('.progress-dot:eq(' + dotIndex +')', $myDom);
var texts = params.texts;
var label = texts.jumpToQuestion
.replace('%d', (dotIndex + 1).toString())
.replace('%total', $('.progress-dot', $myDom).length);
if (!isCurrent) {
var isAnswered = $el.hasClass('answered');
label += ', ' + (isAnswered ? texts.answeredText : texts.unansweredText);
}
else {
label += ', ' + texts.currentQuestionText;
}
$el.toggleClass('current', isCurrent)
.attr('aria-label', label)
.attr('tabindex', isCurrent ? 0 : -1);
};
var _displayEndGame = function () {
$('.progress-dot.current', $myDom).removeClass('current');
if (rendered) {
$myDom.children().hide().filter('.questionset-results').show();
self.trigger('resize');
@ -374,6 +467,16 @@ H5P.QuestionSet = function (options, contentId) {
scoreBar.appendTo($('.feedback-scorebar', $myDom));
scoreBar.setScore(finals);
$('.feedback-text', $myDom).html(scoreString);
// Announce that the question set is complete
setTimeout(function () {
$('.qs-progress-announcer', $myDom)
.html(eparams.message + '.' +
scoreString + '.' +
eparams.comment + '.' +
eparams.resulttext)
.show().focus();
}, 0);
}
else {
// Remove buttons and feedback section
@ -503,9 +606,8 @@ H5P.QuestionSet = function (options, contentId) {
if (shortVerb === 'interacted' ||
shortVerb === 'answered' ||
shortVerb === 'attempted') {
if (questionInstances[currentQuestion].getAnswerGiven()) {
$('.progress-dot:eq(' + currentQuestion +')', $myDom).removeClass('unanswered').addClass('answered');
}
toggleAnsweredDot(currentQuestion,
questionInstances[currentQuestion].getAnswerGiven());
_updateButtons();
}
if (shortVerb === 'completed') {
@ -528,15 +630,53 @@ H5P.QuestionSet = function (options, contentId) {
_showQuestion(params.initialQuestion);
});
// Set event listeners.
$('.progress-dot', $myDom).click(function () {
/**
* Triggers changing the current question.
*
* @private
* @param {Object} [event]
*/
var handleProgressDotClick = function (event) {
_stopQuestion(currentQuestion);
_showQuestion($(this).index());
return false;
_showQuestion($(this).parent().index());
event.preventDefault();
};
// Set event listeners.
$('.progress-dot', $myDom).click(handleProgressDotClick).keydown(function (event) {
var $this = $(this);
switch (event.which) {
case 13: // Enter
case 32: // Space
handleProgressDotClick.call(this, event);
break;
case 37: // Left Arrow
case 38: // Up Arrow
// Go to previous dot
var $prev = $this.parent().prev();
if ($prev.length) {
$prev.children('a').attr('tabindex', '0').focus();
$this.attr('tabindex', '-1');
}
break;
case 39: // Right Arrow
case 40: // Down Arrow
// Go to next dot
var $next = $this.parent().next();
if ($next.length) {
$next.children('a').attr('tabindex', '0').focus();
$this.attr('tabindex', '-1');
}
break;
}
});
// Hide all but initial Question.
_showQuestion(params.initialQuestion);
_showQuestion(params.initialQuestion, true);
if (renderSolutions) {
showSolutions();

21
language/ar.json
View File

@ -77,12 +77,29 @@
},
{
"label": "Label for jumping to a certain question",
"description": "You must use the placeholder '%d' instead of the question number.",
"default": "Jump to question %d"
"description": "You must use the placeholder '%d' instead of the question number, and %total instead of total amount of questions.",
"default": "Question %d of %total"
},
{
"label": "Copyright dialog question label",
"default": "Question"
},
{
"label": "Readspeaker progress",
"description": "May use @current and @total question variables",
"default": "Question @current of @total"
},
{
"label": "Unanswered question text",
"default": "Unanswered"
},
{
"label": "Answered question text",
"default": "Answered"
},
{
"label": "Current question text",
"default": "Current question"
}
]
},

21
language/de.json
View File

@ -82,12 +82,29 @@
},
{
"label": "Label for jumping to a certain question",
"description": "You must use the placeholder '%d' instead of the question number.",
"default": "Jump to question %d"
"description": "You must use the placeholder '%d' instead of the question number, and %total instead of total amount of questions.",
"default": "Question %d of %total"
},
{
"label": "Copyright dialog question label",
"default": "Question"
},
{
"label": "Readspeaker progress",
"description": "May use @current and @total question variables",
"default": "Question @current of @total"
},
{
"label": "Unanswered question text",
"default": "Unanswered"
},
{
"label": "Answered question text",
"default": "Answered"
},
{
"label": "Current question text",
"default": "Current question"
}
]
},

129
language/fr.json
View File

@ -4,7 +4,7 @@
"label": "Introduction du Quiz ",
"fields": [
{
"label": "Montrer l'introduction"
"label": "Afficher l'introduction"
},
{
"label": "Titre",
@ -15,7 +15,8 @@
"description": "Ce texte sera affiché avant le démarrage du quiz."
},
{
"label": "Texte du bouton de démarrage"
"label": "Texte du bouton de démarrage",
"default": "Commencer"
},
{
"label": "Image d'arrière-plan",
@ -29,7 +30,7 @@
},
{
"label": "Indicateur de progression",
"description": "Style de l'indicateur de progression de la série de questions",
"description": "Style de l'indicateur de progression de la série de questions.",
"options": [
{
"label": "Texte"
@ -41,7 +42,7 @@
},
{
"label": "Pourcentage de réussite",
"description": "Pourcentage exigé pour la réussite du quiz."
"description": "Pourcentage exigé pour considérer que le quiz est réussi."
},
{
"label": "Questions",
@ -60,121 +61,153 @@
}
},
{
"label": "Interface des Textes dans le quiz",
"label": "Textes de l'interface du quiz",
"fields": [
{
"label": "Bouton précédent"
"label": "Bouton précédent",
"default": "Retour"
},
{
"label": "Bouton suivant"
"label": "Bouton suivant",
"default": "Suite"
},
{
"label": "Bouton fin"
"label": "Bouton fin",
"default": "Terminer"
},
{
"label": "Texte de progression",
"description": "Texte utilisé si la progression textuelle est utilisée."
"description": "Texte utilisé si la progression textuelle a été sélectionnée.",
"default": "Question @current sur @total"
},
{
"label": "Label for jumping to a certain question",
"description": "You must use the placeholder '%d' instead of the question number.",
"default": "Jump to question %d"
"label": "Texte pour aller directement à une question",
"description": "Vous devez utiliser la variable '%d' à la place du numéro de la question et %total à la place du nombre total de questions.",
"default": "Question %d sur %total"
},
{
"label": "Copyright dialog question label",
"label": "Texte de la question de la boîte de dialogue de copyright",
"default": "Question"
},
{
"label": "Progression pour la synthèse vocale",
"description": "Vous pouvez utiliser les variables @current et @total",
"default": "Question @current sur @total"
},
{
"label": "Texte d'une question sans réponse",
"default": "Pas de réponse donnée"
},
{
"label": "Texte d'une question ayant reçu une réponse",
"default": "Réponse donnée"
},
{
"label": "Texte de la question en cours",
"default": "Question en cours"
}
]
},
{
"label": "Quiz fini",
"label": "Quiz terminé",
"fields": [
{
"label": "Montrer les résultats"
"label": "Afficher les résultats"
},
{
"label": "No results message",
"description": "Text displayed on end page when \"Display results\" is disabled",
"default": "Finished"
"label": "Message si pas de résultats",
"description": "Texte affiché sur la page finale si l'option \"Afficher les résultats\" est désactivée.",
"default": "Terminé"
},
{
"label": "Feedback de fin",
"description": "Ce texte sera affiché quand l'utilisateur aura totalement terminé le quiz."
"label": "Titre des commentaires",
"default": "Vos résultats :",
"description": "Ce titre sera affiché à la fin du quiz quand l'utilisateur aura répondu à toutes les questions."
},
{
"label": "Texte d'affichage du score",
"description": "Texte utilisé pour afficher le score total de l'utilisateur. \"@score\" sera remplacé par le score de l'utilisateur, \"@total\" sera remplacé par le score maximum possible."
"description": "Texte utilisé pour afficher le score total de l'utilisateur. \"@score\" sera remplacé par le score de l'utilisateur, \"@total\" sera remplacé par le score maximum possible.",
"default": "Vous avez obtenu @score point(s) sur @total"
},
{
"label": "Texte de félicitation",
"description": "Texte affiché lors du passage du quiz avec succès."
"label": "Commentaire de félicitation",
"placeholder": "Bravo !",
"default": "Bravo !",
"description": "Ce commentaire sera affiché au-dessus du score de l'utilisateur si celui-ci réussit le quiz."
},
{
"label": "Commentaire de fin de quiz réussi",
"label": "Commentaire en cas de succès",
"default": "Vous avez obtenu un très bon score !",
"description": "Commentaire affiché lors du passage du quiz avec succès."
},
{
"label": "Texte d'échec",
"description": "Texte affiché lors de l'échec au quiz."
"label": "Commentaire en cas d'échec",
"default": "Vous n'avez pas réussi ce questionnaire.",
"description": "Ce commentaire sera affiché au-dessus du score de l'utilisateur si celui-ci échoue au quiz."
},
{
"label": "Commentaire de fin de quiz échoué",
"description": "Commentaire affiché lors de l'échec au quiz."
"label": "Commentaire additionnel en cas d'échec",
"default": "Refaites un essai !",
"description": "Commentaire additionnel affiché lors de l'échec au quiz."
},
{
"label": "Texte du bouton Solution",
"label": "Texte du bouton \"Solution\"",
"default": "Voir la solution",
"description": "Texte pour le bouton de solution."
},
{
"label": "Texte du bouton Réessayer",
"description": "Texte pour le bouton Réessayer."
"label": "Texte du bouton \"Recommencer\"",
"default": "Recommencer",
"description": "Texte pour le bouton Recommencer."
},
{
"label": "Texte pour le bouton de fin"
"label": "Texte pour le bouton de fin",
"default": "Terminer"
},
{
"label": "Montrer une vidéo avant l'affichage des résultats du quiz"
"label": "Afficher une vidéo avant l'affichage des résultats du quiz"
},
{
"label": "Activer le bouton passer la vidéo"
"label": "Activer le bouton \"Passer la vidéo\""
},
{
"label": "Texte du bouton passer la vidéo"
"label": "Texte du bouton \"Passer la vidéo\"",
"default": "Passer la vidéo"
},
{
"label": "Video en cas de succès",
"description": "Vidéo affichée lors du passage du quiz avec succès."
"label": "Vidéo en cas de succès",
"description": "Vidéo affichée si l'utilisateur réussit le quiz."
},
{
"label": "Video en cas d'échec",
"description": "Vidéo affichée lors de l'échec au quiz."
"label": "Vidéo en cas d'échec",
"description": "Vidéo affichée si l'utilisateur échoue au quiz."
}
]
},
{
"label": "Options pour les boutons \"Montrer la solution\" et \"Réessayer\".",
"label": "Options pour les boutons \"Montrer la solution\" et \"Recommencer\".",
"fields": [
{
"label": "Override \"Show Solution\" button",
"description": "This option determines if the \"Show Solution\" button will be shown for all questions, disabled for all or configured for each question individually.",
"label": "Ecraser le bouton \"Voir la solution\"",
"description": "Cette option détermine si le bouton \"Voir la solution\" sera affiché pour toutes les questions, désactivé pour toutes ou configuré pour chaque question individuellement.",
"options": [
{
"label": "Enabled"
"label": "Activé"
},
{
"label": "Disabled"
"label": "Désactivé"
}
]
},
{
"label": "Override \"Retry\" button",
"description": "This option determines if the \"Retry\" button will be shown for all questions, disabled for all or configured for each question individually.",
"label": "Ecraser le bouton \"Recommencer\"",
"description": "Cette option détermine si le bouton \"Recommencer\" sera affiché pour toutes les questions, désactivé pour toutes ou configuré pour chaque question individuellement.",
"options": [
{
"label": "Enabled"
"label": "Activé"
},
{
"label": "Disabled"
"label": "Désactivé"
}
]
}

21
language/it.json
View File

@ -77,12 +77,29 @@
},
{
"label": "Label for jumping to a certain question",
"description": "You must use the placeholder '%d' instead of the question number.",
"default": "Jump to question %d"
"description": "You must use the placeholder '%d' instead of the question number, and %total instead of total amount of questions.",
"default": "Question %d of %total"
},
{
"label": "Copyright dialog question label",
"default": "Question"
},
{
"label": "Readspeaker progress",
"description": "May use @current and @total question variables",
"default": "Question @current of @total"
},
{
"label": "Unanswered question text",
"default": "Unanswered"
},
{
"label": "Answered question text",
"default": "Answered"
},
{
"label": "Current question text",
"default": "Current question"
}
]
},

21
language/nb.json
View File

@ -79,12 +79,29 @@
},
{
"label": "Merkelapp ved hopping til spørsmål",
"description": "Du må bruke plassholderen '%d' istedenfor spørsmålsnummeret.",
"default": "Hopp til spørsmål %d"
"description": "Du må bruke plassholderen '%d' istedenfor spørsmålsnummeret, og '%total' istedet for totalt antall spørsmål.",
"default": "Spørsmål %d av %total"
},
{
"label": "Opphavsrett spørsmål-etikett",
"default": "Spørsmål"
},
{
"label": "Fremdriftstekst for hjelpemiddelteknologi",
"description": "Kan bruke @current og @total variabler",
"default": "Deloppgave @current av @total"
},
{
"label": "Ikke svart på spørsmål-tekst",
"default": "Ikke svart"
},
{
"label": "Svart på spørsmål-tekst",
"default": "Svar avgitt"
},
{
"label": "Aktivt spørsmål-tekst",
"default": "Aktivt spørsmål"
}
]
},

21
language/nn.json
View File

@ -79,12 +79,29 @@
},
{
"label": "Merkelapp ved hopping til spørsmål",
"description": "Du må bruke plassholderen '%d' istedenfor spørsmålstalet.",
"default": "Hopp til spørsmål %d"
"description": "Du må bruke plassholderen '%d' istedenfor spørsmålsnummeret, og '%total' istedet for totalt antall spørsmål.",
"default": "Spørsmål %d av %total"
},
{
"label": "Opphavsrett spørsmål-etikett",
"default": "Spørsmål"
},
{
"label": "Fremdriftstekst for hjelpemiddelteknologi",
"description": "Kan bruke @current og @total variabler",
"default": "Deloppgave @current av @total"
},
{
"label": "Ikke svart på spørsmål-tekst",
"default": "Ikke svart"
},
{
"label": "Svart på spørsmål-tekst",
"default": "Svar avgitt"
},
{
"label": "Aktivt spørsmål-tekst",
"default": "Aktivt spørsmål"
}
]
},

29
semantics.json
View File

@ -157,14 +157,39 @@
"name": "jumpToQuestion",
"type": "text",
"label": "Label for jumping to a certain question",
"description": "You must use the placeholder '%d' instead of the question number.",
"default": "Jump to question %d"
"description": "You must use the placeholder '%d' instead of the question number, and %total instead of total amount of questions.",
"default": "Question %d of %total"
},
{
"name": "questionLabel",
"type": "text",
"label": "Copyright dialog question label",
"default": "Question"
},
{
"name": "readSpeakerProgress",
"type": "text",
"label": "Readspeaker progress",
"description": "May use @current and @total question variables",
"default": "Question @current of @total"
},
{
"name": "unansweredText",
"type": "text",
"label": "Unanswered question text",
"default": "Unanswered"
},
{
"name": "answeredText",
"type": "text",
"label": "Answered question text",
"default": "Answered"
},
{
"name": "currentQuestionText",
"type": "text",
"label": "Current question text",
"default": "Current question"
}
]
},