Remove questionset
Svein-Tore Griff With
parent
e8ef20a995
commit
e884959081
|
|
@ -1,32 +0,0 @@
|
||||||
.dots-container {
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
.progress-dot {
|
|
||||||
display: inline-block;
|
|
||||||
width: 10px;
|
|
||||||
height: 10px;
|
|
||||||
border-radius: 50%;
|
|
||||||
}
|
|
||||||
.progress-dot.unanswered {
|
|
||||||
background: darkred;
|
|
||||||
}
|
|
||||||
.progress-dot.answered {
|
|
||||||
background: darkgreen;
|
|
||||||
}
|
|
||||||
.progress-dot.current {
|
|
||||||
box-shadow: 0px 0px 6px firebrick;
|
|
||||||
}
|
|
||||||
.intro-page {
|
|
||||||
background-color: rgba(255,255,255,0.9);
|
|
||||||
padding: 10px;
|
|
||||||
position: absolute;
|
|
||||||
z-index: 20;
|
|
||||||
height: 100%;
|
|
||||||
width: 100%;
|
|
||||||
left: 0px;
|
|
||||||
top: 0px;
|
|
||||||
}
|
|
||||||
.questionset-results {
|
|
||||||
background-color: rgba(255, 255, 255, 0.75);
|
|
||||||
padding: 10px;
|
|
||||||
}
|
|
||||||
|
|
@ -1,284 +0,0 @@
|
||||||
// Will render a Question with multiple choices for answers.
|
|
||||||
|
|
||||||
// Options format:
|
|
||||||
// {
|
|
||||||
// title: "Optional title for question box",
|
|
||||||
// question: "Question text",
|
|
||||||
// answers: [{text: "Answer text", correct: false}, ...],
|
|
||||||
// singleAnswer: true, // or false, will change rendered output slightly.
|
|
||||||
// }
|
|
||||||
//
|
|
||||||
// Events provided:
|
|
||||||
// - h5pQuestionSetFinished: Triggered when a question is finished. (User presses Finish-button)
|
|
||||||
window.H5P = window.H5P || {};
|
|
||||||
|
|
||||||
H5P.QuestionSet = function (options, contentId) {
|
|
||||||
if ( !(this instanceof H5P.QuestionSet) )
|
|
||||||
return new H5P.QuestionSet(options, contentId);
|
|
||||||
|
|
||||||
var $ = H5P.jQuery;
|
|
||||||
var cp = H5P.getContentPath(contentId);
|
|
||||||
|
|
||||||
var texttemplate = '' +
|
|
||||||
'<div class="questionset">' +
|
|
||||||
' <% if (introPage.showIntroPage) { %>' +
|
|
||||||
' <div class="intro-page">' +
|
|
||||||
' <div class="title"><%= introPage.title %></div>' +
|
|
||||||
' <div class="introduction"><%= introPage.introduction %></div>' +
|
|
||||||
' <div class="buttons"><button id="qs-startbutton"><%= introPage.startButtonText %></button></div>' +
|
|
||||||
' </div>' +
|
|
||||||
' <%} %>' +
|
|
||||||
' <div class="title"><%= title %></div>' +
|
|
||||||
' <% for (var i=0; i<questions.length; i++) { %>' +
|
|
||||||
' <div class="question-container" id="q-<%= i %>">' +
|
|
||||||
' <div><%= questions[i].machineName %></div>' +
|
|
||||||
' </div>' +
|
|
||||||
' <% } %>' +
|
|
||||||
' <div class="question-footer">' +
|
|
||||||
' <div class="progress">' +
|
|
||||||
' <% if (progressType == "dots") { %>' +
|
|
||||||
' <div class="dots-container">' +
|
|
||||||
' <% for (var i=0; i<questions.length; i++) { %>' +
|
|
||||||
' <span class="progress-dot unanswered" id="qdot-<%= i %>"></span>' +
|
|
||||||
' <%} %>' +
|
|
||||||
' </div>' +
|
|
||||||
' <% } else if (progressType == "textual") { %>' +
|
|
||||||
' <span class="progress-text"></span>' +
|
|
||||||
' <% } %>' +
|
|
||||||
' </div>' +
|
|
||||||
' <button class="prev button"><%= texts.prevButton %></button>' +
|
|
||||||
' <button class="next button"><%= texts.nextButton %></button>' +
|
|
||||||
' <button class="finish button"><%= texts.finishButton %></button>' +
|
|
||||||
' </div>' +
|
|
||||||
'</div>' +
|
|
||||||
'';
|
|
||||||
|
|
||||||
var resulttemplate = '' +
|
|
||||||
'<div class="questionset-results">' +
|
|
||||||
' <div class="greeting"><%= greeting %></div>' +
|
|
||||||
' <div class="score <%= scoreclass %>"><%= score %></div>' +
|
|
||||||
' <div class="resulttext"><%= resulttext %></div>' +
|
|
||||||
' <div><button class="qs-finishbutton"><%= finishButtonText %></button></div>' +
|
|
||||||
'</div>' +
|
|
||||||
'';
|
|
||||||
|
|
||||||
var that = this;
|
|
||||||
var defaults = {
|
|
||||||
title: "",
|
|
||||||
randomOrder: false,
|
|
||||||
initialQuestion: 0,
|
|
||||||
backgroundImage: "",
|
|
||||||
progressType: 'dots',
|
|
||||||
passPercentage: 50,
|
|
||||||
questions: [],
|
|
||||||
introPage: {
|
|
||||||
showIntroPage: true,
|
|
||||||
title: "Welcome",
|
|
||||||
introduction: "Click start to start.",
|
|
||||||
startButtonText: "Start"
|
|
||||||
},
|
|
||||||
texts: {
|
|
||||||
prevButton: "Previous",
|
|
||||||
nextButton: "Next",
|
|
||||||
finishButton: "Finish",
|
|
||||||
textualProgress: "Question: @current of @total questions"
|
|
||||||
},
|
|
||||||
endGame: {
|
|
||||||
showResultPage: true,
|
|
||||||
resultPage: {
|
|
||||||
succesGreeting: "Congratulations!",
|
|
||||||
successComment: "You have enough correct answers to pass the test.",
|
|
||||||
failGreeting: "Sorry!",
|
|
||||||
failComment: "You don't have enough correct answers to pass this test.",
|
|
||||||
scoreString: "@score/@total",
|
|
||||||
finishButtonText: "Finish"
|
|
||||||
},
|
|
||||||
animations: {
|
|
||||||
showAnimations: false,
|
|
||||||
succesResultAnimation: {
|
|
||||||
machineName: "H5P.Image",
|
|
||||||
options: {image: ""}
|
|
||||||
},
|
|
||||||
failedResultAnimation: {
|
|
||||||
machineName: "H5P.Image",
|
|
||||||
options: {image: ""}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
var template = new EJS({text: texttemplate});
|
|
||||||
var endTemplate = new EJS({text: resulttemplate});
|
|
||||||
var params = $.extend({}, defaults, options);
|
|
||||||
|
|
||||||
var currentQuestion = 0;
|
|
||||||
var questionInstances = new Array();
|
|
||||||
var allQuestionsAnswered = false;
|
|
||||||
var $myDom;
|
|
||||||
|
|
||||||
if (params.randomOrder) {
|
|
||||||
// TODO: Randomize order of questions
|
|
||||||
console.log("TODO: Randomize order of questions");
|
|
||||||
}
|
|
||||||
|
|
||||||
// Instantiate question instances
|
|
||||||
for (var i=0; i<params.questions.length; i++) {
|
|
||||||
var quest = params.questions[i];
|
|
||||||
// TODO: Render on init, inject in template.
|
|
||||||
var tmp = new (H5P.classFromName(quest.machineName))(quest.options, contentId);
|
|
||||||
questionInstances.push(tmp);
|
|
||||||
}
|
|
||||||
|
|
||||||
var _updateFinishButton = function () {
|
|
||||||
var answered = true;
|
|
||||||
for (var i = questionInstances.length - 1; i >= 0; i--) {
|
|
||||||
answered = answered && (questionInstances[i]).getAnswerGiven();
|
|
||||||
}
|
|
||||||
$('.finish.button', $myDom).attr({'disabled': !answered});
|
|
||||||
};
|
|
||||||
|
|
||||||
var _showQuestion = function (questionNumber) {
|
|
||||||
// Sanitize input.
|
|
||||||
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();
|
|
||||||
|
|
||||||
// Reshow the requested question
|
|
||||||
$('#q-' + questionNumber, $myDom).show();
|
|
||||||
|
|
||||||
// Update progress indicator
|
|
||||||
// Test if current has been answered.
|
|
||||||
if (params.progressType == 'textual') {
|
|
||||||
$('.progress-text', $myDom).text(params.texts.textualProgress.replace("@current", questionNumber+1).replace("@total", params.questions.length));
|
|
||||||
} else {
|
|
||||||
// Set currentNess
|
|
||||||
$('.progress-dot.current', $myDom).removeClass('current');
|
|
||||||
$('#qdot-' + questionNumber, $myDom).addClass('current');
|
|
||||||
}
|
|
||||||
|
|
||||||
// Remember where we are
|
|
||||||
currentQuestion = questionNumber;
|
|
||||||
return currentQuestion;
|
|
||||||
};
|
|
||||||
|
|
||||||
// Function for attaching the multichoice to a DOM element.
|
|
||||||
var attach = function (target) {
|
|
||||||
if (typeof(target) == "string") {
|
|
||||||
target = $("#" + target);
|
|
||||||
} else {
|
|
||||||
target = $(target);
|
|
||||||
}
|
|
||||||
|
|
||||||
// Render own DOM into target.
|
|
||||||
$myDom = target;
|
|
||||||
$myDom.html(template.render(params)).css({
|
|
||||||
backgroundImage: 'url(' + cp + params.backgroundImage + ')'
|
|
||||||
});
|
|
||||||
|
|
||||||
// Attach questions
|
|
||||||
for (var i=0; i<questionInstances.length; i++) {
|
|
||||||
var quest = questionInstances[i];
|
|
||||||
// TODO: Render on init, inject in template.
|
|
||||||
quest.attach('q-' + i);
|
|
||||||
$(quest).on('h5pQuestionAnswered', function (ev) {
|
|
||||||
$('#qdot-' + currentQuestion, $myDom).removeClass('unanswered').addClass('answered');
|
|
||||||
_updateFinishButton();
|
|
||||||
});
|
|
||||||
if (quest.getAnswerGiven()) {
|
|
||||||
$('#qdot-'+i, $myDom).removeClass('unanswered').addClass('answered');
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
$('#qs-startbutton').click(function (ev) {
|
|
||||||
$(this).parents('.intro-page').hide();
|
|
||||||
});
|
|
||||||
|
|
||||||
// Set event listeners.
|
|
||||||
$('.progress-dot', $myDom).click(function (ev) {
|
|
||||||
var idx = parseInt($(this).attr('id').split('-')[1]);
|
|
||||||
_showQuestion(idx);
|
|
||||||
});
|
|
||||||
$('.next.button', $myDom).click(function (ev) {
|
|
||||||
_showQuestion(currentQuestion + 1);
|
|
||||||
});
|
|
||||||
$('.prev.button', $myDom).click(function (ev) {
|
|
||||||
_showQuestion(currentQuestion - 1);
|
|
||||||
});
|
|
||||||
$('.finish.button', $myDom).click(function (ev) {
|
|
||||||
// Get total score.
|
|
||||||
var finals = getScore();
|
|
||||||
var totals = totalScore();
|
|
||||||
var scoreString = params.endGame.resultPage.scoreString.replace("@score", finals).replace("@total", totals);
|
|
||||||
var success = ((100 * finals / totals) >= params.passPercentage);
|
|
||||||
var eventData = {
|
|
||||||
score: scoreString,
|
|
||||||
passed: success
|
|
||||||
};
|
|
||||||
// Display result page.
|
|
||||||
if (params.endGame.showResultPage) {
|
|
||||||
// Render result page into.
|
|
||||||
var eparams = {
|
|
||||||
greeting: (success ? params.endGame.resultPage.succesGreeting : params.endGame.resultPage.failGreeting),
|
|
||||||
score: scoreString,
|
|
||||||
scoreclass: (success ? 'success' : 'fail'),
|
|
||||||
resulttext: (success ? params.endGame.resultPage.successComment : params.endGame.resultPage.failComment),
|
|
||||||
finishButtonText: params.endGame.resultPage.finishButtonText
|
|
||||||
};
|
|
||||||
endTemplate.update(target.attr('id'), eparams);
|
|
||||||
$('.qs-finishbutton').click(function (ev) {
|
|
||||||
// Display animation if present.
|
|
||||||
if (params.endGame.animations.showAnimations) {
|
|
||||||
// Init anims.
|
|
||||||
console.log("Now we should have started some anims...");
|
|
||||||
// On animation finished:
|
|
||||||
$(returnObject).trigger('h5pQuestionSetFinished', eventData);
|
|
||||||
} else {
|
|
||||||
// Trigger finished event.
|
|
||||||
$(returnObject).trigger('h5pQuestionSetFinished', eventData);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
} else {
|
|
||||||
$(returnObject).trigger('h5pQuestionSetFinished', eventData);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
// Hide all but initial Question.
|
|
||||||
_showQuestion(params.initialQuestion);
|
|
||||||
_updateFinishButton();
|
|
||||||
return this;
|
|
||||||
};
|
|
||||||
|
|
||||||
// Get current score for questionset.
|
|
||||||
var getScore = function () {
|
|
||||||
var score = 0;
|
|
||||||
for (var i = questionInstances.length - 1; i >= 0; i--) {
|
|
||||||
score += questionInstances[i].getScore();
|
|
||||||
}
|
|
||||||
return score;
|
|
||||||
};
|
|
||||||
|
|
||||||
// Get total score possible for questionset.
|
|
||||||
var totalScore = function () {
|
|
||||||
var score = 0;
|
|
||||||
for (var i = questionInstances.length - 1; i >= 0; i--) {
|
|
||||||
score += questionInstances[i].totalScore();
|
|
||||||
}
|
|
||||||
return score;
|
|
||||||
};
|
|
||||||
|
|
||||||
// Masquerade the main object to hide inner properties and functions.
|
|
||||||
var returnObject = {
|
|
||||||
attach: attach, // Attach to DOM object
|
|
||||||
getQuestions: function () {return questionInstances;},
|
|
||||||
getScore: getScore,
|
|
||||||
totalScore: totalScore,
|
|
||||||
defaults: defaults // Provide defaults for inspection
|
|
||||||
};
|
|
||||||
return returnObject;
|
|
||||||
};
|
|
||||||
17
library.json
17
library.json
|
|
@ -1,17 +0,0 @@
|
||||||
{
|
|
||||||
"title": "Question set",
|
|
||||||
"contentType": "question",
|
|
||||||
"majorVersion": 1,
|
|
||||||
"minorVersion": 0,
|
|
||||||
"patchVersion": 0,
|
|
||||||
"runnable": 1,
|
|
||||||
"machineName": "H5P.QuestionSet",
|
|
||||||
"author": "Amendor AS",
|
|
||||||
"license": "cc-by-sa",
|
|
||||||
"preloadedJs": [
|
|
||||||
{"path": "js/questionset.js"}
|
|
||||||
],
|
|
||||||
"preloadedCss": [
|
|
||||||
{"path": "css/questionset.css"}
|
|
||||||
]
|
|
||||||
}
|
|
||||||
168
schema.json
168
schema.json
|
|
@ -1,168 +0,0 @@
|
||||||
{
|
|
||||||
"title": {
|
|
||||||
"label": "Title",
|
|
||||||
"description": "Question set title (optional)",
|
|
||||||
"type": "text",
|
|
||||||
"default": ""
|
|
||||||
},
|
|
||||||
"randomOrder": {
|
|
||||||
"label": "Randomize order",
|
|
||||||
"description": "Whether questions should be shown in random order",
|
|
||||||
"type": "boolean",
|
|
||||||
"default": false
|
|
||||||
},
|
|
||||||
"initialQuestion": {
|
|
||||||
"label": "Initial question",
|
|
||||||
"description": "Which question to start with. Count from 0",
|
|
||||||
"type": "integer",
|
|
||||||
"default": 0
|
|
||||||
},
|
|
||||||
"backgroundImage": {
|
|
||||||
"label": "Background image",
|
|
||||||
"description": "An optional background image for the Question set.",
|
|
||||||
"type": "image",
|
|
||||||
"default": ""
|
|
||||||
},
|
|
||||||
"progressType": {
|
|
||||||
"label": "Progress indicator",
|
|
||||||
"description": "Question set progress indicator style",
|
|
||||||
"type": "select",
|
|
||||||
"values": [{"text": "Textual", "value": "textual"}, {"text": "Dots", "value": "dots"}],
|
|
||||||
"default": "textual"
|
|
||||||
},
|
|
||||||
"passPercentage": {
|
|
||||||
"label": "Pass percentage",
|
|
||||||
"description": "Percentage of total score required for passing the quiz.",
|
|
||||||
"type": "integer",
|
|
||||||
"minValue": 0,
|
|
||||||
"maxValue": 100,
|
|
||||||
"default": 50
|
|
||||||
},
|
|
||||||
"questions": {
|
|
||||||
"label": "Questions",
|
|
||||||
"description": "List of questions in this set.",
|
|
||||||
"type": "h5p-library",
|
|
||||||
"validLibs": ["H5P.MultiChoice", "H5P.DragTextMatch", "H5PDragImageIntoPosition"],
|
|
||||||
"array": true,
|
|
||||||
"minEntries": 1,
|
|
||||||
"maxEntries": -1
|
|
||||||
},
|
|
||||||
"introPage": {
|
|
||||||
"label": "Intro page",
|
|
||||||
"description": "Data for the intro page",
|
|
||||||
"type": "combined",
|
|
||||||
"fields": {
|
|
||||||
"showIntroPage": {
|
|
||||||
"label": "Show intro page?",
|
|
||||||
"type": "boolean"
|
|
||||||
},
|
|
||||||
"title": {
|
|
||||||
"label": "Title",
|
|
||||||
"type": "text"
|
|
||||||
},
|
|
||||||
"introduction": {
|
|
||||||
"label": "Introduction text",
|
|
||||||
"type": "text"
|
|
||||||
},
|
|
||||||
"startButtonText": {
|
|
||||||
"label": "Start button text",
|
|
||||||
"type": "text"
|
|
||||||
}
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"texts": {
|
|
||||||
"label": "Interface texts in quiz",
|
|
||||||
"type": "combined"
|
|
||||||
"fields": {
|
|
||||||
"prevButton": {
|
|
||||||
"label": "Back button",
|
|
||||||
"type": "text",
|
|
||||||
"default": "Previous"
|
|
||||||
},
|
|
||||||
"nextButton": {
|
|
||||||
"label": "Next button",
|
|
||||||
"type": "text",
|
|
||||||
"default": "Next"
|
|
||||||
},
|
|
||||||
"finishButton": {
|
|
||||||
"label": "Finish button",
|
|
||||||
"type": "text",
|
|
||||||
"default": "Finish"
|
|
||||||
},
|
|
||||||
"textualProgress": {
|
|
||||||
"label": "Progress text",
|
|
||||||
"description": "Text used if textual progress is selected.",
|
|
||||||
"type": "text",
|
|
||||||
"default": "Question: @current of @total questions"
|
|
||||||
}
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"endGame": {
|
|
||||||
"label": "End game data",
|
|
||||||
"type": "combined",
|
|
||||||
"fields" {
|
|
||||||
"showResultPage": {
|
|
||||||
"label": "Show result page",
|
|
||||||
"type": "boolean",
|
|
||||||
"default": true
|
|
||||||
},
|
|
||||||
"resultPage": {
|
|
||||||
"label": "Result page",
|
|
||||||
"description": "Data and texts for the result page",
|
|
||||||
"type": "combined",
|
|
||||||
"fields": {
|
|
||||||
"successGreeting": {
|
|
||||||
"label": "Success greeting",
|
|
||||||
"description": "Title in result page on success",
|
|
||||||
"type": "text"
|
|
||||||
},
|
|
||||||
"successComment": {
|
|
||||||
"label": "Success comment",
|
|
||||||
"description": "Comment shown after the score",
|
|
||||||
"type": "text"
|
|
||||||
},
|
|
||||||
"failGreeting": {
|
|
||||||
"label": "Failed greeting",
|
|
||||||
"description": "Title in result page on failed quiz",
|
|
||||||
"type": "text"
|
|
||||||
},
|
|
||||||
"failComment": {
|
|
||||||
"label": "Failed comment",
|
|
||||||
"description": "Comment shown after the score on failed quiz",
|
|
||||||
"type": "text"
|
|
||||||
},
|
|
||||||
"finishButtonText": {
|
|
||||||
"label": "Finish button text",
|
|
||||||
"description": "Text for the finish button",
|
|
||||||
"type": "text"
|
|
||||||
}
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"animations": {
|
|
||||||
"label": "Animations",
|
|
||||||
"type": "combined"
|
|
||||||
"fields": {
|
|
||||||
"showAnimations": {
|
|
||||||
"label": "Show animations",
|
|
||||||
"type": "boolean",
|
|
||||||
"default": false
|
|
||||||
}
|
|
||||||
"successResultAnimation": {
|
|
||||||
"label": "Result animation for success",
|
|
||||||
"description": "Add animation for successful completion of the quiz",
|
|
||||||
"optional": true,
|
|
||||||
"type": "h5p-library",
|
|
||||||
"validLibs": ["H5P.Animation", "H5P.Video", "H5P.Image"]
|
|
||||||
},
|
|
||||||
"failedResultAnimation": {
|
|
||||||
"label": "Result animation for failed quiz",
|
|
||||||
"description": "Add animation for failed completion of the quiz",
|
|
||||||
"optional": true,
|
|
||||||
"type": "h5p-library",
|
|
||||||
"validLibs": ["H5P.Animation", "H5P.Video", "H5P.Image"]
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
@ -1,5 +0,0 @@
|
||||||
<div class="questionset-intro">
|
|
||||||
<div class="title"><%= title %></div>
|
|
||||||
<div class="introduction"><%= introduction %></div>
|
|
||||||
<div class="buttons"><button id="qs-startbutton"><%= startButtonText %></button></div>
|
|
||||||
</div>
|
|
||||||
|
|
@ -1,6 +0,0 @@
|
||||||
<div class="questionset-results">
|
|
||||||
<div class="greeting"><%= greeting %></div>
|
|
||||||
<div class="score <%= scoreclass %>"><%= score %></div>
|
|
||||||
<div class="resulttext"><%= resulttext %></div>
|
|
||||||
<div><button class="qs-finishbutton"><%= finishButtonText %></button></div>
|
|
||||||
</div>
|
|
||||||
|
|
@ -1,31 +0,0 @@
|
||||||
<div class="questionset">
|
|
||||||
<% if (introPage.showIntroPage) { %>
|
|
||||||
<div class="intro-page">
|
|
||||||
<div class="title"><%= introPage.title %></div>
|
|
||||||
<div class="introduction"><%= introPage.introduction %></div>
|
|
||||||
<div class="buttons"><button id="qs-startbutton"><%= introPage.startButtonText %></button></div>
|
|
||||||
</div>
|
|
||||||
<%} %>
|
|
||||||
<div class="title"><%= title %></div>
|
|
||||||
<% for (var i=0; i<questions.length; i++) { %>
|
|
||||||
<div class="question-container" id="q-<%= i %>">
|
|
||||||
<div><%= questions[i].machineName %></div>
|
|
||||||
</div>
|
|
||||||
<% } %>
|
|
||||||
<div class="question-footer">
|
|
||||||
<div class="progress">
|
|
||||||
<% if (progressType == "dots") { %>
|
|
||||||
<div class="dots-container">
|
|
||||||
<% for (var i=0; i<questions.length; i++) { %>
|
|
||||||
<span class="progress-dot unanswered" id="qdot-<%= i %>"></span>
|
|
||||||
<%} %>
|
|
||||||
</div>
|
|
||||||
<% } else if (progressType == "textual") { %>
|
|
||||||
<span class="progress-text"></span>
|
|
||||||
<% } %>
|
|
||||||
</div>
|
|
||||||
<button class="prev button"><%= texts.prevButton %></button>
|
|
||||||
<button class="next button"><%= texts.nextButton %></button>
|
|
||||||
<button class="finish button"><%= texts.finishButton %></button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
Loading…
Reference in New Issue