Update app.py

app.py

@@ -1,152 +1,169 @@
-# ui/app.py
-
-import gradio as gr
-from typing import Any, Dict, List
-
-from src.registry import get_model_display_names, get_model
-
-APP_TITLE = "PetRecog – Oxford-IIIT Pet Identification"
-APP_DESC = (
-    "Upload a pet image, choose a model, and compare predictions across "
-    "classical (LR, SVM) and deep-feature (ResNet) models."
-)
-TOP_K_DEFAULT = 5
-
-
-def format_topk_for_table(top_k: List[Dict[str, Any]]) -> List[List[Any]]:
-    """
-    Convert the model's top_k list of dicts into a 2D list suitable for gr.Dataframe.
-
-    Expected each entry in top_k to look like:
-      { 'class_id': int, 'class_name': str, 'probability': float }
-    """
-    rows = []
-    for rank, entry in enumerate(top_k, start=1):
-        class_name = entry.get("class_name", f"id={entry.get('class_id', '?')}")
-        prob = entry.get("probability", 0.0)
-        rows.append([rank, class_name, round(float(prob) * 100.0, 2)])
-    return rows
-
-
-def run_inference(model_id: str, image) -> Dict[str, Any]:
-    """
-    Wrapper called by Gradio.
-
-    Inputs:
-      - model_id: key from the registry
-      - image: PIL image object from gr.Image (type='pil')
-
-    Outputs (as a dict mapped to Gradio components in the UI):
-      - main_text: formatted prediction string
-      - topk_table: 2D list for gr.Dataframe
-    """
-    if image is None:
-        return {
-            "main_text": "⚠️ Please upload an image first.",
-            "topk_table": [],
-        }
-
-    # Get the model instance (lazy-loaded via registry)
-    model = get_model(model_id)
-
-    # All models follow the shared predict API:
-    # predict(PIL.Image, top_k=TOP_K_DEFAULT) -> {
-    #   'class_id', 'class_name', 'probabilities', 'top_k'
-    # }
-    result = model.predict(image, top_k=TOP_K_DEFAULT)
-
-    class_name = result.get("class_name", "Unknown")
-    class_id = result.get("class_id", "N/A")
-    top_k = result.get("top_k", [])
-
-    main_text = f"**Predicted Class:** {class_name}  \n" f"**Class ID:** {class_id}"
-
-    table = format_topk_for_table(top_k)
-
-    return {
-        "main_text": main_text,
-        "topk_table": table,
-    }
-
-
-def build_demo() -> gr.Blocks:
-    model_display_names = get_model_display_names()
-    # Gradio dropdown will show pretty display_name, but we need to map back to ids.
-    id_to_name = model_display_names
-    name_to_id = {v: k for k, v in id_to_name.items()}
-
-    default_display_name = next(iter(name_to_id.keys())) if name_to_id else None
-
-    with gr.Blocks(css="""
-        body { background: #fbead8; }
-        .noble-header { text-align: center; margin-bottom: 1.0rem; }
-        .noble-title { font-size: 2.0rem; font-weight: 800; color: #5b3b27; }
-        .noble-subtitle { font-size: 0.95rem; color: #7a5b45; }
-    """) as demo:
-        # Header
-        with gr.Row(elem_classes="noble-header"):
-            gr.Markdown(
-                f"### {APP_TITLE}\n{APP_DESC}",
-                elem_classes="noble-title"
-            )
-
-        with gr.Row():
-            # Left column: controls
-            with gr.Column(scale=1):
-                gr.Markdown("#### 1️⃣ Select Model & Upload Image")
-
-                model_dropdown = gr.Dropdown(
-                    choices=list(name_to_id.keys()),
-                    value=default_display_name,
-                    label="Select Model",
-                )
-
-                image_input = gr.Image(
-                    type="pil",
-                    label="Upload your pet image (JPEG/PNG)",
-                )
-
-                run_button = gr.Button("Run Identification")
-
-            # Right column: output
-            with gr.Column(scale=1):
-                gr.Markdown("#### 2️⃣ Model Prediction")
-
-                main_output = gr.Markdown(
-                    value="Prediction will appear here.",
-                    label="Prediction",
-                )
-
-                topk_output = gr.Dataframe(
-                    headers=["Rank", "Class Name", "Probability (%)"],
-                    datatype=["number", "str", "number"],
-                    col_count=(3, "fixed"),
-                    label=f"Top-{TOP_K_DEFAULT} Predictions",
-                )
-
-        # Wiring: button click -> inference
-        def _gradio_infer(selected_display_name, img):
-            if selected_display_name is None:
-                return {
-                    main_output: "⚠️ Please select a model.",
-                    topk_output: [],
-                }
-            model_id = name_to_id[selected_display_name]
-            result = run_inference(model_id, img)
-            return {
-                main_output: result["main_text"],
-                topk_output: result["topk_table"],
-            }
-
-        run_button.click(
-            fn=_gradio_infer,
-            inputs=[model_dropdown, image_input],
-            outputs=[main_output, topk_output],
-        )
-
-    return demo
-
-
-if __name__ == "__main__":
-    demo = build_demo()
-    demo.launch()
+import gradio as gr
+from typing import Any, Dict, List
+
+from src.registry import get_model_display_names, get_model
+
+APP_TITLE = "Machine Learning CS 6140 Project: Pet Recognizer"
+TOP_K_DEFAULT = 5
+
+DARK_CSS = """
+body {
+    background-color: #0f172a !important;
+}
+
+.gradio-container {
+    background-color: #0f172a !important;
+    color: #e5e7eb !important;
+}
+
+h1, h2, h3, h4, p, li, label {
+    color: #e5e7eb !important;
+}
+
+a {
+    color: #60a5fa !important;
+}
+
+.gr-box {
+    background-color: #020617 !important;
+    border-radius: 10px;
+}
+
+.gr-button {
+    background-color: #1e293b !important;
+    color: #e5e7eb !important;
+}
+
+.gr-button:hover {
+    background-color: #334155 !important;
+}
+"""
+
+
+# -----------------------------
+# Helpers
+# -----------------------------
+def format_topk_for_table(top_k: List[Dict[str, Any]]) -> List[List[Any]]:
+    rows = []
+    for rank, entry in enumerate(top_k, start=1):
+        class_name = entry.get("class_name", f"id={entry.get('class_id', '?')}")
+        prob = entry.get("probability", 0.0)
+        rows.append([rank, class_name, round(float(prob) * 100.0, 2)])
+    return rows
+
+
+def run_inference(model_id: str, image) -> Dict[str, Any]:
+    if image is None:
+        return {
+            "main_text": "Please upload an image first.",
+            "topk_table": [],
+        }
+
+    model = get_model(model_id)
+    result = model.predict(image, top_k=TOP_K_DEFAULT)
+
+    class_name = result.get("class_name", "Unknown")
+    class_id = result.get("class_id", "N/A")
+    top_k = result.get("top_k", [])
+
+    main_text = (
+        f"**Predicted Class:** {class_name}  \n"
+        f"**Class ID:** {class_id}"
+    )
+
+    return {
+        "main_text": main_text,
+        "topk_table": format_topk_for_table(top_k),
+    }
+
+
+# -----------------------------
+# UI
+# -----------------------------
+def build_demo() -> gr.Blocks:
+    model_display_names = get_model_display_names()
+    name_to_id = {v: k for k, v in model_display_names.items()}
+    default_display_name = next(iter(name_to_id.keys()))
+
+    with gr.Blocks(css=DARK_CSS) as demo:
+
+        # Title
+        gr.Markdown(
+            f"""
+#  {APP_TITLE}
+
+This project demonstrates **pet breed recognition** using the  
+**Oxford-IIIT Pet Dataset**, comparing **classical machine learning models**
+(Logistic Regression, SVM) with **deep feature-based models**
+(Pretrained ResNet18).
+
+ **Dataset & Supported Breeds**  
+The models are trained on **37 cat and dog breeds** from the Oxford-IIIT Pet Dataset.  
+ https://www.robots.ox.ac.uk/~vgg/data/pets/
+"""
+        )
+
+        # Instructions
+        gr.Markdown(
+            """
+##  Instructions
+
+1. **Upload** a clear, close-up image of a **cat or dog** belonging to one of the supported breeds  
+2. **Select a model** to run the recognition:
+   - **LR / SVM** → Expected to perform poorly on raw pixel inputs  
+   - **ResNet-based models** → Use pretrained deep visual features and produce much better results
+3. Click **Run Identification** to view the **Top-5 predictions**
+"""
+        )
+
+        with gr.Row():
+            # Left column
+            with gr.Column(scale=1):
+                gr.Markdown("### Select Model & Upload Image")
+
+                model_dropdown = gr.Dropdown(
+                    choices=list(name_to_id.keys()),
+                    value=default_display_name,
+                    label="Select Model",
+                )
+
+                image_input = gr.Image(
+                    type="pil",
+                    label="Upload your pet image (JPEG / PNG)",
+                )
+
+                run_button = gr.Button("Run Identification")
+
+            # Right column
+            with gr.Column(scale=1):
+                gr.Markdown("### Model Prediction")
+
+                main_output = gr.Markdown(
+                    value="Prediction will appear here.",
+                )
+
+                topk_output = gr.Dataframe(
+                    headers=["Rank", "Class Name", "Probability (%)"],
+                    datatype=["number", "str", "number"],
+                    column_count=3,
+                    label=f"Top-{TOP_K_DEFAULT} Predictions",
+                )
+
+        # Button wiring
+        def _gradio_infer(selected_display_name, img):
+            model_id = name_to_id[selected_display_name]
+            result = run_inference(model_id, img)
+            return result["main_text"], result["topk_table"]
+
+        run_button.click(
+            fn=_gradio_infer,
+            inputs=[model_dropdown, image_input],
+            outputs=[main_output, topk_output],
+        )
+
+    return demo
+
+
+if __name__ == "__main__":
+    demo = build_demo()
+    demo.launch()