updates

app.py

@@ -52,8 +52,8 @@ def on_leave():
         emit('update_participants', {"participants": participants, "count": len(participants)}, room='quiz')
         print(f"{username} left the quiz.")
 
-@socketio.on('load_quiz')
-def load_quiz(data):
+#@socketio.on('load_quiz')
+def load_quiz_old(data):
     global selected_questions
     exam_name = data['exam_name']
     start_question = data['start_question'] - 1  # Adjust for 0-based indexing
@@ -65,6 +65,19 @@ def load_quiz(data):
     else:
         emit('quiz_loaded', {"success": False}, room=request.sid)
 
+@socketio.on('load_quiz')
+def load_quiz(data):
+    global selected_questions
+    exam_name = data['exam_name']
+    selected_questions = backend.select_exam(exam_name)
+    if selected_questions:
+        num_questions = len(selected_questions)
+        emit('quiz_loaded', {"success": True, "num_questions": num_questions}, room=request.sid)
+    else:
+        emit('quiz_loaded', {"success": False}, room=request.sid)
+
+
+
 @socketio.on('start_quiz')
 def start_quiz():
     if participants and selected_questions:

static/script.js

@@ -31,10 +31,15 @@ function selectExam() {
 
 function loadQuiz() {
     const examName = document.getElementById('exam-selector').value;
-    const startQuestion = document.getElementById('start-question-number').value;
-    socket.emit('load_quiz', { exam_name: examName, start_question: parseInt(startQuestion) });
-}
+    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;
@@ -63,12 +68,25 @@ function restartQuiz() {
 
 socket.on('quiz_loaded', (data) => {
     if (data.success) {
-        alert(`Quiz loaded with ${data.num_questions} questions, starting from question ${data.start_question}.`);
+        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.`);
+        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;

templates/host.html

@@ -17,10 +17,10 @@
                 <option value="{{ exam }}">{{ exam }}</option>
             {% endfor %}
         </select>
-        <label for="start-question" class="mt-3">Select starting question:</label>
-        <input type="range" id="start-question" min="1" max="10" value="1" class="form-range mt-2 mb-2" oninput="updateSliderValue(this.value)">
-        <input type="number" id="start-question-number" min="1" max="10" value="1" class="form-control" oninput="updateSliderValue(this.value)">
-        <p id="question-start-display" class="mt-2">Starting from question 1.</p>
+        <label for="start-question" id="start-question-label" class="mt-3" style="display: none;">Select starting question:</label>
+        <input type="range" id="start-question" min="1" max="10" value="1" class="form-range mt-2 mb-2" style="display: none;" oninput="updateSliderValue(this.value)">
+        <input type="number" id="start-question-number" min="1" max="10" value="1" class="form-control" style="display: none;" oninput="updateSliderValue(this.value)">
+        <p id="question-start-display" class="mt-2" style="display: none;">Starting from question 1.</p>        
         <button onclick="loadQuiz()" class="btn btn-info mt-3">Load Quiz</button><br><br>
         <button onclick="startQuiz()" class="btn btn-success mt-3">Start Quiz</button><br><br>
         <button onclick="restartQuiz()" class="btn btn-warning mt-3">Restart</button><br><br>