Update ui/layouts.py

ui/layouts.py

@@ -1,54 +1,25 @@
-# ui/layouts.py (最終完整版)
+# ui/layouts.py (除錯測試版 - 僅顯示前四個分頁)
 import gradio as gr
 from config import content, data, defaults
 from core import callbacks
 
 def create_ui(visit_count_html: str, theme: gr.Theme):
-    """
-    Creates and returns the Gradio UI Blocks.
-
-    Args:
-        visit_count_html: The Markdown string to display the visit count.
-        theme: The Gradio theme object to apply to the UI.
-    """
-
     with gr.Blocks(theme=theme, title="地球物理學") as demo:
-        # --- 自訂頂部 Header ---
         gr.Markdown(
             """
             <style>
             .custom-header {
                 background: linear-gradient(135deg, #005f73, #0a9396);
-                color: #fff;
-                padding: 4rem 2rem;
-                text-align: center;
-                border-radius: 0 0 20px 20px;
-                margin-bottom: 2rem;
+                color: #fff; padding: 4rem 2rem; text-align: center;
+                border-radius: 0 0 20px 20px; margin-bottom: 2rem;
                 box-shadow: 0 8px 15px rgba(0,0,0,0.1);
             }
-            .custom-header h1 {
-                font-size: 3.5rem;
-                font-weight: 700;
-                margin-bottom: 0.8rem;
-                line-height: 1.2;
-            }
-            .custom-header p {
-                font-size: 1.6rem;
-                font-weight: 400;
-                opacity: 0.9;
-                margin-top: 0;
-            }
+            .custom-header h1 { font-size: 3.5rem; font-weight: 700; margin-bottom: 0.8rem; line-height: 1.2; }
+            .custom-header p { font-size: 1.6rem; font-weight: 400; opacity: 0.9; margin-top: 0; }
             @media (max-width: 768px) {
-                .custom-header {
-                    padding: 3rem 1rem;
-                    border-radius: 0;
-                }
-                .custom-header h1 {
-                    font-size: 2.5rem;
-                }
-                .custom-header p {
-                    font-size: 1.2rem;
-                }
+                .custom-header { padding: 3rem 1rem; border-radius: 0; }
+                .custom-header h1 { font-size: 2.5rem; }
+                .custom-header p { font-size: 1.2rem; }
             }
             </style>
             <div class="custom-header">
@@ -58,10 +29,8 @@ def create_ui(visit_count_html: str, theme: gr.Theme):
             """
         )
 
-        # --- 主導覽列 Tab 容器 ---
         with gr.Row(variant="panel", elem_id="main-nav-tabs"):
             with gr.Tabs(selected=0):
-
                 with gr.TabItem("🎯 課程目標"):
                     gr.Markdown(content.course_goals_md)
 
@@ -86,7 +55,7 @@ def create_ui(visit_count_html: str, theme: gr.Theme):
                             with gr.Column(scale=3):
                                 map_plot_output = gr.Plot(label="地圖輸出")
                                 map_console_output = gr.Textbox(label="執行結果 / 錯誤訊息", lines=8, interactive=False)
-
+                    
                     with gr.Accordion("📈 震波圖繪製實驗室 (ObsPy 概念)", open=False):
                         with gr.Row():
                             with gr.Column(scale=2):
@@ -97,47 +66,16 @@ def create_ui(visit_count_html: str, theme: gr.Theme):
                                 seismo_plot_output = gr.Plot(label="震波圖輸出")
                                 seismo_console_output = gr.Textbox(label="執行結果 / 錯誤訊息", lines=8, interactive=False)
 
-                with gr.TabItem("🤖 AI 課程助教"):
-                    with gr.Group():
-                        gr.Markdown("### 🤖 AI 課程助教 (知識庫 & 即時資訊強化版)")
-                        gr.Markdown("""
-                        歡迎使用課程 AI 助教！我整合了靜態的課程知識與多種即時資訊來源，您可以隨時向我提問。
-
-                        ---
-
-                        #### 📚 **課程知識庫**
-                        我可以回答關於本課程的各種問題，例如：`「這門課的評分標準是什麼？」`
+                # --- ✨ 第五個分頁「AI 課程助教」已被暫時註解掉 ---
+                # with gr.TabItem("🤖 AI 課程助教"):
+                #     with gr.Group():
+                #         gr.Markdown("### 🤖 AI 課程助教 (知識庫 & 即時資訊強化版)")
+                #         gr.Markdown(''' ... ''')
+                #         custom_textbox = gr.Textbox(...)
+                #         gr.ChatInterface(...)
 
-                        ---
-
-                        #### ⚡ **即時資訊查詢**
-                        我還能幫您查詢最新的動態資訊，試著問我：
-                        - **📰 今日新聞**：`「今天有什麼重要新聞？」`
-                        - **🚨 地震報告**：`「最新的 CWA 顯著地震報告」` 或 `「最近全球有哪些大地震？」`
-                        - **📢 災害預警**：`「現在有地震��警嗎？」`
-
-                        ---
-
-                        #### 🔎 **進階地震查詢**
-                        您也可以指定日期與規模來查詢全球地震紀錄，請**完全依照以下格式**提問：
-                        - `查詢 2024-04-01 到 2024-04-07 規模 6.0 以上地震`
-                        """)
-
-                        custom_textbox = gr.Textbox(
-                            placeholder="對課程有什麼問題嗎？或查詢即時資訊...",
-                            show_label=False,
-                            container=False,
-                        )
-
-                        gr.ChatInterface(
-                            callbacks.ai_chatbot_with_kb,
-                            chatbot=gr.Chatbot(height=450, type="messages", avatar_images=(None, "https://www.google.com/images/branding/googlelogo/1x/googlelogo_color_272x92dp.png")),
-                            title="課程AI助教",
-                            description="由結構化知識庫與即時工具驅動的問答機器人",
-                            textbox=custom_textbox,
-                        )
-
-        # --- Connect Buttons to Backend Functions ---
+        # --- 按鈕的 click 事件定義也需要對應調整 ---
+        # 由於 map_run_button 和 seismo_run_button 仍在，所以這部分保留
         map_run_button.click(
             fn=lambda code: callbacks.execute_user_code(code, "地圖繪製"),
             inputs=[map_code],
@@ -148,5 +86,5 @@ def create_ui(visit_count_html: str, theme: gr.Theme):
             inputs=[seismo_code],
             outputs=[seismo_plot_output, seismo_console_output]
         )
-
+            
     return demo