Update app.py

app.py

@@ -3,11 +3,8 @@ import random
 from vocab import get_sources, get_words_from_source
 from sentences import generate_sentences
 from ai_sentence import MODEL_LIST
-from quiz import generate_fill_in_blank_exam, check_exam
+from quiz import generate_fill_in_blank_exam, check_exam, render_exam_interface
 
-# ================================
-#  處理邏輯：生成單字例句
-# ================================
 def process_sentence(mode, word, source, num, use_ai, model_name):
     try:
         if mode == '查詢單字':
@@ -31,9 +28,6 @@ def process_sentence(mode, word, source, num, use_ai, model_name):
     except Exception as e:
         return f"<p style='color:red;'>❌ 發生錯誤：{str(e)}</p>", f"錯誤：{str(e)}"
 
-# ================================
-#  專案說明段落
-# ================================
 def project_description():
     return """
     # 📖 VocabLine 單字例句工具
@@ -55,96 +49,104 @@ def project_description():
     - GitHub：[https://github.com/dayuian](https://github.com/dayuian)
     """
 
-# ================================
-#  模式切換：查詢 or 抽單字
-# ================================
-def switch_mode(mode):
-    return gr.update(visible=(mode == '查詢單字')), gr.update(visible=(mode == '隨機抽單字'))
-
-# ================================
-#  切換 AI 控制區塊
-# ================================
-def toggle_ai_button(use_ai):
-    return gr.update(visible=use_ai), gr.update(visible=use_ai)
-
-# ================================
-#  介面配置 - 分頁版本
-# ================================
 with gr.Blocks(css="""
     #card-group { padding: 15px; border-radius: 12px; background-color: rgba(255, 255, 255, 0.05); box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); margin-bottom: 15px; }
     .gradio-container { max-width: 800px; margin: auto; }
 """) as demo:
     gr.Markdown(project_description())
 
-    with gr.Tabs():
-        with gr.Tab("單字例句工具"):
-            with gr.Group():
-                with gr.Row():
-                    mode_radio = gr.Radio(
-                        ["查詢單字", "隨機抽單字"],
-                        label="選擇模式",
-                        value="查詢單字",
+    with gr.Tab("單字查詢/生成例句"):
+        with gr.Group():
+            with gr.Row():
+                mode_radio = gr.Radio(
+                    ["查詢單字", "隨機抽單字"],
+                    label="選擇模式",
+                    value="查詢單字",
+                    interactive=True
+                )
+
+            with gr.Group(elem_id="card-group"):
+                word_input = gr.Textbox(label="輸入單字", visible=True)
+                num_input = gr.Slider(minimum=1, maximum=10, value=5, step=1, label="抽取單字數量")
+                source_dropdown = gr.Dropdown(
+                    choices=get_sources(),
+                    value="common3000",
+                    label="選擇單字庫"
+                )
+
+        with gr.Group(elem_id="card-group"):
+            use_ai_checkbox = gr.Checkbox(label="使用 AI 生成句子（較慢，約 30 秒）", elem_id="use-ai-checkbox")
+
+            with gr.Row():
+                model_dropdown = gr.Dropdown(
+                    choices=MODEL_LIST,
+                    value="gpt2",
+                    label="選擇 AI 模型",
+                    visible=False
+                )
+                gr.Markdown("🔷 **建議使用 GPT2（表現較佳），Pythia-410m 很爛慎選！**", visible=False)
+
+        ai_warning = gr.Textbox(
+            value="⚠️ 使用 AI 生成句子為功能測試，每一個單字的生成過程可能需要 30 秒以上，請耐心等待。",
+            visible=False,
+            interactive=False,
+            label=""
+        )
+
+        result_output = gr.HTML(label="結果")
+        status_output = gr.Textbox(label="處理狀態", interactive=False)
+
+        with gr.Row():
+            generate_button = gr.Button("✨ 生成句子", elem_id="generate-button")
+
+    with gr.Tab("英文小考"):
+        quiz_source_dropdown = gr.Dropdown(
+            choices=get_sources(),
+            value="common3000",
+            label="選擇單字庫"
+        )
+        quiz_num_slider = gr.Slider(minimum=1, maximum=10, value=2, step=1, label="題目數量")
+
+        quiz_generate_button = gr.Button("📄 生成試卷")
+        quiz_submit_button = gr.Button("✅ 提交試卷")
+
+        quiz_questions_container = gr.Column()
+        quiz_score_display = gr.HTML()
+
+        quiz_questions_state = gr.State([])
+
+        def display_exam(source, num):
+            questions = generate_fill_in_blank_exam(source, num)
+            quiz_questions_state.value = questions
+
+            radios = []
+            for i, q in enumerate(questions):
+                radios.append(
+                    gr.Radio(
+                        choices=q['options'],
+                        label=f"第 {i + 1} 題：{q['sentence']}",
                         interactive=True
                     )
+                )
 
-                with gr.Group(elem_id="card-group"):
-                    word_input = gr.Textbox(label="輸入單字", visible=True)
-                    num_input = gr.Slider(minimum=1, maximum=10, value=5, step=1, label="抽取單字數量")
-                    source_dropdown = gr.Dropdown(
-                        choices=get_sources(),
-                        value="common3000",
-                        label="選擇單字庫"
-                    )
+            return radios
 
-            with gr.Group(elem_id="card-group"):
-                use_ai_checkbox = gr.Checkbox(label="使用 AI 生成句子（較慢，約 30 秒）", elem_id="use-ai-checkbox")
-
-                with gr.Row():
-                    model_dropdown = gr.Dropdown(
-                        choices=MODEL_LIST,
-                        value="gpt2",
-                        label="選擇 AI 模型",
-                        visible=False
-                    )
-                    ai_warning = gr.Textbox(
-                        value="⚠️ 使用 AI 生成句子為功能測試，每一個單字的生成過程可能需要 30 秒以上，請耐心等待。",
-                        visible=False,
-                        interactive=False,
-                        label=""
-                    )
+        def submit_exam(*user_answers):
+            questions = quiz_questions_state.value
+            score_html = check_exam(user_answers, questions)
+            return score_html
+
+        quiz_generate_button.click(
+            display_exam,
+            inputs=[quiz_source_dropdown, quiz_num_slider],
+            outputs=quiz_questions_container
+        )
+
+        quiz_submit_button.click(
+            submit_exam,
+            inputs=quiz_questions_container,
+            outputs=quiz_score_display
+        )
 
-            result_output = gr.HTML(label="結果")
-            status_output = gr.Textbox(label="處理狀態", interactive=False)
 
-            with gr.Row():
-                generate_button = gr.Button("✨ 生成句子", elem_id="generate-button")
-
-            mode_radio.change(switch_mode, inputs=[mode_radio], outputs=[word_input, num_input])
-            use_ai_checkbox.change(toggle_ai_button, inputs=[use_ai_checkbox], outputs=[model_dropdown, ai_warning])
-            generate_button.click(process_sentence, inputs=[mode_radio, word_input, source_dropdown, num_input, use_ai_checkbox, model_dropdown], outputs=[result_output, status_output])
-
-        with gr.Tab("英文小考"):
-            quiz_source_dropdown = gr.Dropdown(
-                choices=get_sources(),
-                value="common3000",
-                label="選擇單字庫"
-            )
-
-            quiz_num_slider = gr.Slider(
-                minimum=1,
-                maximum=5,
-                value=3,
-                step=1,
-                label="選擇題數量"
-            )
-
-            quiz_generate_button = gr.Button("生成試卷")
-            quiz_output_area = gr.HTML(label="試卷區")
-            quiz_submit_button = gr.Button("提交答案")
-            quiz_score_display = gr.HTML(label="分數")
-
-            quiz_generate_button.click(fn=generate_fill_in_blank_exam, inputs=[quiz_source_dropdown, quiz_num_slider], outputs=[quiz_output_area])
-            quiz_submit_button.click(fn=check_exam, inputs=[], outputs=[quiz_score_display])
-
-# 啟動
     demo.launch()