From 29b14d84f58682e9c5409b2d06b4bb5ae257ae30 Mon Sep 17 00:00:00 2001 From: ZerataX Date: Tue, 12 May 2020 18:59:10 +0200 Subject: [PATCH 1/2] temporarily save stats in cookie this allows us to easily switch between languages and even go back multiple questions --- i18n.js | 2 +- quiz.html | 85 +------------------------------ quiz.js | 148 ++++++++++++++++++++++++++++++++++++++++++++++++++++++ 3 files changed, 150 insertions(+), 85 deletions(-) create mode 100644 quiz.js diff --git a/i18n.js b/i18n.js index d39a8ce..aac0384 100644 --- a/i18n.js +++ b/i18n.js @@ -4,7 +4,7 @@ function getCookie (name) { const parts = value.split('; ' + name + '=') if (parts.length === 2) return parts.pop().split(';').shift() } -function setCookie (cname, cvalue, exhours) { +function setCookie (cname, cvalue, exhours = 1) { const d = new Date() d.setTime(Date.now() + (exhours * 60 * 60 * 1000)) const expires = 'expires=' + d.toUTCString() diff --git a/quiz.html b/quiz.html index 4ce6cd9..54897a3 100644 --- a/quiz.html +++ b/quiz.html @@ -49,90 +49,7 @@

Loa - + \ No newline at end of file diff --git a/quiz.js b/quiz.js new file mode 100644 index 0000000..1b89570 --- /dev/null +++ b/quiz.js @@ -0,0 +1,148 @@ +/* global i18n, loadTranslation, questions, setCookie, getCookie */ +let maxA, maxB, maxC, maxD, maxE, maxF, maxG // Max possible scores +maxA = maxB = maxC = maxD = maxE = maxF = maxG = 0 + +const cookie = { + questionsAnswered: [], + questionNumber: 0, + a: 0, + b: 0, + c: 0, + d: 0, + e: 0, + f: 0, + g: 0 +} + +function saveStats (answer) { + if (answer !== null) { + cookie.questionsAnswered.push({ + questionNumber: cookie.questionNumber, + answer + }) + } + setCookie('questionsAnswered', JSON.stringify(cookie.questionsAnswered)) + setCookie('questionNumber', cookie.questionNumber) + setCookie('a', cookie.a) + setCookie('b', cookie.b) + setCookie('c', cookie.c) + setCookie('d', cookie.d) + setCookie('e', cookie.e) + setCookie('f', cookie.f) + setCookie('g', cookie.g) +} + +function loadStats () { + if (getCookie('questionsAnswered')) { + cookie.questionsAnswered = JSON.parse(getCookie('questionsAnswered')) + cookie.questionNumber = parseInt(getCookie('questionNumber')) || 0 + cookie.a = parseInt(getCookie('a')) || 0 + cookie.b = parseInt(getCookie('b')) || 0 + cookie.c = parseInt(getCookie('c')) || 0 + cookie.d = parseInt(getCookie('d')) || 0 + cookie.e = parseInt(getCookie('e')) || 0 + cookie.f = parseInt(getCookie('f')) || 0 + cookie.g = parseInt(getCookie('g')) || 0 + } +} + +function getLastAnswer (questionNumber) { + return cookie.questionsAnswered.find(answer => answer.questionNumber === questionNumber) +} + +function initQuestion () { + loadStats() + console.log(cookie) + document.getElementById('question-text').innerHTML = i18n.getString(`question_${cookie.questionNumber}`) + document.getElementById('question-number').innerHTML = i18n.getString('quiz_question_of', { + count: cookie.questionNumber + 1, + total: Object.size(questions) + }) + if (cookie.questionNumber >= Object.size(questions)) { + // reset cookie + cookie.questionsAnswered = [] + cookie.questionNumber = 0 + cookie.a = 0 + cookie.b = 0 + cookie.c = 0 + cookie.d = 0 + cookie.e = 0 + cookie.f = 0 + cookie.g = 0 + saveStats() + window.location.reload() + } + if (getLastAnswer(cookie.questionNumber - 1) == null) { + document.getElementById('back_button').style.display = 'none' + document.getElementById('back_button_off').style.display = 'block' + } else { + document.getElementById('back_button').style.display = 'block' + document.getElementById('back_button_off').style.display = 'none' + } +} + +function calculateStat (answer) { + cookie.a += answer * questions[`question_${cookie.questionNumber}`].a + cookie.b += answer * questions[`question_${cookie.questionNumber}`].b + cookie.c += answer * questions[`question_${cookie.questionNumber}`].c + cookie.d += answer * questions[`question_${cookie.questionNumber}`].d + cookie.e += answer * questions[`question_${cookie.questionNumber}`].e + cookie.f += answer * questions[`question_${cookie.questionNumber}`].f + cookie.g += answer * questions[`question_${cookie.questionNumber}`].g +} + +function calculateScore (score, max) { + return (100 * (max + score) / (2 * max)).toFixed(1) +} + +function nextQuestion (answer) { // eslint-disable-line no-unused-vars + calculateStat(answer) + cookie.questionNumber++ + saveStats(answer) + + if (cookie.questionNumber < Object.size(questions)) { + initQuestion() + } else { + results() + } +} + +function prevQuestion () { // eslint-disable-line no-unused-vars + const previousAnswer = getLastAnswer(cookie.questionNumber - 1) + if (previousAnswer === null) { + return + } + cookie.questionsAnswered = cookie.questionsAnswered.filter(answer => { + if (answer.questionNumber !== cookie.questionNumber) { + return answer + } + }) + cookie.questionNumber-- + + calculateStat(previousAnswer) + saveStats(previousAnswer) + initQuestion() +} + +function results () { + window.location.href = 'results.html' + + `?a=${calculateScore(cookie.a, maxA)}` + + `&b=${calculateScore(cookie.b, maxB)}` + + `&c=${calculateScore(cookie.c, maxC)}` + + `&d=${calculateScore(cookie.d, maxD)}` + + `&e=${calculateScore(cookie.e, maxE)}` + + `&f=${calculateScore(cookie.f, maxF)}` + + `&g=${calculateScore(cookie.g, maxG)}` +} +loadTranslation().then(() => { + initQuestion() + for (let i = 0; i < Object.size(questions); i++) { + maxA += Math.abs(questions[`question_${i}`].a) + maxB += Math.abs(questions[`question_${i}`].b) + maxC += Math.abs(questions[`question_${i}`].c) + maxD += Math.abs(questions[`question_${i}`].d) + maxE += Math.abs(questions[`question_${i}`].e) + maxF += Math.abs(questions[`question_${i}`].f) + maxG += Math.abs(questions[`question_${i}`].g) + } +}) From 7a46d2d86dbe77bdf0c23fb681f3dd6bb3f7e181 Mon Sep 17 00:00:00 2001 From: ZerataX Date: Tue, 12 May 2020 19:05:56 +0200 Subject: [PATCH 2/2] reset stats after reaching results page --- quiz.js | 30 +++++++++++++++++------------- 1 file changed, 17 insertions(+), 13 deletions(-) diff --git a/quiz.js b/quiz.js index 1b89570..aa64a95 100644 --- a/quiz.js +++ b/quiz.js @@ -15,7 +15,7 @@ const cookie = { } function saveStats (answer) { - if (answer !== null) { + if (answer !== false) { cookie.questionsAnswered.push({ questionNumber: cookie.questionNumber, answer @@ -46,6 +46,20 @@ function loadStats () { } } +function resetStats () { + cookie.questionsAnswered = [] + cookie.questionNumber = 0 + cookie.a = 0 + cookie.b = 0 + cookie.c = 0 + cookie.d = 0 + cookie.e = 0 + cookie.f = 0 + cookie.g = 0 + saveStats(false) + window.location.reload() +} + function getLastAnswer (questionNumber) { return cookie.questionsAnswered.find(answer => answer.questionNumber === questionNumber) } @@ -59,18 +73,7 @@ function initQuestion () { total: Object.size(questions) }) if (cookie.questionNumber >= Object.size(questions)) { - // reset cookie - cookie.questionsAnswered = [] - cookie.questionNumber = 0 - cookie.a = 0 - cookie.b = 0 - cookie.c = 0 - cookie.d = 0 - cookie.e = 0 - cookie.f = 0 - cookie.g = 0 - saveStats() - window.location.reload() + resetStats() } if (getLastAnswer(cookie.questionNumber - 1) == null) { document.getElementById('back_button').style.display = 'none' @@ -103,6 +106,7 @@ function nextQuestion (answer) { // eslint-disable-line no-unused-vars if (cookie.questionNumber < Object.size(questions)) { initQuestion() } else { + resetStats() results() } }