First version not end

app.py

@@ -60,6 +60,7 @@ def select_exam(data):
 
 @socketio.on('restart_quiz')
 def restart_quiz():
+    reset_quiz()
     start_quiz()
 
 def start_quiz():

static/script.js

@@ -25,14 +25,19 @@ function submitForm(event) {
 
 function selectExam() {
     const examName = document.getElementById('exam-selector').value;
-    const startQuestion = document.getElementById('start-question').value;
+    const startQuestion = document.getElementById('start-question-number').value;
     socket.emit('select_exam', { exam_name: examName, start_question: parseInt(startQuestion) });
+    document.getElementById('question-start-display').textContent = `Starting from 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}.`;
 }
 
 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}".`);

templates/host.html

@@ -17,9 +17,10 @@
                 <option value="{{ exam }}">{{ exam }}</option>
             {% endfor %}
         </select>
-        <p id="question-count" style="margin-top: 15px;"></p>
         <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-4">
+        <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>
         <button onclick="restartQuiz()" class="btn btn-success mt-3">Start New Quiz</button><br><br>
         <button onclick="checkAnswers()" class="btn btn-primary mt-2">Check Answers</button><br><br>
         <button onclick="nextQuestion()" class="btn btn-secondary mt-2">Next Question</button><br><br>