viveksantayana/ska-referee-test
1
0 Fork 0
Code Issues 1 Pull Requests Projects Releases 19 Wiki Activity

Restored static and template files

Browse Source
This commit is contained in:
viveksantayana committed 2022-06-15 11:43:04 +01:00
1 parent 1a7983052f
commit 62160beab2
57 files changed
+4085 -1
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

ref-test/app/quiz/static/css/quiz.css
+158
View File
@@ -0,0 +1,158 @@
/*! Generated by Font Squirrel (https://www.fontsquirrel.com) on November 23, 2021 */
@font-face {
font-family: 'opendyslexic3bold';
src: url('../fonts/opendyslexic3-bold-webfont.woff2') format('woff2'),
url('../fonts/opendyslexic3-bold-webfont.woff') format('woff');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'opendyslexic3regular';
src: url('../fonts/opendyslexic3-regular-webfont.woff2') format('woff2'),
url('../fonts/opendyslexic3-regular-webfont.woff') format('woff');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'opendyslexicmonoregular';
src: url('../fonts/opendyslexicmono-regular-webfont.woff2') format('woff2'),
url('../fonts/opendyslexicmono-regular-webfont.woff') format('woff');
font-weight: normal;
font-style: normal;
}
/* Class Definitions */
.form-quiz-configure {
width: 100%;
padding: 15px;
margin: auto;
}
.q-f-opendyslexic {
font-family: 'opendyslexic3bold';
}
.q-f-comicsans {
font-family: 'Comic Sans MS', 'Comic Sans';
}
.q-f-osdefault {
font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}
.q-f-verdana {
font-family: Verdana, sans-serif;
}
.q-f-tahoma {
font-family: Tahoma, sans-serif;
}
.q-f-arial {
font-family: Arial, Helvetica, sans-serif;
}
.q-f-12pt {
font-size: 12pt;
}
.q-f-14pt {
font-size: 14pt;
}
.q-f-16pt {
font-size: 16pt;
}
.q-f-18pt {
font-size: 18pt;
}
.q-settings-element {
margin-bottom: 2rem;
}
.q-bg-light-1 {
background-color: beige;
}
.q-bg-light-2 {
background-color: #EBE3E1;
}
#sample-question {
margin: 2rem auto;
padding: 2rem;
}
.question-container {
margin: 2rem auto;
padding: 2 rem;
}
.question-title {
margin: 2rem 0;
}
.question-header {
margin: 1rem auto 3rem;
width: 90%;
}
.btn-quiz-control {
width: fit-content;
}
#q-topbar a.btn {
padding: 2px 6px 0px 6px;
font-size: 14pt;
height: fit-content;
width: fit-content;
margin: 0px 4px;
}
.q-timer {
padding-top: 0px;
margin: 0px auto;
font-size: 16pt;
}
.q-navigator-button {
margin: 5px;
}
.control-button-container {
width: fit-content;
margin: 2rem auto;
}
.control-button-container a {
width: fit-content;
margin: 0 5px;
}
.navigator-help {
margin: 4rem auto;
}
#navigator-container {
margin-bottom: 2rem;
}
/* Layout for Mobile Devices */
@media only screen and (max-width: 576px) {
body {
padding-top: 140px;
}
.navbar .container {
justify-content: space-evenly;
}
}
ref-test/app/quiz/static/css/style.css
+218
View File
@@ -0,0 +1,218 @@
body {
padding: 80px 0;
line-height: 1.5;
font-size: 14pt;
}
#cookie-alert {
padding-right: 16px;
}
#dismiss-cookie-alert {
margin-top: 16px;
width: fit-content;
}
.button-container {
margin: 2rem auto;
width: fit-content;
}
.instruction-container {
margin: 2rem auto;
}
.site-footer {
background-color: lightgray;
font-size: small;
}
.site-footer p {
margin: 0;
}
.quiz-container {
max-width: 720px;
}
.form-container {
display: -ms-flexbox;
display: flex;
-ms-flex-align: center;
align-items: center;
padding-top: 40px;
padding-bottom: 40px;
}
.form-quiz-start {
width: 100%;
max-width: 420px;
padding: 15px;
margin: auto;
}
.form-heading {
margin-bottom: 2rem;
}
.form-label-group {
position: relative;
margin-bottom: 2rem;
}
.form-label-group input,
.form-label-group label {
padding: var(--input-padding-y) var(--input-padding-x);
font-size: 16pt;
}
.form-label-group label {
position: absolute;
top: 0;
left: 0;
display: block;
width: 100%;
margin-bottom: 0; /* Override default `<label>` margin */
line-height: 1.5;
color: #495057;
cursor: text; /* Match the input under the label */
border: 1px solid transparent;
border-radius: .25rem;
transition: all .1s ease-in-out;
z-index: -1;
}
.form-label-group input {
background-color: transparent;
border: none;
border-radius: 0%;
border-bottom: 2px solid #585858;
}
.form-label-group input:active, .form-label-group input:focus {
background-color: transparent;
}
.form-label-group input::-webkit-input-placeholder {
color: transparent;
}
.form-label-group input:-ms-input-placeholder {
color: transparent;
}
.form-label-group input::-ms-input-placeholder {
color: transparent;
}
.form-label-group input::-moz-placeholder {
color: transparent;
}
.form-label-group input::placeholder {
color: transparent;
}
.form-label-group input:not(:placeholder-shown) {
padding-top: calc(var(--input-padding-y) + var(--input-padding-y) * (2 / 3));
padding-bottom: calc(var(--input-padding-y) / 3);
}
.form-label-group input:not(:placeholder-shown) ~ label {
padding-top: calc(var(--input-padding-y) / 3);
padding-bottom: calc(var(--input-padding-y) / 3);
font-size: 12px;
color: #777;
}
.form-check-margin {
margin-bottom: 2rem;
}
.checkbox input {
transform: scale(1.5);
margin-right: 1rem;
}
.signin-forgot-password {
font-size: 14pt;
}
.form-submission-button {
margin-bottom: 2rem;
}
.form-submission-button button, .form-submission-button a {
margin: 1rem;
vertical-align: middle;
}
.form-submission-button button span, .form-submission-button button svg, .form-submission-button a span, .form-submission-button a svg {
margin: 0 2px;
}
.results-name {
margin: 3rem auto;
}
.results-name .surname {
font-variant: small-caps;
font-size: 24pt;
}
.results-score {
margin: 2rem auto;
width: fit-content;
font-size: 36pt;
}
.results-score::after {
content: '%';
}
.results-grade {
margin: 2rem auto;
width: fit-content;
font-size: 26pt;
}
.button-icon {
font-size: 20px;
margin-right: 2px;
}
/* Change Autocomplete styles in Chrome*/
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
transition: background-color 5000s ease-in-out 0s;
}
/* Fallback for Edge
-------------------------------------------------- */
@supports (-ms-ime-align: auto) {
.form-label-group label {
display: none;
}
.form-label-group input::-ms-input-placeholder {
color: #777;
}
}
/* Fallback for IE
-------------------------------------------------- */
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
.form-label-group label {
display: none;
}
.form-label-group input:-ms-input-placeholder {
color: #777;
}
}
ref-test/app/quiz/static/favicon.ico
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 15 KiB

ref-test/app/quiz/static/favicon.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 84 KiB

ref-test/app/quiz/static/fonts/opendyslexic3-bold-webfont.woff
BIN
View File
Binary file not shown.
ref-test/app/quiz/static/fonts/opendyslexic3-bold-webfont.woff2
BIN
View File
Binary file not shown.
ref-test/app/quiz/static/fonts/opendyslexic3-regular-webfont.woff
BIN
View File
Binary file not shown.
ref-test/app/quiz/static/fonts/opendyslexic3-regular-webfont.woff2
BIN
View File
Binary file not shown.
ref-test/app/quiz/static/fonts/opendyslexicmono-regular-webfont.woff
BIN
View File
Binary file not shown.
ref-test/app/quiz/static/fonts/opendyslexicmono-regular-webfont.woff2
BIN
View File
Binary file not shown.
ref-test/app/quiz/static/fonts/stylesheet.css
View File
Whitespace-only changes.
ref-test/app/quiz/static/js/jquery-3.6.0.min.js
Vendored
+2
View File
@@ -0,0 +1,2 @@
/*! jQuery v3.6.0 | (c) OpenJS Foundation and other contributors | jquery.org/license */
!function(e,t){"use strict";"object"==typeof module&&"object"==typeof module.exports?module.exports=e.document?t(e,!0):function(e){if(!e.document)throw new Error("jQuery requires a window with a document");return t(e)}:t(e)}("undefined"!=typeof window?window:this,function(C,e){"use strict";var t=[],r=Object.getPrototypeOf,s=t.slice,g=t.flat?function(e){return t.flat.call(e)}:function(e){return t.concat.apply([],e)},u=t.push,i=t.indexOf,n={},o=n.toString,v=n.hasOwnProperty,a=v.toString,l=a.call(Object),y={},m=function(e){return"function"==typeof e&&"number"!=typeof e.nodeType&&"function"!=typeof e.item},x=function(e){return null!=e&&e===e.window},E=C.document,c={type:!0,src:!0,nonce:!0,noModule:!0};function b(e,t,n){var r,i,o=(n=n||E).createElement("script");if(o.text=e,t)for(r in c)(i=t[r]||t.getAttribute&&t.getAttribute(r))&&o.setAttribute(r,i);n.head.appendChild(o).parentNode.removeChild(o)}function w(e){return null==e?e+"":"object"==typeof e||"function"==typeof e?n[o.call(e)]||"object":typeof e}var f="3.6.0",S=function(e,t){return new S.fn.init(e,t)};function p(e){var t=!!e&&"length"in e&&e.length,n=w(e);return!m(e)&&!x(e)&&("array"===n||0===t||"number"==typeof t&&0<t&&t-1 in e)}S.fn=S.prototype={jquery:f,constructor:S,length:0,toArray:function(){return s.call(this)},get:function(e){return null==e?s.call(this):e<0?this[e+this.length]:this[e]},pushStack:function(e){var t=S.merge(this.constructor(),e);return t.prevObject=this,t},each:function(e){return S.each(this,e)},map:function(n){return this.pushStack(S.map(this,function(e,t){return n.call(e,t,e)}))},slice:function(){return this.pushStack(s.apply(this,arguments))},first:function(){return this.eq(0)},last:function(){return this.eq(-1)},even:function(){return this.pushStack(S.grep(this,function(e,t){return(t+1)%2}))},odd:function(){return this.pushStack(S.grep(this,function(e,t){return t%2}))},eq:function(e){var t=this.length,n=+e+(e<0?t:0);return this.pushStack(0<=n&&n<t?[this[n]]:[])},end:function(){return this.prevObject||this.constructor()},push:u,sort:t.sort,splice:t.splice},S.extend=S.fn.extend=function(){var e,t,n,r,i,o,a=arguments[0]||{},s=1,u=arguments.length,l=!1;for("boolean"==typeof a&&(l=a,a=arguments[s]||{},s++),"object"==typeof a||m(a)||(a={}),s===u&&(a=this,s--);s<u;s++)if(null!=(e=arguments[s]))for(t in e)r=e[t],"__proto__"!==t&&a!==r&&(l&&r&&(S.isPlainObject(r)||(i=Array.isArray(r)))?(n=a[t],o=i&&!Array.isArray(n)?[]:i||S.isPlainObject(n)?n:{},i=!1,a[t]=S.extend(l,o,r)):void 0!==r&&(a[t]=r));return a},S.extend({expando:"jQuery"+(f+Math.random()).replace(/\D/g,""),isReady:!0,error:function(e){throw new Error(e)},noop:function(){},isPlainObject:function(e){var t,n;return!(!e||"[object Object]"!==o.call(e))&&(!(t=r(e))||"function"==typeof(n=v.call(t,"constructor")&&t.constructor)&&a.call(n)===l)},isEmptyObject:function(e){var t;for(t in e)return!1;return!0},globalEval:function(e,t,n){b(e,{nonce:t&&t.nonce},n)},each:function(e,t){var n,r=0;if(p(e)){for(n=e.length;r<n;r++)if(!1===t.call(e[r],r,e[r]))break}else for(r in e)if(!1===t.call(e[r],r,e[r]))break;return e},makeArray:function(e,t){var n=t||[];return null!=e&&(p(Object(e))?S.merge(n,"string"==typeof e?[e]:e):u.call(n,e)),n},inArray:function(e,t,n){return null==t?-1:i.call(t,e,n)},merge:function(e,t){for(var n=+t.length,r=0,i=e.length;r<n;r++)e[i++]=t[r];return e.length=i,e},grep:function(e,t,n){for(var r=[],i=0,o=e.length,a=!n;i<o;i++)!t(e[i],i)!==a&&r.push(e[i]);return r},map:function(e,t,n){var r,i,o=0,a=[];if(p(e))for(r=e.length;o<r;o++)null!=(i=t(e[o],o,n))&&a.push(i);else for(o in e)null!=(i=t(e[o],o,n))&&a.push(i);return g(a)},guid:1,support:y}),"function"==typeof Symbol&&(S.fn[Symbol.iterator]=t[Symbol.iterator]),S.each("Boolean Number String Function Array Date RegExp Object Error Symbol".split(" "),function(e,t){n["[object "+t+"]"]=t.toLowerCase()});var d=function(n){var e,d,b,o,i,h,f,g,w,u,l,T,C,a,E,v,s,c,y,S="sizzle"+1*new Date,p=n.document,k=0,r=0,m=ue(),x=ue(),A=ue(),N=ue(),j=function(e,t){return e===t&&(l=!0),0},D={}.hasOwnProperty,t=[],q=t.pop,L=t.push,H=t.push,O=t.slice,P=function(e,t){for(var n=0,r=e.length;n<r;n++)if(e[n]===t)return n;return-1},R="checked|selected|async|autofocus|autoplay|controls|defer|disabled|hidden|ismap|loop|multiple|open|readonly|required|scoped",M="[\\x20\\t\\r\\n\\f]",I="(?:\\\\[\\da-fA-F]{1,6}"+M+"?|\\\\[^\\r\\n\\f]|[\\w-]|[^\0-\\x7f])+",W="\\["+M+"*("+I+")(?:"+M+"*([*^$|!~]?=)"+M+"*(?:'((?:\\\\.|[^\\\\'])*)'|\"((?:\\\\.|[^\\\\\"])*)\"|("+I+"))|)"+M+"*\\]",F=":("+I+")(?:\\((('((?:\\\\.|[^\\\\'])*)'|\"((?:\\\\.|[^\\\\\"])*)\")|((?:\\\\.|[^\\\\()[\\]]|"+W+")*)|.*)\\)|)",B=new RegExp(M+"+","g"),$=new RegExp("^"+M+"+|((?:^|[^\\\\])(?:\\\\.)*)"+M+"+$","g"),_=new RegExp("^"+M+"*,"+M+"*"),z=new RegExp("^"+M+"*([>+~]|"+M+")"+M+"*"),U=new RegExp(M+"|>"),X=new RegExp(F),V=new RegExp("^"+I+"$"),G={ID:new RegExp("^#("+I+")"),CLASS:new RegExp("^\\.("+I+")"),TAG:new RegExp("^("+I+"|[*])"),ATTR:new RegExp("^"+W),PSEUDO:new RegExp("^"+F),CHILD:new RegExp("^Line truncated
ref-test/app/quiz/static/js/quiz.js
+650
View File
@@ -0,0 +1,650 @@
// Bind Listeners
$("input[name='font-select']").change(function(){
let $choice = $(this).val();
set_font($choice);
});
$("input[name='font-size']").change(function(){
let $choice = $(this).val();
set_font_size($choice);
});
$("input[name='bg-select']").change(function(){
let $choice = $(this).val();
set_bg_colour($choice);
});
$(".bg-select-area").click(function(event){
$(this).find("input[name='bg-select']").prop("checked", true).change();
});
$("#btn-toggle-navigator").click(function(event){
check_answered();
update_navigator();
if ($quiz_navigator.is(":hidden")) {
if ($quiz_settings.is(":visible")) {
toggle_settings = true;
$quiz_settings.fadeOut();
}
$quiz_render.fadeOut();
$quiz_navigator.fadeIn();
$(".navigator-text").fadeIn();
$(".review-text").fadeOut();
toggle_navigator = false;
$(window).scrollTop(0);
} else {
$quiz_navigator.fadeOut();
if (toggle_settings) {
$quiz_settings.fadeIn();
$(window).scrollTop(0);
toggle_settings = false;
} else {
$quiz_render.fadeIn();
$(window).scrollTop(0);
}
}
event.preventDefault();
});
$("#btn-toggle-settings").click(function(event){
if (($quiz_settings).is(":hidden")) {
if ($quiz_navigator.is(":visible")) {
toggle_navigator = true;
$quiz_navigator.fadeOut();
}
$quiz_render.fadeOut();
$quiz_settings.fadeIn();
$(window).scrollTop(0);
toggle_settings = false;
} else {
$quiz_settings.fadeOut();
if (toggle_navigator) {
$quiz_navigator.fadeIn();
toggle_navigator = false;
$(window).scrollTop(0);
} else {
$quiz_render.fadeIn();
$(window).scrollTop(0);
}
}
event.preventDefault();
});
$(".btn-quiz-return").click(function(event){
$quiz_navigator.fadeOut();
$quiz_settings.fadeOut();
$quiz_render.fadeIn();
$(window).scrollTop(0);
toggle_settings = false;
toggle_navigator = false;
event.preventDefault();
});
$(".btn-dummy").click(function(event){
event.preventDefault();
});
$("#navigator-container").on("click", ".q-navigator-button", function(event){
check_answered();
update_navigator();
current_question = parseInt($(this).prop("name"));
$quiz_navigator.fadeOut();
$quiz_render.fadeIn();
$question_title.focus();
$(window).scrollTop(0);
toggle_navigator = false;
toggle_settings = false;
render_question();
check_flag();
event.preventDefault();
});
$(".q-question-nav").click(function(event){
check_answered();
update_navigator();
if ($(this).prop("id") == "q-nav-next") {
if (current_question < questions.length) {
current_question ++;
}
} else if ($(this).prop("id") == "q-nav-prev") {
if (current_question > 0) {
current_question --;
}
} else if ($(this).hasClass("q-navigator-button")) {
current_question = $(this).prop("name");
$quiz_render.fadeIn();
$quiz_navigator.fadeOut();
toggle_navigator = false;
toggle_settings = false;
}
render_question();
check_flag();
event.preventDefault();
});
$("#q-nav-flag").click(function(event){
if (question_status[current_question] != 1) {
question_status[current_question] = 1;
$(this).removeClass().addClass("btn btn-warning");
$(this).prop("title", "Question Flagged for revision. Click to un-flag.");
} else {
question_status[current_question] = 0;
$(this).removeClass().addClass("btn btn-secondary");
$(this).prop("title", "Question Un-Flagged. Click to flag for revision.");
}
window.localStorage.setItem('question_status', JSON.stringify(question_status));
update_navigator();
event.preventDefault();
});
$("#btn-start-quiz").click(function(event){
$.ajax({
url: `/api/questions/`,
type: 'POST',
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;
total_questions = questions.length;
window.localStorage.setItem('questions', JSON.stringify(questions));
window.localStorage.setItem('start_time', JSON.stringify(start_time));
window.localStorage.setItem('time_limit', JSON.stringify(time_limit));
render_question();
build_navigator();
check_flag();
if (time_limit != 'null' && time_limit != null) {
$("#q-timer-widget").fadeIn();
time_remaining = get_time_remaining();
clock = setInterval(timer, 1000);
}
if (response.time_adjustment > 0) {
const $alert = $("#alert-box");
$alert.html(
`<div class="alert alert-primary alert-dismissible fade show" role="alert">
<i class="bi bi-exclamation-triangle-fill" title="Alert"></i>
User code validated. Extra time of ${response.time_adjustment} minutes added to the exam time limit.
<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
</div>
`
);
$alert.focus();
}
},
error: function(response) {
error_response(response);
}
});
event.preventDefault();
});
$("#quiz-question-options").on("change", ".quiz-option", function(event){
$name = parseInt($(this).prop("name"));
$value = $(this).prop("value");
answers[$name] = $value;
window.localStorage.setItem('answers', JSON.stringify(answers));
});
$("#q-review-answers").click(function(event){
check_answered();
update_navigator();
if ($quiz_navigator.is(":hidden")) {
if ($quiz_settings.is(":visible")) {
toggle_settings = true;
$quiz_settings.fadeOut();
}
$quiz_render.fadeOut();
$quiz_navigator.fadeIn();
$(".navigator-text").fadeOut();
$(".review-text").fadeIn();
toggle_navigator = false;
$(window).scrollTop(0);
} else {
$quiz_navigator.fadeOut();
if (toggle_settings) {
$quiz_settings.fadeIn();
toggle_settings = false;
} else {
$quiz_render.fadeIn();
}
}
event.preventDefault();
});
$(".quiz-button-submit").click(function(event){
let submission = {
'_id': _id,
'answers': answers
}
$.ajax({
url: `/api/submit/`,
type: 'POST',
data: JSON.stringify(submission),
contentType: "application/json",
success: function(response) {
window.localStorage.clear();
window.location.href = `/result/`;
},
error: function(response) {
error_response(response);
}
});
event.preventDefault();
});
// Functions
function set_font(value = 'osdefault') {
let font_styles = ['arial', 'comicsans', 'opendyslexic', 'tahoma', 'verdana']
for (let i = 0; i < font_styles.length; i ++) {
if (font_styles[i] != value) {
$("body").removeClass( `q-f-${font_styles[i]}` );
};
};
if (value != 'osdefault') {
$("body").addClass(`q-f-${value}`);
};
display_settings['font-select'] = value;
window.localStorage.setItem('display_settings', JSON.stringify(display_settings));
$('input[name="font-select"][value="' + value + '"]').prop('checked', true);
}
function set_font_size(value = '14pt') {
let font_sizes = ['12pt', '16pt', '18pt']
for (let i = 0; i < font_sizes.length; i ++) {
if (font_sizes[i] != value) {
$("body").removeClass( `q-f-${font_sizes[i]}` );
};
};
if (value != '14pt') {
$("body").addClass(`q-f-${value}`);
};
display_settings['font-size'] = value;
window.localStorage.setItem('display_settings', JSON.stringify(display_settings));
$('input[name="font-size"][value="' + value + '"]').prop('checked', true);
}
function set_bg_colour(value = 'bg-light') {
let backgrounds = ['bg-light', 'q-bg-light-1', 'q-bg-light-2', 'alert-primary', 'alert-secondary', 'alert-dark', 'bg-dark']
for (let i = 0; i < backgrounds.length; i ++) {
if (backgrounds[i] != value) {
$("body").removeClass(backgrounds[i]);
if (backgrounds[i] == 'bg-dark') {
$("body").removeClass('text-light');
};
if (backgrounds[i] == 'alert-primary' || backgrounds[i] == 'alert-secondary' || backgrounds[i] == 'alert-dark') {
$("body").removeClass('text-dark');
};
};
};
$("body").addClass(value);
if (value == 'bg-dark') {
$("body").addClass('text-light');
};
if (value == 'alert-primary' || value == 'alert-secondary' || value == 'alert-dark') {
$("body").addClass('text-dark');
};
display_settings['bg-select'] = value;
window.localStorage.setItem('display_settings', JSON.stringify(display_settings));
$('input[name="bg-select"][value="' + value + '"]').prop('checked', true);
}
function get_settings_from_storage() {
let display_settings = window.localStorage.getItem('display_settings')
if (display_settings != null) {
return JSON.parse(display_settings);
};
return {
'font-select': 'osdefault',
'font-size': '14pt',
'bg-select': 'bg-light'
}
}
function apply_settings(settings) {
set_font(settings['font-select']);
set_font_size(settings['font-size']);
set_bg_colour(settings['bg-select']);
}
function render_question() {
if (current_question == 0) {
$nav_prev.addClass('disabled');
}
if (current_question == questions.length - 1) {
$nav_next.addClass('disabled');
}
if ($nav_prev.hasClass('disabled') && current_question > 0) {
$nav_prev.removeClass('disabled');
}
if ($nav_next.hasClass('disabled') && current_question < questions.length - 1) {
$nav_next.removeClass('disabled');
}
var question = questions[current_question];
let header_text = question.question_header;
var block_length = 0;
if ('block_length' in question) {
block_length = question['block_length'];
};
var block_q_no = 0;
if ('block_q_no' in question) {
block_q_no = question['block_q_no'];
}
let remaining_qs = (block_length - block_q_no).toString();
if (block_length - block_q_no > 1) {
remaining_qs += ' questions';
} else {
remaining_qs += ' question';
}
header_text = header_text.replace('<block_remaining_questions>', remaining_qs);
$question_header.html(header_text);
$question_text.html(question.text);
$question_title.html(`Question ${current_question + 1} of ${ questions.length }.`);
var q_no = question['q_no'];
var options = question.options;
var options_output = '';
for (let i = 0; i < options.length; i ++) {
var add_checked = ''
if (q_no in answers) {
if (answers[q_no] == options[i][0]) {
add_checked = 'checked';
}
}
options_output += `<div class="form-check">
<input type="radio" class="form-check-input quiz-option" id="q${current_question}-${i}" name="${q_no}" value="${options[i][0]}" ${add_checked}>
<label for="q${current_question}-${i}" class="form-check-label">${options[i][1]}</label>
</div>`;
}
$question_options.html(options_output);
let skipped = count_questions(-1);
let answered = count_questions(2);
let flagged = count_questions(1);
$progress_skipped.prop('title', `Skipped: ${skipped}`);
$progress_skipped.prop('aria-valuenow', skipped);
$progress_skipped.css('width', `${skipped}%`);
$skipped_count.text(`Skipped: ${skipped}`);
if (skipped < 1) {
$skipped_count.fadeOut()
} else {
$skipped_count.fadeIn()
}
$progress_flagged.prop('title', `Flagged: ${flagged}`);
$progress_flagged.prop('aria-valuenow', flagged);
$progress_flagged.css('width', `${flagged}%`);
$flagged_count.text(`Flagged: ${flagged}`);
if (flagged < 1) {
$flagged_count.fadeOut()
} else {
$flagged_count.fadeIn()
}
$progress_answered.prop('title', `Answered: ${answered}`);
$progress_answered.prop('aria-valuenow', answered);
$progress_answered.css('width', `${answered}%`);
$answered_count.text(`Answered: ${answered}`);
if (answered < 1) {
$answered_count.fadeOut()
} else {
$answered_count.fadeIn()
}
$question_title.focus();
$(window).scrollTop(0);
}
function check_answered() {
var question = questions[current_question];
var name = question.q_no;
if (question_status[current_question] == 0 || question_status[current_question] == -1) {
if (!$(`input[name='${name}']:checked`).val()) {
question_status[current_question] = -1;
} else {
question_status[current_question] = 2;
}
window.localStorage.setItem('question_status', JSON.stringify(question_status));
}
}
function check_flag() {
if (!(current_question in question_status)) {
question_status[current_question] = 0;
window.localStorage.setItem('question_status', JSON.stringify(question_status));
}
switch (question_status[current_question]) {
case -1:
$nav_flag.removeClass().addClass('btn btn-danger progress-bar-striped');
$nav_flag.prop("title", "Question Incomplete. Click to flag for revision.");
break;
case 1:
$nav_flag.removeClass().addClass('btn btn-warning');
$nav_flag.prop("title", "Question Flagged for revision. Click to un-flag.");
break;
case 2:
$nav_flag.removeClass().addClass('btn btn-success');
$nav_flag.prop("title", "Question Answered. Click to flag for revision.");
break;
default:
$nav_flag.removeClass().addClass('btn btn-secondary');
$nav_flag.prop("title", "Question Un-Flagged. Click to flag for revision.");
}
}
function build_navigator() {
$nav_container.html('')
var output = ''
for (let i = 0; i < questions.length; i ++) {
let add_class, add_href, add_status = '';
switch (question_status[i]) {
case -1:
add_class = 'btn-danger progress-bar-striped';
add_href = 'href="#"';
add_status = 'Incomplete';
break;
case 1:
add_class = 'btn-warning';
add_href = 'href="#"';
add_status = 'Flagged';
break;
case 2:
add_class = 'btn-success';
add_href = 'href="#"';
add_status = 'Answered';
break;
default:
add_class = 'btn-secondary disabled';
add_href = '';
add_status = 'Unseen';
}
output += `<a ${add_href} class="q-navigator-button btn ${add_class}" name=${i} title="Question ${i+1}: ${add_status}">Q${i + 1}</a>`;
}
$nav_container.html(output);
}
function update_navigator() {
let button = $(`.q-navigator-button[name=${current_question}]`)
if (current_question in question_status) {
switch (question_status[current_question]) {
case -1:
button.removeClass().addClass("q-navigator-button btn btn-danger progress-bar-striped");
button.prop("title", `Question ${current_question + 1}: Incomplete`);
break;
case 1:
button.removeClass().addClass("q-navigator-button btn btn-warning");
button.prop("title", `Question ${current_question + 1}: Flagged`);
break;
case 2:
button.removeClass().addClass("q-navigator-button btn btn-success");
button.prop("title", `Question ${current_question + 1}: Answered`);
break;
default:
button.removeClass().addClass("q-navigator-button btn btn-secondary disabled");
button.prop("title", `Question ${current_question + 1}: Unseen`);
}
}
}
function start() {
$("#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;
start_time = window.localStorage.getItem('start_time');
time_limit = window.localStorage.getItem('time_limit');
let get_answers = window.localStorage.getItem('answers');
if (get_answers != null) {
answers = JSON.parse(get_answers);
}
let get_status = window.localStorage.getItem('question_status');
if (get_status != null) {
question_status = JSON.parse(get_status);
}
render_question();
build_navigator();
check_flag();
if (time_limit != 'null' && time_limit != null) {
$("#q-timer-widget").fadeIn();
time_remaining = get_time_remaining();
clock = setInterval(timer, 1000);
}
}
function check_started() {
let questions = window.localStorage.getItem('questions');
let time_limit = window.localStorage.getItem('time_limit');
let start_time = window.localStorage.getItem('start_time')
if (questions != null && start_time != null && time_limit != null) {
start();
}
}
function get_time_remaining() {
var end_time = new Date(time_limit).getTime();
var _start_time = new Date().getTime();
return end_time - _start_time;
}
function timer() {
var hours = Math.floor((time_remaining % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
var minutes = Math.floor((time_remaining % (1000 * 60 * 60)) / (1000 * 60));
var seconds = Math.floor((time_remaining % (1000 * 60)) / 1000);
if (time_remaining > 0) {
var timer_display = '';
if (hours > 0) {
timer_display = `${hours.toString()}:`;
}
if (minutes > 0 || hours > 0) {
if (minutes < 10) {
timer_display += `0${minutes.toString()}:`;
} else {
timer_display += `${minutes.toString()}:`;
}
}
if (seconds < 10) {
timer_display += `0${seconds.toString()}`;
} else {
timer_display += seconds.toString();
}
$timer.html(timer_display);
time_remaining -= 1000
} else {
$timer.html('Expired');
clearInterval(clock);
stop()
}
}
function stop() {
$quiz_render.fadeOut();
$quiz_navigator.fadeOut();
$quiz_timeout.fadeIn();
$("#btn-toggle-navigator").addClass('disabled');
$("#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');
var current_question = 0;
var total_questions = 0;
var question_status = {};
var answers = {};
var questions = [];
var time_limit, start_time, time_remaining;
var display_settings = get_settings_from_storage();
const $quiz_settings = $("#quiz-settings");
const $quiz_navigator = $("#quiz-navigator");
const $quiz_render = $("#quiz-render");
const $quiz_timeout = $("#quiz-timeout");
const $nav_flag = $("#q-nav-flag");
const $nav_next = $("#q-nav-next");
const $nav_prev = $("#q-nav-prev");
const $nav_container = $("#navigator-container");
const $timer = $("#q-timer-display");
var clock
var toggle_settings = false;
var toggle_navigator = false;
const $question_title = $("#quiz-question-title");
const $question_header = $("#quiz-question-header");
const $question_text = $("#quiz-question-text");
const $question_options = $("#quiz-question-options");
const $progress_skipped = $("#skipped-bar");
const $progress_answered = $("#answered-bar");
const $progress_flagged = $("#flagged-bar");
const $skipped_count = $("#skipped-count");
const $answered_count = $("#answered-count");
const $flagged_count = $("#flagged-count");
// Execution on Load
apply_settings(display_settings);
check_started();
ref-test/app/quiz/static/js/script.js
+86
View File
@@ -0,0 +1,86 @@
$(document).ready(function() {
$("#od-font-test").click(function(){
$("body").css("font-family", "opendyslexic3regular")
});
$('.test-code-input').keyup(function() {
var input = $(this).val().split("-").join("").split("—").join("");
if (input.length > 0) {
input = input.match(new RegExp('.{1,4}', 'g')).join("—");
}
$(this).val(input);
});
});
$('form[name=form-quiz-start]').submit(function(event) {
var $form = $(this);
var data = $form.serialize();
$.ajax({
url: window.location.pathname,
type: 'POST',
data: data,
dataType: 'json',
success: function(response) {
var _id = response._id
window.localStorage.setItem('_id', _id);
window.location.href = `/test/`;
},
error: function(response) {
error_response(response);
}
});
event.preventDefault();
});
function error_response(response) {
const $alert = $("#alert-box");
$alert.html('');
if (typeof response.responseJSON.error === 'string' || response.responseJSON.error instanceof String) {
$alert.html(`
<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) {
var output = ''
for (var i = 0; i < response.responseJSON.error.length; i ++) {
output += `
<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>
`;
$alert.html(output);
}
}
}
// Dismiss Cookie Alert
$('#dismiss-cookie-alert').click(function(event){
$.ajax({
url: '/cookies/',
type: 'GET',
data: {
time: Date.now()
},
dataType: 'json',
success: function(response){
console.log(response);
},
error: function(response){
console.log(response);
}
})
event.preventDefault();
})