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

Styling for result page. Better button states

d3summaryChart
Frank Ronny Larsen 2013-02-06 20:25:06 +01:00
parent 44ef62eb90
commit 929e71fa38
2 changed files with 46 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
css/questionset.css
View File

@ -91,7 +91,7 @@
}
.qs-footer .button.next {
right: 100px;
right: 0px;
}
.qs-footer .button.finish {
right: 0px;
@ -101,12 +101,22 @@
}
.questionset-results {
background-color: rgba(255, 255, 255, 0.75);
background: rgba(255, 255, 255, 0.75) url(img/Paper-clean.png);
padding: 10px;
height: 480px;
text-align: center;
}
.questionset-results .greeting {
margin-top: 180px;
}
.questionset-results .score {
font-size: 25px;
margin-top: 40px;
}
.questionset-results .resulttext {
font-size: 20px;
line-height: 25px;
@ -120,13 +130,22 @@
.questionset-results .resulttext.fail {
background-image: url(img/mark-fail.png);
}
.questionset-results .resulttext.fail .em {
font-style: normal;
color: #b9272d;
}
.questionset-results .resulttext.success {
background-image: url(img/mark-pass.png);
}
.questionset-results .resulttext.success .em {
font-style: normal;
color: #6aa81b;
}
.questionset-results .buttons {
text-align: right;
position: absolute;
bottom: 40px;
right: 25px;
}
button {

29
js/questionset.js
View File

@ -123,12 +123,28 @@ H5P.QuestionSet = function (options, contentId) {
questionInstances.push(tmp);
}
var _updateFinishButton = function () {
// Update button state.
var _updateButtons = function () {
var answered = true;
for (var i = questionInstances.length - 1; i >= 0; i--) {
answered = answered && (questionInstances[i]).getAnswerGiven();
}
$('.finish.button', $myDom).attr({'disabled': !answered});
if (currentQuestion === 0) {
$('.prev.button', $myDom).hide();
} else {
$('.prev.button', $myDom).show();
}
if (currentQuestion == (params.questions.length - 1)) {
$('.next.button', $myDom).hide();
if (answered) {
$('.finish.button', $myDom).show();
}
} else {
$('.next.button', $myDom).show();
$('.finish.button', $myDom).hide();
}
};
var _showQuestion = function (questionNumber) {
@ -136,10 +152,6 @@ H5P.QuestionSet = function (options, contentId) {
if (questionNumber < 0) { questionNumber = 0; }
if (questionNumber >= params.questions.length) { questionNumber = params.questions.length - 1; }
$('.prev.button', $myDom).attr({'disabled': (questionNumber === 0)});
$('.next.button', $myDom).attr({'disabled': (questionNumber == params.questions.length-1)});
// Hide all questions
$('.question-container', $myDom).hide();
@ -158,6 +170,7 @@ H5P.QuestionSet = function (options, contentId) {
// Remember where we are
currentQuestion = questionNumber;
_updateButtons();
return currentQuestion;
};
@ -182,7 +195,7 @@ H5P.QuestionSet = function (options, contentId) {
quest.attach('q-' + i);
$(quest).on('h5pQuestionAnswered', function (ev) {
$('#qdot-' + currentQuestion, $myDom).removeClass('unanswered').addClass('answered');
_updateFinishButton();
_updateButtons();
});
if (quest.getAnswerGiven()) {
$('#qdot-'+i, $myDom).removeClass('unanswered').addClass('answered');
@ -270,7 +283,7 @@ H5P.QuestionSet = function (options, contentId) {
// Hide all but initial Question.
_showQuestion(params.initialQuestion);
_updateFinishButton();
_updateButtons();
return this;
};