Update app.py

app.py

@@ -7,58 +7,56 @@ selected_questions = []
 
 description_str = """Developed by Ruslan Magana, this interactive quiz platform is designed to help you prepare and assess your knowledge in a variety of exams. 
 For more information about the developer, please visit [ruslanmv.com](https://ruslanmv.com/).
-
-**Get Started with Your Quiz**  
+**Get Started with Your Quiz** 
 Select an exam from the dropdown menu below and start testing your skills. You can also choose to enable audio feedback to enhance your learning experience. Simply toggle the "Enable Audio" checkbox to turn it on or off."""
 
 # --- FUNCTION DEFINITIONS ---
 
 def start_exam(exam_choice, start_question, audio_enabled):
-    """Starts the exam by selecting questions and setting up UI."""
+    """Starts the exam by selecting questions, setting up UI."""
     global selected_questions
     selected_questions = select_exam_vce(exam_choice)
     
     if start_question >= len(selected_questions):
-        start_question = 0  # Default to the first question if slider value exceeds available questions
+        start_question = 0  # Default to the first question if the input exceeds available questions
     
     question, options, audio_path = display_question(start_question, audio_enabled)
     
     return (
-        # Hide home screen elements
+        # Hide start screen elements
         gr.update(visible=False),  # Hide title
-        gr.update(visible=False),  # Hide description
-        gr.update(visible=False),  # Hide exam_selector
-        gr.update(visible=False),  # Hide start_button
+        gr.update(visible=False), # Hide description
+        gr.update(visible=False), # Hide exam_selector
+        gr.update(visible=False), # Hide start_button
         gr.update(visible=False),  # Hide the audio_checkbox
         gr.update(visible=False),  # Hide start_question_slider
         # Show quiz elements
-        gr.update(visible=True),   # Show question_text
-        question,                  # question_text content
-        gr.update(choices=options, visible=True),  # Update Radio choices
-        gr.update(visible=True),   # Show answer_button
-        gr.update(visible=True),   # Show next_button
-        gr.update(visible=True),   # Show prev_button
-        gr.update(visible=True),   # Show home_button
-        start_question, "",        # Update question_state and result_text
-        audio_path,                # question_audio path
-        gr.update(visible=True),   # Show explain_button
+        gr.update(visible=True),  # Show question_text
+        question,  # Question to display
+        gr.update(choices=options, visible=True),  # Update Radio choices and make visible
+        gr.update(visible=True),  # Show answer_button
+        gr.update(visible=True),# Show next_button
+        gr.update(visible=True), # Show prev_button
+        gr.update(visible=True), # Show home_button
+        start_question, "",  # Update the question state
+        audio_path, # Provide the audio_path
+        gr.update(visible=True),  # Show explain_button
         gr.update(visible=True),
-        None                       # current_audio_state => None to reset
+        None  # None for the audio stop signal
     )
 
 def display_question(index, audio_enabled):
-    """Displays a question with options and generates audio if enabled."""
+    """Displays a question with options and generates audio (if enabled)."""
     if index < 0 or index >= len(selected_questions):
         return "No more questions.", [], None
-    
     question_text_ = selected_questions[index].get('question', 'No question text available.')
-    question_text = f"**Question {index}:** {question_text_}"
+    question_text = f"**Question {index }:** {question_text_}"
     choices_options = selected_questions[index].get('options', [])
     audio_path = text_to_speech(question_text_ + " " + " ".join(choices_options)) if audio_enabled else None
     return question_text, choices_options, audio_path
 
 def show_explanation(index):
-    """Shows the explanation for the current question."""
+    """Shows the explanation for the current question and hides previous results."""
     if 0 <= index < len(selected_questions):
         explanation = selected_questions[index].get('explanation', 'No explanation available for this question.')
         return (
@@ -78,77 +76,67 @@ def check_answer(index, answer):
         return f"Incorrect. The correct answer is: {correct_answer}"
 
 def update_question(index, audio_enabled):
-    """Updates the displayed question when navigating."""
+    """Updates the displayed question when the index changes."""
     question, options, audio_path = display_question(index, audio_enabled)
     return question, gr.update(choices=options), index, audio_path
 
 def handle_answer(index, answer, audio_enabled, current_audio):
-    """Handles answer submission and generates answer feedback audio if enabled."""
+    """Handles answer submission, provides feedback, and generates audio."""
+    # Handle the case when no answer is selected
     if answer is None:
         return "Please select an option before submitting.", None, None
     
-    # Stop previous question audio
+    # Stop the current question audio before playing the answer audio
     stop_audio = True if current_audio else False
     result = check_answer(index, answer)
     answer_audio_path = text_to_speech(result) if audio_enabled else None
     return result, answer_audio_path, stop_audio
 
+
 def handle_next(index, audio_enabled):
-    """Moves to the next question."""
+    """Moves to the next question and updates the UI."""
     new_index = min(index + 1, len(selected_questions) - 1)
     question, options, new_index, audio_path = update_question(new_index, audio_enabled)
-    # Hide explanation each time we move to a new question
-    return question, options, new_index, "", audio_path, gr.update(visible=False)
+    return question, options, new_index, "", audio_path, gr.update(visible=False)  # Hide explanation
 
 def handle_previous(index, audio_enabled):
-    """Moves to the previous question."""
+    """Moves to the previous question and updates the UI."""
     new_index = max(index - 1, 0)
     question, options, new_index, audio_path = update_question(new_index, audio_enabled)
-    # Hide explanation each time we move to a new question
-    return question, options, new_index, "", audio_path, gr.update(visible=False)
+    return question, options, new_index, "", audio_path, gr.update(visible=False)  # Hide explanation
 
 def return_home():
     """Returns to the home screen."""
     return (
         # Show start screen elements
-        gr.update(visible=True),  # title
-        gr.update(visible=True),  # description
-        gr.update(visible=True),  # exam_selector
-        gr.update(visible=True),  # start_button
-        gr.update(visible=True),  # audio_checkbox
-        gr.update(visible=True),  # start_question_slider
-        # Hide quiz elements
-        gr.update(visible=False), gr.update(visible=False), gr.update(visible=False),
-        gr.update(visible=False), gr.update(visible=False), gr.update(visible=False),
-        gr.update(visible=False), 0, "", gr.update(visible=False), gr.update(visible=False), None
+        gr.update(visible=True), gr.update(visible=True), gr.update(visible=True), gr.update(visible=True),
+        gr.update(visible=True),  # Show the audio_checkbox
+        gr.update(visible=False), gr.update(visible=False), gr.update(visible=False), gr.update(visible=False),
+        gr.update(visible=False), gr.update(visible=False), gr.update(visible=False), "", "", gr.update(visible=False), gr.update(visible=False),
+        gr.update(visible=False)  # Hide explain button
     )
 
-with gr.Blocks(css="style1.css") as demo:  # <--- Include your custom CSS file here
+with gr.Blocks() as demo:
     # Home page elements
-    title = gr.Markdown(value="**Exam Simulator (Quiz)**")
+    title = gr.Markdown(value="**AWS Exam Simulator (Quiz)**")
     description = gr.Markdown(value=description_str)
     exam_selector = gr.Dropdown(label="Select an exam", choices=exams, value=None)
     audio_checkbox = gr.Checkbox(label="Enable Audio", value=True, visible=False)
-    start_question_slider = gr.Slider(minimum=0, maximum=50, step=1, label="Select starting question", visible=False)
+    start_question_slider = gr.Slider(minimum=0, maximum=50, step=1, label="Select starting question", visible=False)  # Slider for selecting the starting question
     start_button = gr.Button("Start Exam", visible=False)
 
     # Quiz elements (initially hidden)
     question_state = gr.State(0)
-    current_audio_state = gr.State(None)
-    
-    # Use elem_id to link to our CSS for vertical display 
+    current_audio_state = gr.State(None)  # State to track the current audio playing
     question_text = gr.Markdown(visible=False, elem_id="question-text")
-    choices = gr.Radio(visible=False, label="Options", elem_id="choices-radio")
-    
+    choices = gr.Radio(visible=False, label="Options")
     result_text = gr.Markdown(visible=True)
     explanation_text = gr.Markdown(visible=False)
-    
     answer_button = gr.Button("Submit Answer", visible=False)
     next_button = gr.Button("Next Question", visible=False)
     prev_button = gr.Button("Previous Question", visible=False)
     home_button = gr.Button("Return to Home", visible=False)
     explain_button = gr.Button("Explain", visible=False)
-    
     question_audio = gr.Audio(visible=False, label="Question Audio", autoplay=True)
     answer_audio = gr.Audio(visible=False, label="Answer Audio", autoplay=True)
 
@@ -182,63 +170,38 @@ with gr.Blocks(css="style1.css") as demo:  # <--- Include your custom CSS file h
     
     # Show settings after exam selection
     def show_settings(exam_choice):
-        # When an exam is chosen, show the audio checkbox, slider, and start button
         return gr.update(visible=True), gr.update(visible=True), gr.update(visible=True)
 
-    exam_selector.change(
-        fn=show_settings, 
-        inputs=[exam_selector], 
-        outputs=[audio_checkbox, start_question_slider, start_button]
-    )
+    # Connect exam selection to display settings section
+    exam_selector.change(fn=show_settings, inputs=[exam_selector], outputs=[audio_checkbox, start_question_slider, start_button])
 
-    # Connect start button -> start_exam
+    # Connect the start button to start the exam
     start_button.click(
         fn=start_exam, 
         inputs=[exam_selector, start_question_slider, audio_checkbox], 
         outputs=[
             title, description, exam_selector, start_button,
-            audio_checkbox, start_question_slider,
+            audio_checkbox,  # Ensure the checkbox visibility is updated
+            start_question_slider,  # Ensure the slider is hidden
             question_text, question_text, choices, answer_button, 
             next_button, prev_button, home_button, question_state, result_text, question_audio,
-            explain_button, result_text, current_audio_state
+            explain_button, result_text, current_audio_state  # Add current_audio_state to the outputs
         ]
     )
 
-    # Connect quiz action buttons
-    answer_button.click(
-        fn=handle_answer, 
-        inputs=[question_state, choices, audio_checkbox, current_audio_state], 
-        outputs=[result_text, answer_audio, current_audio_state]
-    )
+    # Connect the quiz buttons to their functions
+    answer_button.click(fn=handle_answer, inputs=[question_state, choices, audio_checkbox, current_audio_state], outputs=[result_text, answer_audio, current_audio_state])
+    next_button.click(fn=handle_next, inputs=[question_state, audio_checkbox], outputs=[question_text, choices, question_state, result_text, question_audio, explanation_text])
+    prev_button.click(fn=handle_previous, inputs=[question_state, audio_checkbox], outputs=[question_text, choices, question_state, result_text, question_audio, explanation_text])
 
-    next_button.click(
-        fn=handle_next, 
-        inputs=[question_state, audio_checkbox], 
-        outputs=[question_text, choices, question_state, result_text, question_audio, explanation_text]
-    )
+    explain_button.click(fn=show_explanation, inputs=[question_state], outputs=[explanation_text, result_text, explanation_text])
 
-    prev_button.click(
-        fn=handle_previous, 
-        inputs=[question_state, audio_checkbox], 
-        outputs=[question_text, choices, question_state, result_text, question_audio, explanation_text]
-    )
-
-    explain_button.click(
-        fn=show_explanation, 
-        inputs=[question_state], 
-        outputs=[explanation_text, result_text, explanation_text]
-    )
-
-    home_button.click(
-        fn=return_home,
-        inputs=None,
-        outputs=[
-            title, description, exam_selector, start_button,
-            audio_checkbox, start_question_slider,
-            question_text, question_text, choices, answer_button, 
-            next_button, prev_button, home_button, question_state, 
-            result_text, explanation_text, explain_button, current_audio_state
-        ]
-    )
+    home_button.click(fn=return_home, inputs=None, outputs=[
+        title, description, exam_selector, start_button,
+        audio_checkbox,  # Ensure the checkbox visibility is updated
+        #start_question_slider,  # Ensure the slider is shown
+        question_text, question_text, choices, answer_button, 
+        next_button, prev_button, home_button, question_state, result_text, explanation_text, explain_button
+    ])
 
-demo.launch()
+demo.launch()