13

app.py

@@ -2,335 +2,85 @@ import streamlit as st
 import pickle
 import requests
 from bs4 import BeautifulSoup
-import time
 
-# === Configuration ===
-st.set_page_config(
-    page_title="AllergenGuard - Deteksi Alergen Makanan",
-    page_icon="🛡️",
-    layout="wide",
-    initial_sidebar_state="expanded"
-)
-
-# === Custom CSS ===
-st.markdown("""
-<style>
-    .main-header {
-        text-align: center;
-        background: linear-gradient(90deg, #FF6B6B, #4ECDC4);
-        -webkit-background-clip: text;
-        -webkit-text-fill-color: transparent;
-        font-size: 3rem;
-        font-weight: bold;
-        margin-bottom: 0.5rem;
-    }
-    
-    .subtitle {
-        text-align: center;
-        color: #666;
-        font-size: 1.2rem;
-        margin-bottom: 2rem;
-    }
-    
-    .allergen-card {
-        background: white;
-        padding: 1.5rem;
-        border-radius: 15px;
-        box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
-        margin: 1rem 0;
-        border-left: 5px solid;
-    }
-    
-    .allergen-positive {
-        border-left-color: #FF4444;
-        background: linear-gradient(135deg, #FFE5E5, #FFF0F0);
-    }
-    
-    .allergen-negative {
-        border-left-color: #44AA44;
-        background: linear-gradient(135deg, #E5F5E5, #F0FAF0);
-    }
-    
-    .ingredient-list {
-        background: #F8F9FA;
-        padding: 1rem;
-        border-radius: 10px;
-        margin: 1rem 0;
-    }
-    
-    .model-info {
-        background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
-        color: white;
-        padding: 1rem;
-        border-radius: 10px;
-        margin: 1rem 0;
-    }
-    
-    .stats-container {
-        display: flex;
-        justify-content: space-around;
-        margin: 2rem 0;
-    }
-    
-    .stat-box {
-        text-align: center;
-        padding: 1rem;
-        background: white;
-        border-radius: 10px;
-        box-shadow: 0 2px 4px rgba(0,0,0,0.1);
-        min-width: 120px;
-    }
-    
-    .stat-number {
-        font-size: 2rem;
-        font-weight: bold;
-        color: #4ECDC4;
-    }
-    
-    .stat-label {
-        color: #666;
-        font-size: 0.9rem;
-    }
-</style>
-""", unsafe_allow_html=True)
-
-# === Load Functions ===
+# === Load TF-IDF Vectorizer ===
 @st.cache_resource
 def load_vectorizer():
-    try:
-        with open("saved_models/tfidf_vectorizer.pkl", "rb") as f:
-            return pickle.load(f)
-    except FileNotFoundError:
-        st.error("⚠️ File vectorizer tidak ditemukan. Pastikan file ada di folder saved_models/")
-        return None
+    with open("saved_models/tfidf_vectorizer.pkl", "rb") as f:
+        return pickle.load(f)
 
+# === Load Model Berdasarkan Nama ===
 @st.cache_resource
 def load_model(model_name):
-    try:
-        model_path = f"saved_models/{model_name}_model.pkl"
-        with open(model_path, "rb") as f:
-            return pickle.load(f)
-    except FileNotFoundError:
-        st.error(f"⚠️ Model {model_name} tidak ditemukan. Pastikan file ada di folder saved_models/")
-        return None
+    model_path = f"saved_models/{model_name}_model.pkl"
+    with open(model_path, "rb") as f:
+        return pickle.load(f)
 
+# === Prediksi ===
 def predict_allergen(model, vectorizer, input_text):
-    if model is None or vectorizer is None:
-        return None
     X_input = vectorizer.transform([input_text])
     prediction = model.predict(X_input)
     return prediction[0]
 
+# === Scraping bahan dari Cookpad ===
 def get_ingredients_from_cookpad(url):
-    headers = {"User-Agent": "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36"}
+    headers = {"User-Agent": "Mozilla/5.0"}
     try:
-        response = requests.get(url, headers=headers, timeout=10)
+        response = requests.get(url, headers=headers)
         if response.status_code != 200:
-            return None, f"Gagal mengambil halaman. Status code: {response.status_code}"
-        
+            return None, "Gagal mengambil halaman."
         soup = BeautifulSoup(response.text, "html.parser")
         ingredient_div = soup.find("div", class_="ingredient-list")
-        
         if not ingredient_div:
-            return None, "Tidak menemukan elemen bahan pada halaman tersebut."
-        
+            return None, "Tidak menemukan elemen bahan."
         ingredients = [item.get_text(strip=True) for item in ingredient_div.find_all("li")]
         return ingredients, None
-    except requests.RequestException as e:
-        return None, f"Terjadi kesalahan koneksi: {str(e)}"
     except Exception as e:
         return None, f"Terjadi kesalahan: {str(e)}"
 
-# === Header ===
-st.markdown('<h1 class="main-header">🛡️ AllergenGuard</h1>', unsafe_allow_html=True)
-st.markdown('<p class="subtitle">Sistem Deteksi Alergen Makanan Cerdas untuk Keamanan Pangan Anda</p>', unsafe_allow_html=True)
-
-# === Sidebar ===
-with st.sidebar:
-    st.markdown("### 📊 Informasi Aplikasi")
-    st.info("""
-    **AllergenGuard** menggunakan teknologi Machine Learning untuk mendeteksi 5 jenis alergen utama:
-    - 🥛 Susu
-    - 🥜 Kacang-kacangan  
-    - 🥚 Telur
-    - 🦐 Makanan Laut
-    - 🌾 Gandum
-    """)
-    
-    st.markdown("### 🤖 Model yang Tersedia")
-    model_info = {
-        "XGBoost": "Model ensemble dengan performa tinggi",
-        "KNN": "Model berbasis kedekatan data",
-        "Random Forest": "Model ensemble berbasis pohon keputusan"
-    }
-    
-    for model, desc in model_info.items():
-        st.markdown(f"**{model}**: {desc}")
-
-# === Main Content ===
-col1, col2 = st.columns([2, 1])
-
-with col1:
-    st.markdown("### 📝 Input Bahan Makanan")
-    
-    # Mode selection with better styling
-    input_mode = st.radio(
-        "Pilih metode input:",
-        ["✏️ Input Manual", "🔗 URL Cookpad"],
-        horizontal=True
-    )
-
-    input_text = ""
-    ingredients_list = []
-
-    if input_mode == "✏️ Input Manual":
-        input_text = st.text_area(
-            "Masukkan bahan makanan:",
-            height=120,
-            placeholder="Contoh: tepung gandum, telur ayam, susu sapi, udang segar, kacang tanah...",
-            help="Pisahkan setiap bahan dengan koma atau enter"
-        )
-        
-    elif input_mode == "🔗 URL Cookpad":
-        url = st.text_input(
-            "Masukkan URL resep Cookpad:",
-            placeholder="https://cookpad.com/id/resep/...",
-            help="Salin dan tempel URL resep dari Cookpad"
-        )
-        
-        if url and st.button("🔍 Ambil Bahan dari URL", type="secondary"):
-            with st.spinner("🔄 Mengambil data dari Cookpad..."):
-                time.sleep(1)  # Simulasi loading
-                ingredients_list, error = get_ingredients_from_cookpad(url)
-            
-            if error:
-                st.error(f"❌ {error}")
-            else:
-                st.success("✅ Berhasil mengambil bahan-bahan!")
-                st.markdown('<div class="ingredient-list">', unsafe_allow_html=True)
-                st.markdown("**Bahan yang ditemukan:**")
-                for i, item in enumerate(ingredients_list, 1):
-                    st.markdown(f"{i}. {item}")
-                st.markdown('</div>', unsafe_allow_html=True)
-                input_text = " ".join(ingredients_list)
-
-with col2:
-    st.markdown("### ⚙️ Pengaturan Model")
-    
-    model_name = st.selectbox(
-        "Pilih model prediksi:",
-        ("XGBoost", "KNN", "Random Forest"),
-        help="Setiap model memiliki karakteristik prediksi yang berbeda"
-    )
-    
-    # Model info display
-    st.markdown(f'<div class="model-info">', unsafe_allow_html=True)
-    st.markdown(f"**Model Aktif:** {model_name}")
-    st.markdown(f"**Status:** Ready to predict")
-    st.markdown('</div>', unsafe_allow_html=True)
-
-# === Prediction Section ===
-st.markdown("---")
-st.markdown("### 🎯 Hasil Prediksi")
-
-if st.button("🚀 Mulai Analisis Alergen", type="primary", use_container_width=True):
+# === Streamlit UI ===
+st.set_page_config(page_title="Deteksi Alergen Makanan", layout="centered")
+st.title("🥘 Deteksi Alergen Makanan dari Resep")
+st.markdown("Masukkan bahan makanan atau link Cookpad untuk mendeteksi kemungkinan kandungan alergen.")
+
+# Pilihan input: manual atau dari URL
+input_mode = st.radio("Pilih metode input:", ["Manual", "Cookpad URL"])
+
+# Input berdasarkan mode
+input_text = ""
+if input_mode == "Manual":
+    input_text = st.text_area("📝 Masukkan bahan makanan (contoh: bubuk cabai, tepung gandum, telur ayam)", height=150)
+elif input_mode == "Cookpad URL":
+    url = st.text_input("🔗 Masukkan URL resep dari Cookpad", placeholder="https://cookpad.com/id/resep/...")
+    if url:
+        with st.spinner("Mengambil data dari Cookpad..."):
+            ingredients, error = get_ingredients_from_cookpad(url)
+        if error:
+            st.error(error)
+        else:
+            st.success("Berhasil mengambil bahan-bahan:")
+            for item in ingredients:
+                st.markdown(f"- {item}")
+            input_text = " ".join(ingredients)
+
+# Pilih model
+model_name = st.selectbox("🤖 Pilih Model", ("XGBoost", "KNN", "Random Forest"))
+
+# Tombol prediksi
+if st.button("🔍 Prediksi Alergen"):
     if not input_text.strip():
-        st.warning("⚠️ Mohon masukkan bahan makanan terlebih dahulu.")
+        st.warning("Mohon masukkan atau ambil bahan makanan terlebih dahulu.")
     else:
-        # Progress bar
-        progress_bar = st.progress(0)
-        status_text = st.empty()
-        
-        # Loading simulation
-        status_text.text("🔄 Memuat vectorizer...")
-        progress_bar.progress(25)
-        vectorizer = load_vectorizer()
-        
-        status_text.text("🔄 Memuat model...")
-        progress_bar.progress(50)
-        model = load_model(model_name)
-        
-        status_text.text("🔄 Menganalisis bahan...")
-        progress_bar.progress(75)
-        
-        if vectorizer is not None and model is not None:
+        with st.spinner("Sedang memuat model dan memproses prediksi..."):
+            vectorizer = load_vectorizer()
+            model = load_model(model_name)
             pred = predict_allergen(model, vectorizer, input_text)
-            progress_bar.progress(100)
-            status_text.text("✅ Analisis selesai!")
-            
-            time.sleep(0.5)
-            progress_bar.empty()
-            status_text.empty()
-            
-            # Results display
             labels = ['Susu', 'Kacang', 'Telur', 'Makanan Laut', 'Gandum']
-            allergen_icons = ['🥛', '🥜', '🥚', '🦐', '🌾']
             results = dict(zip(labels, pred))
-            
-            # Statistics
-            total_allergens = len(labels)
-            detected_allergens = sum(pred)
-            safe_allergens = total_allergens - detected_allergens
-            
-            col1, col2, col3 = st.columns(3)
-            with col1:
-                st.markdown(f"""
-                <div class="stat-box">
-                    <div class="stat-number">{total_allergens}</div>
-                    <div class="stat-label">Total Dianalisis</div>
-                </div>
-                """, unsafe_allow_html=True)
-            
-            with col2:
-                st.markdown(f"""
-                <div class="stat-box">
-                    <div class="stat-number" style="color: #FF4444;">{detected_allergens}</div>
-                    <div class="stat-label">Terdeteksi</div>
-                </div>
-                """, unsafe_allow_html=True)
-            
-            with col3:
-                st.markdown(f"""
-                <div class="stat-box">
-                    <div class="stat-number" style="color: #44AA44;">{safe_allergens}</div>
-                    <div class="stat-label">Aman</div>
-                </div>
-                """, unsafe_allow_html=True)
-            
-            st.markdown("#### 📋 Detail Hasil:")
-            
-            # Results cards
-            for i, (allergen, status) in enumerate(results.items()):
-                icon = allergen_icons[i]
-                if status == 1:
-                    st.markdown(f"""
-                    <div class="allergen-card allergen-positive">
-                        <h4>⚠️ {icon} {allergen}</h4>
-                        <p><strong>Status:</strong> <span style="color: #FF4444;">TERDETEKSI</span></p>
-                        <p>Makanan ini kemungkinan mengandung alergen {allergen.lower()}. Harap berhati-hati jika Anda memiliki alergi terhadap {allergen.lower()}.</p>
-                    </div>
-                    """, unsafe_allow_html=True)
-                else:
-                    st.markdown(f"""
-                    <div class="allergen-card allergen-negative">
-                        <h4>✅ {icon} {allergen}</h4>
-                        <p><strong>Status:</strong> <span style="color: #44AA44;">AMAN</span></p>
-                        <p>Tidak terdeteksi kandungan alergen {allergen.lower()} dalam bahan yang dianalisis.</p>
-                    </div>
-                    """, unsafe_allow_html=True)
-            
-            # Disclaimer
-            st.markdown("---")
-            st.warning("""
-            ⚠️ **Disclaimer**: Hasil prediksi ini bersifat estimasi berdasarkan model machine learning. 
-            Untuk kepastian yang akurat, selalu konsultasikan dengan ahli gizi atau baca label produk dengan teliti.
-            """)
 
-# === Footer ===
-st.markdown("---")
-st.markdown("""
-<div style="text-align: center; color: #666; padding: 2rem;">
-    <p>🛡️ <strong>AllergenGuard</strong> - Melindungi Anda dari Alergen Makanan</p>
-    <p>Dikembangkan dengan ❤️ menggunakan Streamlit dan Machine Learning</p>
-</div>
-""", unsafe_allow_html=True)
+        st.success("✅ Hasil Prediksi:")
+        for allergen, status in results.items():
+            if status == 1:
+                st.error(f"⚠️ Mengandung {allergen}")
+            else:
+                st.info(f"Tidak mengandung {allergen}")