Fausto Busuito
commited on
Commit
·
811236f
1
Parent(s):
b4859d5
Application changes
Browse files- app/static/script.js +11 -94
- app/static/style.css +9 -0
app/static/script.js
CHANGED
@@ -71,6 +71,10 @@ function displayQuestion() {
|
|
71 |
optionsDiv.appendChild(form);
|
72 |
}
|
73 |
|
|
|
|
|
|
|
|
|
74 |
function selectAnswer(optionIndex) {
|
75 |
const currentAnswers = userAnswers[currentIndex];
|
76 |
if (currentAnswers.includes(optionIndex)) {
|
@@ -196,113 +200,26 @@ document.getElementById('end-session').addEventListener('click', () => {
|
|
196 |
<p><strong>Your score:</strong> ${score.toFixed(2)}%</p>
|
197 |
`;
|
198 |
|
199 |
-
// Aggiungi
|
200 |
-
const returnButton = document.createElement('button');
|
201 |
-
returnButton.innerText = 'Return to Start';
|
202 |
-
returnButton.style.marginTop = '20px';
|
203 |
-
returnButton.addEventListener('click', () => {
|
204 |
-
// Nascondi i risultati
|
205 |
-
document.getElementById('results-container').style.display = 'none';
|
206 |
-
document.getElementById('quiz-container').style.display = 'block';
|
207 |
-
|
208 |
-
// Resetta lo stato per una nuova sessione
|
209 |
-
userAnswers = []; // Resetta le risposte dell'utente
|
210 |
-
currentQuestionIndex = 0; // Ripristina l'indice della domanda
|
211 |
-
// Reset della selezione file (se necessario)
|
212 |
-
document.getElementById('file-selector').value = ''; // Reset del selettore del file (se usato)
|
213 |
-
});
|
214 |
-
|
215 |
-
// Aggiungi i dettagli del punteggio, la tabella e il pulsante alla schermata dei risultati
|
216 |
const resultsContainer = document.getElementById('results-container');
|
217 |
resultsContainer.innerHTML = ''; // Pulisci i risultati precedenti
|
218 |
resultsContainer.appendChild(scoreDetails);
|
219 |
resultsContainer.appendChild(resultsTable);
|
220 |
-
resultsContainer.appendChild(returnButton);
|
221 |
|
222 |
// Mostra il contenitore dei risultati e nascondi il quiz
|
223 |
document.getElementById('quiz-container').style.display = 'none';
|
224 |
resultsContainer.style.display = 'block';
|
225 |
});
|
226 |
-
// Variabile globale per il timer
|
227 |
-
let timer = 0;
|
228 |
-
let timerInterval;
|
229 |
|
230 |
-
// Aggiungi l'evento al pulsante "Return to Start"
|
231 |
document.getElementById('restart').addEventListener('click', () => {
|
232 |
-
// Ferma il timer prima di resettare
|
233 |
-
clearInterval(timerInterval);
|
234 |
-
timer = 0; // Reset del timer
|
235 |
-
document.getElementById('timer').innerText = '00:00'; // Ripristina il timer a 00:00
|
236 |
-
|
237 |
-
// Nascondi la sezione dei risultati e mostra il quiz
|
238 |
document.getElementById('results-container').style.display = 'none';
|
239 |
-
document.getElementById('
|
240 |
-
|
241 |
-
|
242 |
-
|
243 |
-
|
244 |
-
|
245 |
-
document.getElementById('file-selector').value = ''; // Resetta la selezione del file
|
246 |
-
|
247 |
-
// Pulisce il contenuto dei risultati
|
248 |
-
document.getElementById('results-container').innerHTML = '';
|
249 |
-
|
250 |
-
// Ripristina la visualizzazione della prima domanda
|
251 |
-
loadQuestion();
|
252 |
});
|
253 |
-
|
254 |
-
// Funzione per il reset completo dello stato del quiz
|
255 |
-
function resetQuizState() {
|
256 |
-
currentQuestionIndex = 0; // Ripristina l'indice della domanda
|
257 |
-
userAnswers = []; // Resetta le risposte dell'utente
|
258 |
-
clearInterval(timerInterval); // Ferma qualsiasi intervallo del timer in corso
|
259 |
-
timer = 0; // Resetta il timer
|
260 |
-
}
|
261 |
-
|
262 |
-
// Funzione per caricare una domanda
|
263 |
-
function loadQuestion() {
|
264 |
-
if (questions.length > 0) {
|
265 |
-
const question = questions[currentQuestionIndex];
|
266 |
-
|
267 |
-
// Mostra la domanda
|
268 |
-
const questionContainer = document.getElementById('question-container');
|
269 |
-
questionContainer.innerHTML = `<p>${question.question}</p>`;
|
270 |
-
|
271 |
-
// Mostra le risposte
|
272 |
-
const answersContainer = document.getElementById('answers-container');
|
273 |
-
answersContainer.innerHTML = '';
|
274 |
-
|
275 |
-
question.options.forEach((option, index) => {
|
276 |
-
const answerElement = document.createElement('div');
|
277 |
-
const inputType = question.correct.length > 1 ? 'checkbox' : 'radio';
|
278 |
-
answerElement.innerHTML = `
|
279 |
-
<label>
|
280 |
-
<input type="${inputType}" name="answer" value="${index}" /> ${option}
|
281 |
-
</label>
|
282 |
-
`;
|
283 |
-
answersContainer.appendChild(answerElement);
|
284 |
-
});
|
285 |
-
|
286 |
-
// Visualizza il numero di domanda
|
287 |
-
document.getElementById('question-number').innerText = `Question ${currentQuestionIndex + 1} of ${questions.length}`;
|
288 |
-
|
289 |
-
// Riavvia il timer
|
290 |
-
startTimer();
|
291 |
-
}
|
292 |
-
|
293 |
-
// Funzione per avviare il timer
|
294 |
-
function startTimer() {
|
295 |
-
clearInterval(timerInterval); // Assicurati di fermare il timer precedente
|
296 |
-
timer = 0; // Reset del timer
|
297 |
-
timerInterval = setInterval(() => {
|
298 |
-
timer++;
|
299 |
-
const minutes = String(Math.floor(timer / 60)).padStart(2, '0');
|
300 |
-
const seconds = String(timer % 60).padStart(2, '0');
|
301 |
-
document.getElementById('timer').innerText = `${minutes}:${seconds}`;
|
302 |
-
}, 1000);
|
303 |
-
}
|
304 |
-
|
305 |
-
|
306 |
function updateTimer() {
|
307 |
const elapsedTime = Math.floor((Date.now() - startTime) / 1000);
|
308 |
const hours = String(Math.floor(elapsedTime / 3600)).padStart(2, '0');
|
|
|
71 |
optionsDiv.appendChild(form);
|
72 |
}
|
73 |
|
74 |
+
|
75 |
+
|
76 |
+
|
77 |
+
|
78 |
function selectAnswer(optionIndex) {
|
79 |
const currentAnswers = userAnswers[currentIndex];
|
80 |
if (currentAnswers.includes(optionIndex)) {
|
|
|
200 |
<p><strong>Your score:</strong> ${score.toFixed(2)}%</p>
|
201 |
`;
|
202 |
|
203 |
+
// Aggiungi i dettagli del punteggio e la tabella ai risultati
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
204 |
const resultsContainer = document.getElementById('results-container');
|
205 |
resultsContainer.innerHTML = ''; // Pulisci i risultati precedenti
|
206 |
resultsContainer.appendChild(scoreDetails);
|
207 |
resultsContainer.appendChild(resultsTable);
|
|
|
208 |
|
209 |
// Mostra il contenitore dei risultati e nascondi il quiz
|
210 |
document.getElementById('quiz-container').style.display = 'none';
|
211 |
resultsContainer.style.display = 'block';
|
212 |
});
|
|
|
|
|
|
|
213 |
|
|
|
214 |
document.getElementById('restart').addEventListener('click', () => {
|
|
|
|
|
|
|
|
|
|
|
|
|
215 |
document.getElementById('results-container').style.display = 'none';
|
216 |
+
document.getElementById('file-selection').style.display = 'block';
|
217 |
+
document.getElementById('quiz-container').style.display = 'none';
|
218 |
+
currentIndex = 0;
|
219 |
+
questions = [];
|
220 |
+
userAnswers = [];
|
221 |
+
document.getElementById('file').value = ''; // Reset file selection
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
222 |
});
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
223 |
function updateTimer() {
|
224 |
const elapsedTime = Math.floor((Date.now() - startTime) / 1000);
|
225 |
const hours = String(Math.floor(elapsedTime / 3600)).padStart(2, '0');
|
app/static/style.css
CHANGED
@@ -46,6 +46,15 @@ label {
|
|
46 |
margin-top: 20px;
|
47 |
}
|
48 |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
49 |
#navigation button:hover {
|
50 |
background-color: #0056b3;
|
51 |
}
|
|
|
46 |
margin-top: 20px;
|
47 |
}
|
48 |
|
49 |
+
#navigation button {
|
50 |
+
font-size: 16px;
|
51 |
+
border: none;
|
52 |
+
background-color: #bfbfbf;
|
53 |
+
color: white;
|
54 |
+
cursor: pointer;
|
55 |
+
transition: background-color 0.3s ease;
|
56 |
+
}
|
57 |
+
|
58 |
#navigation button:hover {
|
59 |
background-color: #0056b3;
|
60 |
}
|