update interface

.gitignore

@@ -0,0 +1 @@
+__pycache__/

app.py

@@ -1,122 +1,300 @@
 import gradio as gr
-import tensorflow as tf
+import cv2
+import os
+
 from modules.binary_classification import binary_classification as binary
 from modules.image_classification import image_classification as image
 from modules.multilabel_classification import multi_classification as multi
 from modules.retina import predict_diabetic_retinopathy as retina_detector
-import cv2
+
+# -------------------------------------------------------------
 
 def binary_classification(text):
-    if(text != ''):
+    if text.strip():
         return binary(text)
-    else:
-        raise gr.Error('Il testo è obbligatorio!')
+    raise gr.Error('Il testo è obbligatorio!')
 
 def multi_classification(text):
-    if(text != ''):
+    if text.strip():
         try:
             return multi(text)
-        except:
-            raise gr.Error('La lingua del testo non corrisponde alla lingua del modello!')
-    else:
-        raise gr.Error('Il testo è obbligatorio!')  
-    
+        except Exception as e:
+            raise gr.Error(f'Errore nel modello: {str(e)}')
+    raise gr.Error('Il testo è obbligatorio!')  
+
 def file_change(file):
     if isinstance(file, list):
         file = file[0]
-        
     if file:
-        image = cv2.imread(file)
-        return image
+        return cv2.imread(file)
     return None
 
 def image_classification(img):
-    try:
+    if img is not None:
         return image(img)
-    except:
-        raise gr.Error('L\'immagine è obbligatoria!')
-
-def file_change_dr(file):
-    return file
+    raise gr.Error('L\'immagine è obbligatoria!')
 
 def retina_classification(retina):
-    try:
+    if retina is not None:
         return retina_detector(retina)
-    except:
-        raise gr.Error('L\'immagine è obbligatoria!')
-        
-with gr.Blocks() as demo:
-    gr.Markdown("# NGT AI Platform")
+    raise gr.Error('L\'immagine è obbligatoria!')
+
+# --- CONFIGURAZIONE TEMA ---
+theme = gr.themes.Soft(
+    primary_hue="purple", 
+    neutral_hue="slate",
+    font=[gr.themes.GoogleFont("Inter"), "ui-sans-serif", "system-ui", "sans-serif"],
+).set(
+    block_title_text_weight="700",
+    block_shadow="*shadow_drop_lg",
+    button_shadow="*shadow_drop_lg",
+    block_label_background_fill="*primary_100", 
+)
+
+custom_css = """
+/* --- 1. HEADER & LOGO --- */
+.header-row {
+    display: flex !important;
+    align-items: flex-end !important;
+    gap: 20px !important;
+    margin-bottom: 30px !important;
+    padding-bottom: 20px;
+    border-bottom: 1px solid #e2e8f0;
+}
+
+.logo-container img {
+    margin-bottom: 4px !important; 
+    object-fit: contain;
+}
+
+.header-text-col h1 {
+    font-family: 'Inter', sans-serif !important;
+    font-weight: 900 !important;
+    font-size: 2.2em !important; 
+    background: linear-gradient(90deg, #D65DB1 0%, #8B5CF6 50%, #F43F5E 100%);
+    -webkit-background-clip: text;
+    -webkit-text-fill-color: transparent;
+    text-align: left !important;
+    margin-bottom: -2px !important; 
+    padding-bottom: 0 !important;
+    line-height: 1.0 !important; 
+}
+
+.header-text-col .subheader {
+    text-align: left !important;
+    color: #64748b;
+    font-size: 1.1em;
+    font-weight: 500;
+    margin-top: 0 !important;
+    padding-top: 0 !important;
+}
+
+/* --- 2. CUSTOM TABS STYLE (DESKTOP) --- */
+.tabs > .tab-nav {
+    border-bottom: none !important;
+    gap: 8px !important;
+    margin-bottom: 15px !important;
+}
+
+.tabs > .tab-nav > button {
+    border: 1px solid #e5e7eb !important;
+    border-radius: 10px !important; 
+    background-color: white;
+    color: #475569 !important;
+    font-weight: 600 !important;
+    transition: all 0.2s ease-in-out;
+    padding: 6px 16px !important;
+}
+
+.tabs > .tab-nav > button:hover {
+    background-color: #f1f5f9 !important;
+    transform: translateY(-1px);
+}
+
+.tabs > .tab-nav > button.selected {
+    background: linear-gradient(135deg, #8B5CF6 0%, #D65DB1 100%) !important;
+    color: white !important;
+    border: 1px solid transparent !important;
+    box-shadow: 0 4px 12px rgba(139, 92, 246, 0.3) !important;
+}
+
+/* --- 3. PULSANTI PRIMARY --- */
+button.primary {
+    background: linear-gradient(135deg, #8B5CF6 0%, #D65DB1 100%) !important;
+    border: none !important;
+    color: white !important;
+    transition: filter 0.2s;
+}
+button.primary:hover {
+    filter: brightness(1.1); 
+    box-shadow: 0 4px 15px rgba(139, 92, 246, 0.4); 
+}
+
+/* --- FIX ALLINEAMENTO ALTEZZA (Desktop) --- */
+.fixed-height {
+    height: 380px !important; 
+    overflow: hidden !important;
+}
+.fixed-height button, 
+.fixed-height .image-container,
+.fixed-height .upload-container {
+    height: 100% !important;
+    max_height: 100% !important;
+    min_height: 100% !important;
+}
+.fixed-height img {
+    object-fit: contain !important; 
+    max_height: 100% !important;
+}
+
+/* --- 4. MOBILE RESPONSIVE (Aggiornato per i TAB) --- */
+@media (max-width: 768px) {
+    /* Header Stack */
+    .header-row {
+        flex-direction: column !important;
+        align-items: center !important;
+        text-align: center !important;
+        gap: 10px !important;
+    }
+    .header-text-col h1 {
+        text-align: center !important;
+        font-size: 1.8em !important;
+    }
+    .header-text-col .subheader {
+        text-align: center !important;
+    }
+
+    /* Layout Moduli Stack */
+    .responsive-row {
+        flex-direction: column !important;
+        display: flex !important;
+    }
+    .responsive-row > * {
+        width: 100% !important;
+        min-width: 100% !important;
+        margin-bottom: 15px !important;
+    }
+    
+    /* --- NUOVA GESTIONE TAB MOBILE --- */
+    .tabs > .tab-nav {
+        flex-wrap: wrap !important;      /* Permette di andare a capo */
+        justify-content: center !important; /* Centra i bottoni */
+        gap: 6px !important;             /* Spazio ridotto tra i bottoni */
+    }
+    
+    .tabs > .tab-nav > button {
+        flex-grow: 1 !important;         /* Si allargano per riempire la riga */
+        text-align: center !important;
+        font-size: 0.85rem !important;   /* Testo leggermente più piccolo */
+        padding: 8px 10px !important;    /* Padding ottimizzato per il tocco */
+        margin: 0 !important;
+        width: auto !important;          /* Lascia decidere al flex-grow */
+        min-width: 45% !important;       /* Assicura che al massimo ci siano 2 tab per riga */
+    }
+}
+
+footer {visibility: hidden}
+"""
+
+with gr.Blocks(theme=theme, css=custom_css, title="NGT AI Platform") as demo:
     
-    with gr.Tab("Pneumonia/Tuberculosis Detection"):
-        gr.Markdown("""
-                    Inviata una radiografia del petto, il servizio classifica la stessa come:\n 
-                    'Tubercolosi', 'No_Tubercolosi',  'Pneumonia', 'No_Pneumonia'
-                     """)
-        with gr.Row(equal_height=True):
-            file_selected = gr.FileExplorer(
-                root_dir="data/gallery/xray",
-                file_count='single',
-                label='Esplora',
-                height=400
+    # --- HEADER ---
+    with gr.Row(elem_classes="header-row"):
+        with gr.Column(scale=0, min_width=80, elem_classes="logo-container"):
+            gr.Image(
+                value="data/icon.png", 
+                show_label=False,           
+                show_download_button=False, 
+                show_share_button=False,    
+                container=False, 
+                show_fullscreen_button=False,           
+                interactive=False,          
+                height=80,
+                width=80
             )
-            image_input = gr.Image(show_download_button=False,
-                        show_share_button=False, sources=["upload"], height=400)
+        
+        with gr.Column(scale=1, elem_classes="header-text-col"):
+            gr.Markdown("""
+            <h1>NGT AI Platform</h1>
+            <div class='subheader'>Advanced Machine Learning Solutions</div>
+            """)
+    
+    # --- TAB 1: Chest X-Ray ---
+    with gr.Tab("🩻 Chest Diagnosis"):
+        gr.Markdown("### 📥 Diagnostica Polmonare")
+        gr.Markdown("Carica una radiografia o selezionane una dalla gallery per rilevare **Polmonite** o **Tubercolosi**.")
+        
+        # Aggiunta classe "responsive-row" e rimosso equal_height=True (lo gestiamo col CSS se serve)
+        with gr.Row(elem_classes="responsive-row"):
+            with gr.Column(scale=1):
+                with gr.Accordion("📂 1. Seleziona da Gallery", open=True):
+                    file_selected = gr.FileExplorer(
+                        root_dir="data/gallery/xray", 
+                        file_count='single',
+                        height=274 # Su desktop usa questo, su mobile il layout stackerà
+                    )
+            with gr.Column(scale=1):
+                image_input = gr.Image(type="numpy", height=320, label="2. Visualizzazione / Upload Manuale")
+
+        with gr.Row():
             with gr.Column():
-                image_output = [gr.Label(label="Diagnosi", scale=1)]
-                image_button = gr.Button("Analizza")
-    with gr.Tab("Diabetic Retinopathy Detection"):
-        gr.Markdown("""
-                    Questa interfaccia utilizza un modello di deep learning basato su rete neurale convoluzionale, in modo da predirre la presenza o meno di retinopatia diabetica a partire da un'immagine retinica
-                     """)
-        with gr.Row(equal_height=True):
+                analyze_btn_chest = gr.Button("🔍 Avvia Diagnosi Clinica", variant="primary", size="lg")
+                image_output = gr.Label(num_top_classes=2, label="Risultato Predittivo")
+        
+        file_selected.change(file_change, inputs=file_selected, outputs=image_input)
+        analyze_btn_chest.click(image_classification, inputs=image_input, outputs=image_output)
+
+    # --- TAB 2: Diabetic Retinopathy ---
+    with gr.Tab("👁️ Diabetic Retinopathy"):
+        gr.Markdown("### 📥 Analisi Retinica")
+        gr.Markdown("Deep Learning per la predizione della retinopatia diabetica.")
+        
+        # Aggiunta classe "responsive-row"
+        with gr.Row(elem_classes="responsive-row"):
             with gr.Column(scale=1):
-                file_selected_dr = gr.FileExplorer(
-                    root_dir="data/gallery/retinopaty",
-                    file_count='single',
-                    label='Esplora',
-                    height=400
-                )
-            with gr.Column(scale=2):
-                with gr.Row():
-                    image_i = gr.Image(
-                        show_download_button=False,
-                        show_share_button=False,
-                        sources=["upload"],
-                        height=400
+                with gr.Accordion("📂 1. Seleziona da Gallery", open=True):
+                    file_selected_dr = gr.FileExplorer(
+                        root_dir="data/gallery/retinopaty",
+                        file_count='single',
+                        height=274
                     )
-                    with gr.Column():
-                        image_o = [gr.Label(label="Diagnosi"), gr.Label(label="Probabilità di patologia")]
-                        image_button_dr = gr.Button("Analizza")
-    with gr.Tab("Review Classification"):
-        gr.Markdown("""
-                    Inviato un testo, il servizio classifica lo stesso come:\n
-                    'Economia', 'Politica', 'Scienza_e_tecnica', 'Sport', 'Storia'
-                    """)
-        with gr.Row(equal_height=True):
+            with gr.Column(scale=1):
+                image_input_dr = gr.Image(type="numpy", height=320, label="2. Visualizzazione / Upload Manuale")
+
+        with gr.Row():
             with gr.Column():
-                multi_classification_input = gr.Textbox()
+                analyze_btn_dr = gr.Button("🔍 Analizza Retina", variant="primary", size="lg")
+                with gr.Group():
+                    output_dr_label = gr.Label(label="Diagnosi Principale")
+                    output_dr_prob = gr.Label(label="Probabilità Patologia")
+
+        file_selected_dr.change(file_change, inputs=file_selected_dr, outputs=image_input_dr) 
+        analyze_btn_dr.click(retina_classification, inputs=image_input_dr, outputs=[output_dr_label, output_dr_prob])
+
+    # --- TAB 3: Review Classification ---
+    with gr.Tab("📰 Topic Classification"):
+        gr.Markdown("### Analisi Argomenti del Testo")
+        with gr.Row():
             with gr.Column():
-                multi_classification_output = gr.Label(num_top_classes=8)
-                multi_classification_button = gr.Button("Analizza")                    
-    with gr.Tab("Sentiment Analysis"):
-        gr.Markdown("Inviato il testo di una recensione, il servizio classifica lo stesso come Positivo o Negativo")
-        with gr.Row(equal_height=True):
+                multi_input = gr.Textbox(lines=5, placeholder="Incolla qui il testo...", label="Input")
+                analyze_btn_multi = gr.Button("🏷️ Classifica", variant="primary")
             with gr.Column():
-                binary_classification_input = gr.Textbox()
-            with gr.Column(scale=1):
-                binary_classification_output = gr.Label()
-                binary_classification_button = gr.Button("Analizza")
-    
-                    
-
-    image_button.click(image_classification, inputs=image_input, outputs=image_output)
-    image_button_dr.click(retina_classification, inputs=image_i, outputs=image_o)
-    multi_classification_button.click(multi_classification, inputs=multi_classification_input, outputs=multi_classification_output)
-    binary_classification_button.click(binary_classification, inputs=binary_classification_input, outputs=binary_classification_output)
-    
-    file_selected.change(file_change, inputs=file_selected, outputs=image_input)
-    file_selected_dr.change(file_change_dr, inputs=file_selected_dr, outputs=image_i)
+                multi_output = gr.Label(num_top_classes=5, label="Top Categorie")
         
+        gr.Examples(examples=[["La NASA ha lanciato un nuovo satellite."], ["Il prezzo della GPU è sceso."]], inputs=multi_input)
+        analyze_btn_multi.click(multi_classification, inputs=multi_input, outputs=multi_output)
+
+    # --- TAB 4: Sentiment Analysis ---
+    with gr.Tab("😊 Sentiment Analysis"):
+        gr.Markdown("### Analisi del Sentiment")
+        with gr.Row():
+            with gr.Column():
+                binary_input = gr.Textbox(lines=3, placeholder="Scrivi una recensione...", label="Input")
+                analyze_btn_bin = gr.Button("⚖️ Analizza", variant="primary")
+            with gr.Column():
+                binary_output = gr.Label(label="Sentiment Score")
+
+        analyze_btn_bin.click(binary_classification, inputs=binary_input, outputs=binary_output)
 
-demo.launch(server_name="0.0.0.0", server_port=7860)
+if __name__ == "__main__":
+    demo.launch(server_name="0.0.0.0", server_port=7860, allowed_paths=["data"])