Refactor quiz timer to use milliseconds and include hostname in browser info

This commit is contained in:
2025-01-22 13:18:23 +02:00
parent 55da9b75c2
commit e9b7e0a8ef

View File

@@ -10,7 +10,7 @@ document.addEventListener('DOMContentLoaded', function () {
let currentQuestionIndex = 0; let currentQuestionIndex = 0;
let score = 0; let score = 0;
let quizResults = []; let quizResults = [];
let timeLeft = 25; let timeLeft = 25000; // 25 seconds in milliseconds
let timer; let timer;
let startTime = new Date().toISOString(); let startTime = new Date().toISOString();
@@ -28,7 +28,8 @@ document.addEventListener('DOMContentLoaded', function () {
const browserInfo = { const browserInfo = {
userAgent: navigator.userAgent, userAgent: navigator.userAgent,
screenResolution: `${window.screen.width}x${window.screen.height}`, screenResolution: `${window.screen.width}x${window.screen.height}`,
operatingSystem: navigator.platform operatingSystem: navigator.platform,
hostname: window.location.hostname // Store hostname
}; };
// Check if there is a completed quiz // Check if there is a completed quiz
@@ -61,8 +62,8 @@ document.addEventListener('DOMContentLoaded', function () {
// Complete timer reset // Complete timer reset
stopTimer(); stopTimer();
timeLeft = 25; timeLeft = 25000; // 25 seconds in milliseconds
timerDisplay.textContent = timeLeft; timerDisplay.textContent = (timeLeft / 1000).toFixed(1); // Display in seconds
const question = questions[currentQuestionIndex]; const question = questions[currentQuestionIndex];
const chartFile = `charts/${question.chart}-${version}.vl.json`; const chartFile = `charts/${question.chart}-${version}.vl.json`;
@@ -115,18 +116,18 @@ document.addEventListener('DOMContentLoaded', function () {
stopTimer(); stopTimer();
// Ensure display shows starting value // Ensure display shows starting value
timerDisplay.textContent = timeLeft; timerDisplay.textContent = (timeLeft / 1000).toFixed(1); // Display in seconds
timer = setInterval(() => { timer = setInterval(() => {
timeLeft--; timeLeft -= 100; // Decrease by 100 milliseconds
timerDisplay.textContent = timeLeft; timerDisplay.textContent = (timeLeft / 1000).toFixed(1); // Display in seconds
if (timeLeft <= 0) { if (timeLeft <= 0) {
stopTimer(); stopTimer();
alert("Time's up! Moving to the next question."); alert("Time's up! Moving to the next question.");
submitAnswer(true); submitAnswer(true);
} }
}, 1000); }, 100);
} }
function storeQuizProgress() { function storeQuizProgress() {
@@ -141,7 +142,7 @@ document.addEventListener('DOMContentLoaded', function () {
participantData: JSON.parse(localStorage.getItem('participantData') || '{}'), participantData: JSON.parse(localStorage.getItem('participantData') || '{}'),
startTime: startTime, // Store start time startTime: startTime, // Store start time
browserId: browserId, // Store browser ID browserId: browserId, // Store browser ID
browserInfo: browserInfo // Store browser info browserInfo: browserInfo // Store browser info including hostname
}; };
const allQuizzes = JSON.parse(localStorage.getItem('allQuizzes') || '{}'); const allQuizzes = JSON.parse(localStorage.getItem('allQuizzes') || '{}');
allQuizzes[quizId] = currentProgress; allQuizzes[quizId] = currentProgress;
@@ -172,7 +173,7 @@ document.addEventListener('DOMContentLoaded', function () {
isCorrect: isCorrect, isCorrect: isCorrect,
questionIndex: currentQuestionIndex, questionIndex: currentQuestionIndex,
timestamp: new Date().toISOString(), timestamp: new Date().toISOString(),
timeSpent: 25 - timeLeft, timeSpent: 25000 - timeLeft, // Time spent in milliseconds
chartType: currentQuestion.chart, chartType: currentQuestion.chart,
chartTypeUk: currentQuestion.chart_uk // Include chart_uk type chartTypeUk: currentQuestion.chart_uk // Include chart_uk type
}); });
@@ -182,7 +183,7 @@ document.addEventListener('DOMContentLoaded', function () {
currentQuestionIndex++; currentQuestionIndex++;
// Reset timer state before showing next question // Reset timer state before showing next question
timeLeft = 25; timeLeft = 25000; // 25 seconds in milliseconds
displayQuestion(); displayQuestion();
} }