File size: 5,011 Bytes
78447bc c17c125 78447bc c17c125 78447bc c17c125 78447bc c17c125 78447bc c17c125 78447bc |
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 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 |
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-number').value;
document.getElementById('question-start-display').textContent = `Starting from question ${startQuestion}.`;
}
function loadQuiz() {
const examName = document.getElementById('exam-selector').value;
const startQuestion = parseInt(document.getElementById('start-question-number').value, 10);
if (!examName) {
alert("Please select an exam first.");
return;
}
socket.emit('load_quiz', { exam_name: examName, start_question: startQuestion });
}
function updateSliderValue(value) {
document.getElementById('start-question').value = value;
document.getElementById('start-question-number').value = value;
document.getElementById('question-start-display').textContent = `Starting from question ${value}.`;
}
function startQuiz() {
socket.emit('start_quiz');
}
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('quiz_loaded', (data) => {
if (data.success) {
alert(`Quiz loaded with ${data.num_questions} questions.`);
// Update the range and number input max values dynamically
const startQuestionInput = document.getElementById('start-question');
const startQuestionNumber = document.getElementById('start-question-number');
startQuestionInput.max = data.num_questions;
startQuestionNumber.max = data.num_questions;
// Show the start question controls
document.getElementById('start-question-label').style.display = 'block';
startQuestionInput.style.display = 'block';
startQuestionNumber.style.display = 'block';
document.getElementById('question-start-display').style.display = 'block';
} else {
alert("Failed to load quiz. Please try again.");
}
});
socket.on('new_question', (data) => {
document.getElementById('waiting-message').style.display = 'none';
document.getElementById('question-text').innerText = data.question;
// Dynamically generate letters for options (up to 'h')
const letters = ['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h'];
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;
});
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; // Enable the "End Quiz" button
});
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';
}); |