File size: 3,904 Bytes
cdfb731 0bcd8e4 cdfb731 0bcd8e4 19abad4 cdfb731 a2274a8 9dc9ac8 a2274a8 9dc9ac8 a2274a8 0bcd8e4 cdfb731 0bcd8e4 cdfb731 6fc4c72 cdfb731 9dc9ac8 cdfb731 0bcd8e4 cdfb731 98960e8 0bcd8e4 98960e8 0bcd8e4 98960e8 cdfb731 0bcd8e4 98960e8 cdfb731 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 |
const socket = io();
let username;
function joinQuiz() {
username = document.getElementById('username').value;
socket.emit('join', { username: username });
document.getElementById('username').style.display = 'none';
document.querySelector('button').style.display = 'none';
document.getElementById('logged-user').textContent = username;
document.getElementById('quiz-content').style.display = 'block';
document.getElementById('waiting-message').style.display = 'block';
document.getElementById('join-title').style.display = 'none';
}
function submitForm(event) {
event.preventDefault();
const selectedOption = document.querySelector('input[name="answer"]:checked');
if (selectedOption) {
const answer = selectedOption.value;
socket.emit('submit_answer', { answer });
} else {
alert("Please select an option before submitting.");
}
}
function selectExam() {
const examName = document.getElementById('exam-selector').value;
const startQuestion = document.getElementById('start-question').value;
socket.emit('select_exam', { exam_name: examName, start_question: parseInt(startQuestion) });
}
socket.on('exam_loaded', (data) => {
if (data.success) {
document.getElementById('question-count').textContent =
`Exam "${data.exam_name}" loaded with ${data.num_questions} questions. Starting from question ${data.start_question}.`;
alert(`Exam "${data.exam_name}" loaded successfully!`);
} else {
alert(`Failed to load exam "${data.exam_name}".`);
}
});
socket.on('update_participants', (data) => {
document.getElementById('participant-count').textContent = data.count;
});
socket.on('new_question', (data) => {
document.getElementById('waiting-message').style.display = 'none';
document.getElementById('question-text').innerText = data.question;
const letters = ['a', 'b', 'c', 'd'];
const options = data.options.map((opt, index) =>
`<input type="radio" id="${letters[index]}" name="answer" value="${opt}">
<label for="${letters[index]}">${letters[index]}) ${opt}</label><br>`
).join('');
document.getElementById('options').innerHTML = options;
document.getElementById('end-quiz').disabled = false;
});
function checkAnswers() {
socket.emit('check_answers');
}
function nextQuestion() {
socket.emit('next_question');
}
function endQuiz() {
socket.emit('end_quiz');
}
function restartQuiz() {
socket.emit('restart_quiz');
}
socket.on('display_results', (data) => {
const img = `<img src="data:image/png;base64,${data.chart}" alt="Results Chart" />`;
const resultText = `<p>Correct Answer: ${data.results.correct_answer}</p>`;
document.getElementById('results').innerHTML = img + resultText;
});
socket.on('enable_end_quiz', () => {
document.getElementById('end-quiz').disabled = false;
});
socket.on('clear_results', () => {
document.getElementById('results').innerHTML = '';
});
socket.on('display_final_results', (finalResults) => {
document.getElementById('quiz-content').style.display = 'none';
const resultsTable = document.getElementById('results-table');
resultsTable.innerHTML = '';
finalResults.forEach((participant) => {
const row = `<tr><td>${participant.username}</td><td>${participant.score}</td></tr>`;
resultsTable.innerHTML += row;
});
document.getElementById('final-results').style.display = 'block';
});
socket.on('quiz_reset', () => {
document.getElementById('results').innerHTML = '';
document.getElementById('question-text').innerText = '';
document.getElementById('options').innerHTML = '';
document.getElementById('final-results').style.display = 'none';
document.getElementById('quiz-content').style.display = 'block';
document.getElementById('waiting-message').style.display = 'block';
});
|