Finessing of client.

This commit is contained in:
2021-12-01 00:48:38 +00:00
parent 222b8e8a8b
commit ba47f79d44
2 changed files with 83 additions and 61 deletions

View File

@ -21,20 +21,23 @@ $("#btn-toggle-navigator").click(function(event){
if ($quiz_navigator.is(":hidden")) {
if ($quiz_settings.is(":visible")) {
toggle_settings = true;
$quiz_settings.hide();
$quiz_settings.fadeOut();
}
$quiz_render.hide();
$quiz_navigator.show();
$(".navigator-text").show();
$(".review-text").hide();
$quiz_render.fadeOut();
$quiz_navigator.fadeIn();
$(".navigator-text").fadeIn();
$(".review-text").fadeOut();
toggle_navigator = false;
$quiz_navigator.focus();
} else {
$quiz_navigator.hide();
$quiz_navigator.fadeOut();
if (toggle_settings) {
$quiz_settings.show();
$quiz_settings.fadeIn();
$quiz_settings.focus()
toggle_settings = false;
} else {
$quiz_render.show();
$quiz_render.fadeIn();
$question_title.focus();
}
}
event.preventDefault();
@ -44,27 +47,31 @@ $("#btn-toggle-settings").click(function(event){
if (($quiz_settings).is(":hidden")) {
if ($quiz_navigator.is(":visible")) {
toggle_navigator = true;
$quiz_navigator.hide();
$quiz_navigator.fadeOut();
}
$quiz_render.hide();
$quiz_settings.show();
$quiz_render.fadeOut();
$quiz_settings.fadeIn();
$quiz_settings.focus()
toggle_settings = false;
} else {
$quiz_settings.hide();
$quiz_settings.fadeOut();
if (toggle_navigator) {
$quiz_navigator.show();
$quiz_navigator.fadeIn();
toggle_navigator = false;
$quiz_navigator.focus();
} else {
$quiz_render.show();
$quiz_render.fadeIn();
$question_title.focus();
}
}
event.preventDefault();
});
$(".btn-quiz-return").click(function(event){
$quiz_navigator.hide();
$quiz_settings.hide();
$quiz_render.show();
$quiz_navigator.fadeOut();
$quiz_settings.fadeOut();
$quiz_render.fadeIn();
$question_title.focus();
toggle_settings = false;
toggle_navigator = false;
event.preventDefault();
@ -78,8 +85,9 @@ $("#navigator-container").on("click", ".q-navigator-button", function(event){
check_answered();
update_navigator();
current_question = parseInt($(this).attr("name"));
$quiz_render.show();
$quiz_navigator.hide();
$quiz_render.fadeIn();
$question_title.focus();
$quiz_navigator.fadeOut();
toggle_navigator = false;
toggle_settings = false;
render_question();
@ -100,8 +108,8 @@ $(".q-question-nav").click(function(event){
}
} else if ($(this).hasClass("q-navigator-button")) {
current_question = $(this).attr("name");
$quiz_render.show();
$quiz_navigator.hide();
$quiz_render.fadeIn();
$quiz_navigator.fadeOut();
toggle_navigator = false;
toggle_settings = false;
}
@ -126,12 +134,6 @@ $("#q-nav-flag").click(function(event){
});
$("#btn-start-quiz").click(function(event){
$(this).hide();
$(".btn-quiz-return").show();
$(".quiz-console").show();
$("#quiz-settings").hide();
$("#quiz-navigator").hide();
$(".quiz-start-text").hide();
$.ajax({
url: `/api/questions/`,
@ -139,6 +141,12 @@ $("#btn-start-quiz").click(function(event){
data: JSON.stringify({'_id': _id}),
contentType: "application/json",
success: function(response) {
$(this).fadeOut();
$(".btn-quiz-return").fadeIn();
$(".quiz-console").fadeIn();
$("#quiz-settings").fadeOut();
$("#quiz-navigator").fadeOut();
$(".quiz-start-text").fadeOut();
time_limit = response.time_limit;
start_time = response.start_time;
questions = response.questions;
@ -149,15 +157,32 @@ $("#btn-start-quiz").click(function(event){
render_question();
build_navigator();
check_flag();
if (time_limit != 'null') {
if (time_limit != 'null' && time_limit != null) {
$("#q-timer-widget").fadeIn();
time_remaining = get_time_remaining();
clock = setInterval(timer, 1000);
} else {
$("#q-timer-widget").hide();
}
},
error: function(response) {
console.log(response);
if (typeof response.responseJSON.error === 'string' || response.responseJSON.error instanceof String) {
alert.innerHTML = alert.innerHTML + `
<div class="alert alert-danger alert-dismissible fade show" role="alert">
<i class="bi bi-exclamation-triangle-fill" title="Danger"></i>
${response.responseJSON.error}
<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
</div>
`;
} else if (response.responseJSON.error instanceof Array) {
for (var i = 0; i < response.responseJSON.error.length; i ++) {
alert.innerHTML = alert.innerHTML + `
<div class="alert alert-danger alert-dismissible fade show" role="alert">
<i class="bi bi-exclamation-triangle-fill" title="Danger"></i>
${response.responseJSON.error[i]}
<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
</div>
`;
}
}
}
});
@ -177,20 +202,21 @@ $("#q-review-answers").click(function(event){
if ($quiz_navigator.is(":hidden")) {
if ($quiz_settings.is(":visible")) {
toggle_settings = true;
$quiz_settings.hide();
$quiz_settings.fadeOut();
}
$quiz_render.hide();
$quiz_navigator.show();
$(".navigator-text").hide();
$(".review-text").show();
$quiz_render.fadeOut();
$quiz_navigator.fadeIn();
$(".navigator-text").fadeOut();
$(".review-text").fadeIn();
toggle_navigator = false;
$quiz_navigator.focus();
} else {
$quiz_navigator.hide();
$quiz_navigator.fadeOut();
if (toggle_settings) {
$quiz_settings.show();
$quiz_settings.fadeIn();
toggle_settings = false;
} else {
$quiz_render.show();
$quiz_render.fadeIn();
}
}
event.preventDefault();
@ -460,12 +486,12 @@ function update_navigator() {
}
function start() {
$("#btn-start-quiz").hide();
$(".btn-quiz-return").show();
$(".quiz-console").show();
$("#quiz-settings").hide();
$("#quiz-navigator").hide();
$(".quiz-start-text").hide();
$("#btn-start-quiz").fadeOut();
$(".btn-quiz-return").fadeIn();
$(".quiz-console").fadeIn();
$("#quiz-settings").fadeOut();
$("#quiz-navigator").fadeOut();
$(".quiz-start-text").fadeOut();
questions = JSON.parse(window.localStorage.getItem('questions'));
total_questions = questions.length;
@ -485,11 +511,10 @@ function start() {
render_question();
build_navigator();
check_flag();
if (time_limit != 'null') {
if (time_limit != 'null' && time_limit != null) {
$("#q-timer-widget").fadeIn();
time_remaining = get_time_remaining();
clock = setInterval(timer, 1000);
} else {
$("#q-timer-widget").hide();
}
}
@ -540,9 +565,9 @@ function timer() {
}
function stop() {
$quiz_render.hide();
$quiz_navigator.hide();
$quiz_timeout.show();
$quiz_render.fadeOut();
$quiz_navigator.fadeOut();
$quiz_timeout.fadeIn();
$("#btn-toggle-navigator").addClass('disabled');
$("#btn-toggle-settings").addClass('disabled')
}
@ -582,7 +607,4 @@ const $question_options = $("#quiz-question-options");
// Execution on Load
apply_settings(display_settings);
check_started();
// TODO Timeout Function
// TODO Send data to server
check_started();