Show time taken per question on review page (resolves #8)
This commit is contained in:
parent
6c1040013f
commit
abd13de356
40
web/quiz.js
40
web/quiz.js
|
@ -44,17 +44,19 @@ function resetSubmitButton() {
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function formatTime(seconds) {
|
||||||
|
return (seconds > 60)
|
||||||
|
? Math.floor(seconds / 60) + ':' + (('0' + (seconds % 60)).slice(-2))
|
||||||
|
: seconds + 's'
|
||||||
|
}
|
||||||
|
|
||||||
function updateSubmitTimer() {
|
function updateSubmitTimer() {
|
||||||
|
|
||||||
var button = document.getElementById('quizSubmitButton')
|
var button = document.getElementById('quizSubmitButton')
|
||||||
|
|
||||||
if (state.submitTimer > 0) {
|
if (state.submitTimer > 0) {
|
||||||
|
|
||||||
timetext = state.submitTimer > 60 ?
|
button.value = 'Wait ' + formatTime(state.submitTimer)
|
||||||
Math.floor(state.submitTimer/60)+':'+(('0' + (state.submitTimer%60)).slice(-2)) :
|
|
||||||
state.submitTimer + 's'
|
|
||||||
|
|
||||||
button.value = 'Wait ' + timetext
|
|
||||||
button.disabled = true
|
button.disabled = true
|
||||||
state.submitTimer -= 1
|
state.submitTimer -= 1
|
||||||
|
|
||||||
|
@ -103,6 +105,11 @@ function showSequentialQuestion() {
|
||||||
|
|
||||||
function nextQuestion() {
|
function nextQuestion() {
|
||||||
|
|
||||||
|
// Save time taken
|
||||||
|
state.questions[state.currentQuestion].timeTaken = state.totalTimer - state.questionStartTotalTimer
|
||||||
|
|
||||||
|
state.questionStartTotalTimer = state.totalTimer
|
||||||
|
|
||||||
state.currentQuestion++
|
state.currentQuestion++
|
||||||
|
|
||||||
if (state.currentQuestion == state.questions.length)
|
if (state.currentQuestion == state.questions.length)
|
||||||
|
@ -177,7 +184,7 @@ function startQuiz() {
|
||||||
changeView('quiz')
|
changeView('quiz')
|
||||||
|
|
||||||
if (getRule('sequential'))
|
if (getRule('sequential'))
|
||||||
showSequentialQuestion(state.currentQuestion)
|
showSequentialQuestion()
|
||||||
|
|
||||||
if (state.submitTimer > 0)
|
if (state.submitTimer > 0)
|
||||||
startSubmitTimer(state.submitTimer)
|
startSubmitTimer(state.submitTimer)
|
||||||
|
@ -197,14 +204,15 @@ function reStartQuiz() {
|
||||||
|
|
||||||
console.log('Restarting quiz');
|
console.log('Restarting quiz');
|
||||||
|
|
||||||
state.responses = defaultState.responses
|
state.responses = defaultState.responses
|
||||||
state.currentQuestion = defaultState.currentQuestion
|
state.currentQuestion = defaultState.currentQuestion
|
||||||
state.success = defaultState.success
|
state.success = defaultState.success
|
||||||
state.submitTry = defaultState.submitTry
|
state.submitTry = defaultState.submitTry
|
||||||
state.submitTimer = defaultState.submitTimer
|
state.submitTimer = defaultState.submitTimer
|
||||||
state.submitInterval = defaultState.submitInterval
|
state.submitInterval = defaultState.submitInterval
|
||||||
state.totalTimer = defaultState.totalTimer
|
state.questionStartTotalTimer = defaultState.questionStartTotalTimer
|
||||||
state.totalInterval = defaultState.totalInterval
|
state.totalTimer = defaultState.totalTimer
|
||||||
|
state.totalInterval = defaultState.totalInterval
|
||||||
|
|
||||||
changeView('prescreen')
|
changeView('prescreen')
|
||||||
|
|
||||||
|
@ -310,6 +318,10 @@ function showQuizResults() {
|
||||||
<p>${q.explanation || '[No explanation provided]'}</p>`
|
<p>${q.explanation || '[No explanation provided]'}</p>`
|
||||||
el.appendChild(meta)
|
el.appendChild(meta)
|
||||||
|
|
||||||
|
var qinfo = (value.correct) ? '✅ Correct' : '❌ Incorrect'
|
||||||
|
if (q.timeTaken) qinfo += ('. Time taken: ' + formatTime(q.timeTaken))
|
||||||
|
el.querySelector('h3').innerHTML += ` <span class="meta">${qinfo}</span>`
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
document.querySelector('#quizSubmitButton').value = 'Back'
|
document.querySelector('#quizSubmitButton').value = 'Back'
|
||||||
|
|
|
@ -169,7 +169,7 @@ input[type="radio"]:hover + p, input[type="checkbox"]:hover + p {
|
||||||
|
|
||||||
.question .meta {
|
.question .meta {
|
||||||
background: #ddd;
|
background: #ddd;
|
||||||
padding: 16px;
|
padding: 12px;
|
||||||
border-radius: 4px;
|
border-radius: 4px;
|
||||||
font-size: 16px;
|
font-size: 16px;
|
||||||
}
|
}
|
||||||
|
|
|
@ -12,6 +12,7 @@ const defaultState = {
|
||||||
submitTime: null,
|
submitTime: null,
|
||||||
submitTimer: 0,
|
submitTimer: 0,
|
||||||
submitInterval: null,
|
submitInterval: null,
|
||||||
|
questionStartTotalTimer: 0,
|
||||||
totalTimer: 0,
|
totalTimer: 0,
|
||||||
totalInterval: null,
|
totalInterval: null,
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue