Update app.py

app.py

@@ -67,55 +67,72 @@ def send_line_notification_in_background(message_text):
 count = get_and_update_visits()
 visit_count_html = f"🚀 **總載入次數:** {count}"
 
-# --- 1. 各區塊的 Markdown 內容 ---
+# --- 1. 各區塊的 Markdown 內容 (優化後) ---
 course_introduction_md = """
-# 探索地球的脈動：用程式與AI解碼地球奧秘
-**課程網頁 (Hugging Face Space)**
+# 🌍 探索地球的脈動：用程式與AI解碼地球奧秘
 
 ### 引言：讓數據為地球發聲
 
-地球的語言，是用數據寫成的詩篇——隱藏在地震波的起伏、重力場的微擾與磁場的變動之中。要讀懂這首詩，我們需要成為同時精通**地球科學**與**數據科學**的雙語人才。本課程的唯一目標，就是賦予您這樣的雙核心能力。
+地球的語言，是用數據寫成的詩篇——隱藏在地震波的起伏、重力場的微擾與磁場的變動之中。
 
-我們的學習路徑建立在相輔相成的兩大支柱之上：
+要讀懂這首詩，我們需要成為同時精通 **地球科學** 與 **數據科學** 的雙語人才。本課程的唯一目標，就是賦予您這樣的 **雙核心能力**。
 
-1.  **科學思維的建立 (理論)**：我們將系統性地學習地球物理學的核心理論，從**折射/重力探勘**的原理，到**板塊構造**的宏觀視野，並透過野外實習，讓您了解真實世界的數據從何而來。這將是您提出深刻科學問題的基礎。
+我們的學習路徑，建立在相輔相成的兩大支柱之上：
 
-2.  **技術工具的打磨 (實務)**：我們將帶您從零開始，親手打造一套現代化的數據分析工具箱。您將學會使用 `Python` 與 `Git` 進行高效開發，利用 **`PyGMT`** 與 **`ObsPy`** 將複雜數據轉為專業圖表，並透過 **`Gradio`** 與 **`Hugging Face Spaces`** 將您的成果打造成互動網頁應用，分享給全世界。
+- **🧠 科學思維的建立 (理論)**：我們將系統性地學習地球物理學的核心理論，從 **折射/重力探勘** 的原理，到 **板塊構造** 的宏觀視野，並透過野外實習，讓您了解真實世界的數據從何而來。這將是您提出深刻科學問題的基礎。
 
-在這趟旅程中，您將最終學會如何運用 **`Gemini`** 與 **`Dify`** 等 AI 工具，為您的應用注入智慧，讓機器幫助我們更深入地解碼數據中的奧秘。
+- **💻 技術工具的打磨 (實務)**：我們將帶您從零開始，親手打造一套現代化的數據分析工具箱。您將學會使用 `Python` 與 `Git`，利用 **`PyGMT`** 與 **`ObsPy`** 將複雜數據轉為專業圖表，並透過 **`Gradio`** 將您的成果打造成互動網頁應用，分享給全世界。
 
-這不只是一門課，而是成為一名能夠獨立提出問題、分析數據、創造工具並有效溝通的新世代地球科學家的完整訓練。歡迎您加入我們，一起探索地球的脈動！
+在這趟旅程中，您更將學會運用 **`Gemini`** 等 AI 工具，為您的應用注入智慧，讓機器幫助我們更深入地解碼數據中的奧秘。
+
+> 這不只是一門課，而是一場成為 **新世代地球科學家** 的完整訓練。歡迎您加入我們，一起探索地球的脈動！
 """
+
 course_goals_md = """
 ### 課程目標：從學習者到實踐者，打造你的「地球科學 x 數據科學」雙核心能力
-本課程旨在引導您完成一趟從理論知識到動手實踐的完整旅程。在學期結束後，您將具備以下兩大面向的核心能力：
+
+本課程旨在引導您完成一趟從理論知識到動手實踐的完整旅程。學期結束後，您將具備以下兩大面向的核心能力：
+
 ---
-### 一、 深入地球之心：核心地球物理學識
-您將不再只是記憶名詞，而是能用物理原理**洞悉**地球的運作模式。
-* **掌握關鍵探勘技術的物理原理**
-    * **折射震測**：您將能設計觀測陣列，並從震波走時曲線中，解讀出地下的速度分層結構。
-    * **重力探勘**：您將能分析重力異常圖，並指出高密度或低密度異常體可能對應的地質意義。
-* **建立宏觀的板塊構造世界觀**
-    * 您將能**闡述**地震、火山、地磁、地熱等地質活動背後，由板塊運動所驅動的統一機制。
-* **連結理論與真實世界**
-    * 透過專題演講接觸業界的最新發展，並在**校園野外實習**中，親手敲下震源、收集數據，完整體驗從數據採集到解釋的地球物理工作流程。
-### 二、 駕馭數據之力：全方位的程式設計技能
-您將學會一套現代化的數據科學工作流程，能獨立完成從數據處理到成果發表的完整專案。
-* **奠定穩固的開發基石：現代化開發流程**
-    * 您將熟練使用 `Python` 進行科學計算，並利用 `Git/GitHub` 進行版本控制，實現高效的團隊協作與專案管理。
-    * 您將能在 `Colab` 與 `GitHub Spaces` 等雲端環境中無縫切換，隨時隨地進行開發。
-* **實現專業的科學��據可視化**
-    * 您將精通 **`PyGMT`**，繪製出專業、資訊豐富、達到出版品質的地理圖件，將空間數據化為引人入勝的故事。
-    * 您將嫻熟 **`ObsPy`**，能從原始的地震波形資料中进行濾波、訊號分析，並提取出地震事件的關鍵訊息。
-* **打造吸睛的互動式網頁應用**
-    * 您將掌握 **`Gradio`** 與 **`Streamlit`**，能將您的分析成果或模型，快速封裝成任何人都能透過瀏覽器操作的 Web App。
-    * 您將學會將作品**免費部署**於 **`Hugging Face Spaces`**，建立屬於您自己的線上作品集，向世界分享您的成果。
-* **賦能 AI，讓你的應用更智慧**
-    * 您將學會如何申請並串接 **`Gemini API`**，讓您的程式具備強大的自然語言理解與生成能力。
-    * 您將能透過 **`Dify`** 平台，快速建構出能回答複雜問題、甚至能操作工具的 AI 智能體。
+
+### 🧠 第一核心：深入地球之心 (地球物理學識)
+*您將不再只是記憶名詞，而是能用物理原理 **洞悉** 地球的運作模式。*
+
+#### 🔹 掌握關鍵探勘技術
+- **折射震測**：您將能 **設計** 觀測陣列，並從震波走時曲線中，**解讀** 出地下的速度分層結構。
+- **重力探勘**：您將能 **分析** 重力異常圖，並 **指出** 高/低密度異常體可能對應的地質意義。
+
+#### 🔹 建立宏觀的板塊構造世界觀
+- 您將能 **闡述** 地震、火山、地磁、地熱等地質活動背後，由板塊運動所驅動的統一機制。
+
+#### 🔹 連結理論與真實世界
+- 透過 **業界專家演講** 接觸最新發展，並在 **校園野外實習** 中，親手操作儀器、收集數據，完整體驗從採集到解釋的工作流程。
+
 ---
-> **最終，本課程的目標是讓您成為一位不僅懂地球物理的科學家，更是一位能用數據解決問題的工程師。您將帶著走的，是一套能夠自主學習、獨立完成專案的跨領域核心能力。**
+
+### 💻 第二核心：駕馭數據之力 (全方位程式設計)
+*您將學會一套現代化的數據科學工作流程，能 **獨立完成** 從數據處理到成果發表的完整專案。*
+
+#### 🔹 奠定穩固的開發基石
+- **`Python` 與 `Git/GitHub`**: 您將能熟練運用於科學計算與版本控制，實現高效的團隊協作。
+- **雲端開發環境**: 您將能在 `Colab` 與 `GitHub Codespaces` 等環境中無縫切換，隨時隨地進行開發。
+
+#### 🔹 實現專業的科學數據可視化
+- **`PyGMT`**: 您將能精通繪製 **出版品質** 的專業地理圖件，將空間數據化為引人入勝的故事。
+- **`ObsPy`**: 您將能嫻熟地從原始地震波形中 **濾波、分析**，並提取出關鍵訊息。
+
+#### 🔹 打造吸睛的互動式網頁應用
+- **`Gradio` 與 `Streamlit`**: 您將能快速將分析成果封裝成 **Web App**，讓任何人都能透過瀏覽器操作。
+- **`Hugging Face Spaces`**: 您將學會將作品 **免費部署** 於雲端，建立屬於您自己的線上作品集。
+
+#### 🔹 賦能 AI，讓應用更智慧
+- **`Gemini API`**: 您將學會串接強大的大型語言模型，讓您的程式具備自然語言理解與生成能力。
+- **`Dify`**: 您將能透過平台快速建構出能回答複雜問題、甚至能操作工具的 AI 智能體。
+
+---
+> **🚀 總結：本課程的目標是讓您成為一位不僅懂地球物理的科學家，更是一位能用數據解決問題的工程師。您將帶著走的，是一套能夠自主學習、獨立完成專案的跨領域核心能力。**
 """
+
 grading_policy_md = """
 ### 成績計算方式
 * **作業 (50%)**: 包含課程中指派的各項實作任務，例如程式碼練習、數據分析報告、Colab筆記本繳交、以及GitHub Repo的更新紀錄等。這是評量您動手實踐能力的主要依據。
@@ -276,7 +293,7 @@ def ai_chatbot_with_kb(message, history):
             if keyword in user_message: return item['answer']
     return "這個問題很有趣，不過我的知識庫目前還沒有收錄相關的答案。您可以試著問我關於**課程評分、Anaconda安裝、Colab與Codespaces的差別、什麼是API，或者期末專題的靈感**等問題！"
 
-# --- 4. 使用 Gradio 建立使用者介面 ---
+# --- 4. 使用 Gradio 建立使用者介面 (佈局修改後) ---
 with gr.Blocks(theme=gr.themes.Soft(primary_hue="blue", secondary_hue="orange"), title="地球物理學與AI應用") as demo:
     gr.Markdown(visit_count_html)
     gr.Markdown(course_introduction_md)
@@ -314,26 +331,28 @@ with gr.Blocks(theme=gr.themes.Soft(primary_hue="blue", secondary_hue="orange"),
                         seismo_plot_output = gr.Plot(label="震波圖輸出")
                         seismo_console_output = gr.Textbox(label="執行結果 / 錯誤訊息", lines=8, interactive=False)
 
-            with gr.Accordion("🤖 AI 課程助教 (知識庫強化版)", open=False):
-                gr.Markdown("我內建了更豐富的課程知識庫，試著問�� **「如何安裝Python環境？」**、**「什麼是版本控制？」** 或 **「給我一些期末專題的靈感」**")
-                gr.ChatInterface(
-                    ai_chatbot_with_kb,
-                    chatbot=gr.Chatbot(height=350, type="messages", avatar_images=(None, "https://www.google.com/images/branding/googlelogo/1x/googlelogo_color_272x92dp.png")),
-                    title="課程AI助教",
-                    description="由結構化知識庫驅動的問答機器人"
-                )
-
-            # --- 連接按鈕與後端執行函式 ---
-            map_run_button.click(
-                fn=lambda code: execute_user_code(code, "地圖繪製"),
-                inputs=[map_code],
-                outputs=[map_plot_output, map_console_output]
-            )
-            seismo_run_button.click(
-                fn=lambda code: execute_user_code(code, "震波圖"),
-                inputs=[seismo_code],
-                outputs=[seismo_plot_output, seismo_console_output]
+        # --- 新增的獨立 AI 助教分頁 ---
+        with gr.TabItem("🤖 AI 課程助教"):
+            gr.Markdown("### 🤖 AI 課程助教 (知識庫強化版)")
+            gr.Markdown("我內建了豐富的課程知識庫，試著問我 **「如何安裝Python環境？」**、**「什麼是版本控制？」** 或 **「給我一些期末專題的靈感」**")
+            gr.ChatInterface(
+                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="由結構化知識庫驅動的問答機器人"
             )
+
+    # --- 連接按鈕與後端執行函式 ---
+    map_run_button.click(
+        fn=lambda code: execute_user_code(code, "地圖繪製"),
+        inputs=[map_code],
+        outputs=[map_plot_output, map_console_output]
+    )
+    seismo_run_button.click(
+        fn=lambda code: execute_user_code(code, "震波圖"),
+        inputs=[seismo_code],
+        outputs=[seismo_plot_output, seismo_console_output]
+    )
             
 # --- 5. 啟動應用程式 ---
 demo.launch()