Added question progress bar
This commit is contained in:
parent
f0bfecaad3
commit
335c42f924
@ -368,6 +368,23 @@ function render_question() {
|
||||
</div>`;
|
||||
}
|
||||
$question_options.html(options_output);
|
||||
let skipped = count_questions(-1);
|
||||
let answered = count_questions(2);
|
||||
let flagged = count_questions(1);
|
||||
|
||||
$progress_skipped.attr('title', `Skipped: ${skipped}`);
|
||||
$progress_skipped.attr('aria-valuenow', skipped);
|
||||
$progress_skipped.css('width', `${skipped}%`);
|
||||
|
||||
$progress_flagged.attr('title', `Flagged: ${flagged}`);
|
||||
$progress_flagged.attr('aria-valuenow', flagged);
|
||||
$progress_flagged.css('width', `${flagged}%`);
|
||||
|
||||
$progress_answered.attr('title', `Answered: ${answered}`);
|
||||
$progress_answered.attr('aria-valuenow', answered);
|
||||
$progress_answered.css('width', `10%`);
|
||||
console.log(`Answered: ${answered}, Skipped: ${skipped}, Flagged: ${flagged}`);
|
||||
|
||||
$question_title.focus();
|
||||
$(window).scrollTop(0);
|
||||
}
|
||||
@ -550,6 +567,17 @@ function stop() {
|
||||
$("#btn-toggle-settings").addClass('disabled')
|
||||
}
|
||||
|
||||
function count_questions(status) {
|
||||
output = 0;
|
||||
for (let i = 0; i < Object.keys(question_status).length; i++) {
|
||||
key = Object.keys(question_status)[i];
|
||||
if (question_status[key] == status){
|
||||
output ++;
|
||||
}
|
||||
}
|
||||
return output;
|
||||
}
|
||||
|
||||
// Variable Definitions
|
||||
|
||||
const _id = window.localStorage.getItem('_id');
|
||||
@ -582,7 +610,13 @@ const $question_header = $("#quiz-question-header");
|
||||
const $question_text = $("#quiz-question-text");
|
||||
const $question_options = $("#quiz-question-options");
|
||||
|
||||
const $progress_skipped = $("#skipped");
|
||||
const $progress_answered = $("#answered");
|
||||
const $progress_flagged = $("#flagged");
|
||||
|
||||
// Execution on Load
|
||||
|
||||
apply_settings(display_settings);
|
||||
check_started();
|
||||
check_started();
|
||||
|
||||
console.log($progress_answered);
|
@ -223,6 +223,11 @@
|
||||
Exam Console
|
||||
</h1>
|
||||
<div class="container question-container">
|
||||
<div class="progress">
|
||||
<div id="answered" class="progress-bar bg-success" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100"></div>
|
||||
<div id="flagged" class="progress-bar bg-warning" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100"></div>
|
||||
<div id="skipped" class="progress-bar progress-bar-striped bg-danger" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100"></div>
|
||||
</div>
|
||||
<h4 class="question-title" id="quiz-question-title" tabindex="-1">
|
||||
Question x.
|
||||
</h4>
|
||||
|
Loading…
Reference in New Issue
Block a user