Update app.py

app.py

@@ -81,4 +81,233 @@ ax.set_title('Slice Selection Simulation')
 ax.legend()
 ax.grid(True)
 
-st.pyplot(fig)
+st.pyplot(fig)
+
+import streamlit as st
+import numpy as np
+import scipy.io
+import gdown
+import matplotlib.pyplot as plt
+import os
+
+# ตั้งค่าหน้าเว็บ (ต้องอยู่บนสุดเสมอ)
+st.set_page_config(page_title="MRI Physics & Simulator", layout="wide")
+
+# ==========================================
+# ส่วนฟังก์ชันโหลดข้อมูลของอาจารย์
+# ==========================================
+@st.cache_resource
+def load_vobj():
+    output = 'BrainHighResolution.mat'
+    if not os.path.exists(output):
+        file_id = '1vdV5xDNfAiHvmKuH5DPi1YJ5Ptl927nk'
+        gdown.download(f'https://drive.google.com/uc?id={file_id}', output, quiet=True)
+    try:
+        data = scipy.io.loadmat(output)
+        v = data['VObj'][0,0]
+        mid = v['T2'].shape[2] // 2
+        return {
+            'rho': v['Rho'][:,:,mid],
+            't1': v['T1'][:,:,mid] * 1000,  # s -> ms
+            't2': v['T2'][:,:,mid] * 1000,  # s -> ms
+        }
+    except:
+        return None
+
+# ==========================================
+# เริ่มต้นหน้าเว็บ (แบ่ง Tabs)
+# ==========================================
+st.title("🧠 MRI Physics & Image Formation")
+st.markdown("---")
+
+tab1, tab2, tab3 = st.tabs([
+    "📍 3. Image Formation & K-space", 
+    "🌊 4. Basic Pulse Sequences", 
+    "🕹️ Simulator ภาพสมอง (TR/TE/TI)"
+])
+
+# ==========================================
+# TAB 1: Image Formation & K-space
+# ==========================================
+with tab1:
+    st.header("**3. การเข้ารหัสในแนวความถี่และแนวเฟส (Frequency and Phase encoding)**")
+    st.write("หลังจากที่เลือกตำแหน่งสไลซ์ในแนวแกน Z โดยการใช้สนามแม่เหล็กเกรเดียนท์ Gz เรียบร้อยแล้ว สปินในแนวระนาบ Y และ X ยังคงมีความถี่และมีเฟสเหมือนกัน[cite: 6]")
+    st.write("ในการสร้างภาพเอ็มอาร์ไอแบบสองมิติ จำเป็นต้องใช้สนามแม่เหล็กเกรเดียนท์ Gx และ Gy และให้ความถี่และเฟสของสปินมีค่าแตกต่างกันในตำแหน่งต่างๆ[cite: 6]")
+    
+    st.markdown('<p style="color:red;"><b>Interactive Part:</b></p>', unsafe_allow_html=True)
+    st.markdown('<p style="color:red;">- ระนาบ X เป็นแนวความถี่ Frequency</p>', unsafe_allow_html=True)
+    st.markdown('<p style="color:red;">- ระนาบ Y เป็นแนวเฟส Phase (เกรเดียนท์ Gy จะเปลี่ยนขนาดแอมปลิจูดหลายค่า เริ่มจากลบไปบวก หรือบวกลงลบ)</p>', unsafe_allow_html=True)
+    
+    st.markdown("---")
+    
+    st.header("**4. พิกัด k-space แบบสองมิติ (2 dimension coordinates of k-space)**")
+    st.write("การใช้ Gx และ Gy ในการเข้ารหัสสัญญาณ เสมือนเป็นการสร้างพิกัดขึ้นมา เพื่อให้สปินที่มีความถี่และเฟสจำเพาะเข้าไปเติมในพิกัดนั้นๆ ใน k-space โดยมีลำดับดังนี้:[cite: 6]")
+    st.write("• **ตำแหน่ง A:** ช่วงเวลาที่ Gx และ Gy เริ่มทำงาน (สัมพันธ์กับจุดกึ่งกลางของ kx และ ky)[cite: 6]")
+    st.write("• **ตำแหน่ง B:** เริ่มบันทึกข้อมูลจุดแรก ของเฟสแถวที่ 1[cite: 6]")
+    st.write("• **ตำแหน่ง C:** บันทึกข้อมูลได้ครึ่งหนึ่ง ของเฟสแถวที่ 1[cite: 6]")
+    st.write("• **ตำแหน่ง D:** บันทึกข้อมูลได้ครบถ้วน ของเฟสแถวที่ 1[cite: 6]")
+    st.write("หลังจากนั้นเริ่มต้นที่ตำแหน่ง A B C D อีกครั้ง แต่เป็นเฟสแถวที่ 2, 3, 4 ไปเรื่อยๆ จนถึงเฟสแถวที่ M ถือเป็นการจบกระบวนการเก็บข้อมูลสองมิติ[cite: 6]")
+
+    st.markdown('<p style="color:red;"><b>Interactive Part: K-space to MRI Image</b></p>', unsafe_allow_html=True)
+    st.markdown('<p style="color:red;">[จำลอง] แบ่งหน้าจอเป็น 2 ฝั่ง ซ้ายคือ "K-space" ขวาคือ "Image" (รูปสมองค่อยๆ ชัดขึ้นเมื่อเติมเส้น K-space)</p>', unsafe_allow_html=True)
+
+# ==========================================
+# TAB 2: Basic Pulse Sequences
+# ==========================================
+with tab2:
+    st.header("**1. Spin Echo**")
+    
+    # a. Conventional Spin Echo
+    st.subheader("**a. Spin Echo**")
+    st.write("ทำการกระตุ้นสปินด้วย 90° RF pulse ณ ตำแหน่งสไลซ์ที่เลือก[cite: 6]")
+    st.write("เมื่อเวลาผ่านไป $TE/2$ จะทำการกลับเฟสของสปินด้วย 180° RF pulse (Refocusing pulse) จะเกิดการรวมเฟสของสปินที่เวลา TE ซึ่งเป็นเวลาที่สัญญาณมีค่าสูงสุด (Echo signal)[cite: 6]")
+    st.write("เวลาระหว่าง 90° RF pulse สองอัน เรียกว่า TR[cite: 6]")
+    
+    # b. Fast Spin Echo
+    st.subheader("**b. Fast Spin Echo**")
+    st.write("เพิ่มคลื่น 180° (Refocusing pulse) หลายๆ ครั้งภายใน 1 TR ทำให้สามารถเก็บข้อมูล Echo ได้หลายเส้นในครั้งเดียว เรียกว่า Echo Train Length (ETL) ซึ่งช่วยลดเวลาสแกน[cite: 6]")
+    
+    # Interactive FSE
+    st.markdown('<div style="background-color:#ffebee; padding:15px; border-radius:10px;">', unsafe_allow_html=True)
+    st.markdown('<h4 style="color:#c62828; margin-top:0;">Interactive Scan Time Calculator</h4>', unsafe_allow_html=True)
+    st.write("ทดลองคำนวณเวลาการสแกนแบบ Fast Spin Echo")
+    col1, col2, col3 = st.columns(3)
+    with col1:
+        tr_val = st.number_input("TR (ms)", value=500, step=100)
+    with col2:
+        np_val = st.number_input("N-phase (จำนวน Phase)", value=256, step=64)
+    with col3:
+        etl_val = st.select_slider("Echo Train Length (ETL)", options=[1, 4, 8, 16], value=4)
+    
+    scan_time_base = (tr_val * np_val) / 1000  # แปลงเป็นวินาที
+    scan_time_fse = scan_time_base / etl_val
+    st.markdown(f'<p style="color:#c62828;"><b>เวลาสแกนลดลง {etl_val} เท่า!</b> (จาก {scan_time_base:.1f} วินาที ➡️ เหลือเพียง <b>{scan_time_fse:.1f} วินาที</b>)</p>', unsafe_allow_html=True)
+    st.markdown('</div><br>', unsafe_allow_html=True)
+
+    # d. Inversion Recovery
+    st.subheader("**d. Inversion Recovery (IR)**")
+    st.write("ลำดับพัลส์พิเศษที่เริ่มต้นด้วยการยิงคลื่น 180° เพื่อกลับทิศทางของแกนแม่เหล็กให้ติดลบ จากนั้นเครื่องจะรอเป็นเวลาที่เรียกว่า TI (Inversion Time) ก่อนยิงคลื่น 90° เพื่อกดสัญญาณเนื้อเยื่อบางชนิด[cite: 6]")
+    
+    # Interactive IR (STIR vs FLAIR)
+    st.markdown('<div style="background-color:#e8eaf6; padding:15px; border-radius:10px;">', unsafe_allow_html=True)
+    st.markdown('<h4 style="color:#283593; margin-top:0;">Interactive TI Slider (โหมดจำลองการกดสัญญาณ)</h4>', unsafe_allow_html=True)
+    ti_sim = st.slider("เลื่อนปรับค่า Inversion Time (TI) [ms]", 100, 3000, 150, step=50)
+    
+    if 100 <= ti_sim <= 200:
+        st.success("**โหมด STIR (Short Tau Inversion Recovery):** เป็นเทคนิคการกดสัญญาณไขมัน (Fat suppression) ทำให้ไขมันในภาพกลายเป็นสีดำ[cite: 6]")
+    elif 2000 <= ti_sim <= 2600:
+        st.warning("**โหมด FLAIR (Fluid Attenuated Inversion Recovery):** เป็นเทคนิคการกดสัญญาณน้ำไขสันหลัง (CSF) ทำให้ภาพสมองเห็นรอยโรคชัดเจนขึ้นโดยไม่มีสีขาวของน้ำมาบัง[cite: 6]")
+    else:
+        st.info("กำลังอยู่ในช่วงเวลาพัก (TI ทั่วไป) - เนื้อเยื่อกำลังทยอยฟื้นตัวกลับสู่แกนตั้ง")
+    st.markdown('</div><br>', unsafe_allow_html=True)
+
+    st.markdown("---")
+    
+    st.header("**2. Gradient Echo**")
+    st.subheader("**a. Conventional Gradient Echo**")
+    st.write("กระตุ้นสปินด้วย 90° (หรือน้อยกว่า) จากนั้นเร่งให้สปินแตกเฟสโดยใช้ GFE ค่าลบ และตามด้วย GFE ค่าบวก เมื่อพื้นที่ลบและบวกรวมกันเป็นศูนย์จะเกิดการรวมเฟส (Echo signal) โดยไม่ต้องใช้คลื่น 180°[cite: 6]")
+    
+    st.subheader("**b. Fast Gradient Echo & SSFP**")
+    st.write("เมื่อ TR สั้นมากจนสั้นกว่า T2 ($TR \ll T2$) หางของสัญญาณ FID และ Echo จะรวมกัน (Merge) กลายเป็นสัญญาณที่ต่อเนื่องกัน เรียกว่าสภาวะ Steady-State Free Precession (SSFP)[cite: 6]")
+
+
+# ==========================================
+# TAB 3: MRI Simulator (Professor's Code)
+# ==========================================
+with tab3:
+    st.markdown('<h2 style="font-size:30px; text-align:center;">🧠 โปรแกรมจำลองภาพ MRI (T1, T2, FLAIR)</h2>', unsafe_allow_html=True)
+    
+    v = load_vobj()
+
+    if v is not None:
+        rho = np.nan_to_num(v['rho'])
+        t1  = np.nan_to_num(v['t1'])  
+        t2  = np.nan_to_num(v['t2'])  
+
+        T1_CSF = 2569.0  
+
+        t1_safe = np.where(t1 <= 0, 1e10, t1)
+        t2_safe = np.where(t2 <= 0, 1e-10, t2)
+
+        # จำลอง Sidebar มาไว้ในคอลัมน์ซ้ายเพื่อให้เข้ากับ Tab UI
+        col_ctrl, col_img = st.columns([1, 2])
+        
+        with col_ctrl:
+            st.markdown("### 🕹️ Parameters Settings")
+            sequence = st.selectbox("เลือก Sequence", ["T1-Weighted", "T2-Weighted", "FLAIR"])
+
+            tr_ms = st.slider("TR (ms)", 100, 10000, 600 if sequence == "T1-Weighted" else 9000, step=100)
+            te_ms = st.slider("TE (ms)", 10, 200, 15 if sequence == "T1-Weighted" else 80, step=5)
+            
+            ti_ms = None
+            if sequence == "FLAIR":
+                ti_null = int(T1_CSF * np.log(2.0 / (1.0 + np.exp(-tr_ms / T1_CSF))))
+                ti_ms = st.slider(f"TI (ms) [CSF null = {ti_null} ms]", 100, 4000, ti_null, step=25)
+
+        with col_img:
+            # คำนวณสัญญาณ
+            if sequence == "T1-Weighted":
+                signal  = rho * (1 - np.exp(-tr_ms / t1_safe)) * np.exp(-te_ms / t2_safe)
+                caption = f"T1-Weighted  |  TR = {tr_ms} ms, TE = {te_ms} ms"
+            elif sequence == "T2-Weighted":
+                signal  = rho * (1 - np.exp(-tr_ms / t1_safe)) * np.exp(-te_ms / t2_safe)
+                caption = f"T2-Weighted  |  TR = {tr_ms} ms, TE = {te_ms} ms"
+            else:
+                raw    = rho * (1 - 2*np.exp(-ti_ms / t1_safe) + np.exp(-tr_ms / t1_safe)) * np.exp(-te_ms / t2_safe)
+                signal = np.clip(raw, 0, None)
+                caption = f"FLAIR  |  TR = {tr_ms} ms, TE = {te_ms} ms, TI = {ti_ms} ms"
+
+            st.markdown(f'<p style="font-size:18px; font-weight:bold; text-align:center;">{caption}</p>', unsafe_allow_html=True)
+            
+            fig, ax = plt.subplots(figsize=(6, 6))
+            ax.imshow(signal, cmap='gray')
+            ax.axis('off')
+            fig.tight_layout()
+            st.pyplot(fig)
+            plt.close(fig)
+
+        st.divider()
+        st.markdown('<h2 style="font-size:22px;">📖 คำอธิบายทางทฤษฎี & กราฟ</h2>', unsafe_allow_html=True)
+
+        TISSUES = {
+            'CSF':          {'T1': 2569, 'T2': 329, 'color': '#2196F3'},
+            'Gray Matter':  {'T1': 833,  'T2': 83,  'color': '#9C27B0'},
+            'White Matter': {'T1': 500,  'T2': 70,  'color': '#FF9800'},
+        }
+
+        col_g1, col_g2 = st.columns(2)
+        
+        with col_g1:
+            st.markdown('<b style="font-size:16px;">T1 Recovery Curve</b>', unsafe_allow_html=True)
+            t_rec = np.linspace(0, 10000, 1000)
+            fig1, ax1 = plt.subplots(figsize=(5, 3))
+            for name, p in TISSUES.items():
+                ax1.plot(t_rec, 1 - np.exp(-t_rec / p['T1']), color=p['color'], lw=2, label=f"{name}")
+            ax1.axvline(tr_ms, color='red', lw=1.5, ls='--', label=f'TR = {tr_ms}')
+            ax1.set_xlabel('TR (ms)')
+            ax1.set_ylabel('Mz / M0')
+            ax1.legend(fontsize=8)
+            ax1.grid(alpha=0.3)
+            ax1.set_ylim(0, 1.05)
+            ax1.set_xlim(0, 10000)
+            st.pyplot(fig1)
+            plt.close(fig1)
+
+        with col_g2:
+            st.markdown('<b style="font-size:16px;">T2 Decay Curve</b>', unsafe_allow_html=True)
+            t_dec = np.linspace(0, 1200, 1000)
+            fig2, ax2 = plt.subplots(figsize=(5, 3))
+            for name, p in TISSUES.items():
+                ax2.plot(t_dec, np.exp(-t_dec / p['T2']), color=p['color'], lw=2, label=f"{name}")
+            ax2.axvline(te_ms, color='red', lw=1.5, ls='--', label=f'TE = {te_ms}')
+            ax2.set_xlabel('TE (ms)')
+            ax2.set_ylabel('Mxy / M0')
+            ax2.legend(fontsize=8)
+            ax2.grid(alpha=0.3)
+            ax2.set_ylim(0, 1.05)
+            ax2.set_xlim(0, 1200)
+            st.pyplot(fig2)
+            plt.close(fig2)
+
+    else:
+        st.error("Error loading VObj data. (ตรวจดูการเชื่อมต่ออินเทอร์เน็ตสำหรับการโหลดไฟล์ครั้งแรกครับ)")