Update app.py

app.py

@@ -32,29 +32,70 @@
 
 # demo.launch()
 
+# import gradio as gr
+# import datetime
+
+# def detect_theft(frame, lat, lon):
+#     time_detected = datetime.datetime.now().strftime("%Y-%m-%d %H:%M:%S")
+#     alert = f"🚨 Theft detected at {time_detected}!"
+#     map_embed = f"""<iframe width="100%" height="300" src="https://maps.google.com/maps?q={lat},{lon}&z=15&output=embed"></iframe>"""
+#     return alert, frame, map_embed
+
+# with gr.Blocks() as demo:
+#     gr.Markdown("## 🚨 Theft Detection & Live Location Surveillance AI")
+
+#     with gr.Row():
+#         cam = gr.Image(label="Upload Thief Image", type="pil")
+#         with gr.Column():
+#             lat = gr.Number(label="Latitude", value=24.8607)
+#             lon = gr.Number(label="Longitude", value=67.0011)
+#             detect_btn = gr.Button("📍 Show Location on Map")
+
+#     alert = gr.Textbox(label="Alert")
+#     captured = gr.Image(label="Thief Image")
+#     map_html = gr.HTML(label="Live Location Map")
+
+#     detect_btn.click(fn=detect_theft, inputs=[cam, lat, lon], outputs=[alert, captured, map_html])
+
+# demo.launch()
+
 import gradio as gr
 import datetime
 
-def detect_theft(frame, lat, lon):
-    time_detected = datetime.datetime.now().strftime("%Y-%m-%d %H:%M:%S")
-    alert = f"🚨 Theft detected at {time_detected}!"
-    map_embed = f"""<iframe width="100%" height="300" src="https://maps.google.com/maps?q={lat},{lon}&z=15&output=embed"></iframe>"""
-    return alert, frame, map_embed
+def show_thief_location(image, lat, lon):
+    time = datetime.datetime.now().strftime("%Y-%m-%d %H:%M:%S")
+    alert = f"🚨 Theft detected at {time}!"
+    map_embed = f"""
+    <div style="display: flex; gap: 20px;">
+        <iframe width="400" height="300" style="border-radius:12px" src="https://maps.google.com/maps?q={lat},{lon}&z=15&output=embed"></iframe>
+        <div>
+            <p><b>Thief Image:</b></p>
+            <img src="data:image/png;base64,{image}" width="200" style="border:2px solid red; border-radius:12px"/>
+        </div>
+    </div>
+    """
+    return alert, map_embed
 
 with gr.Blocks() as demo:
-    gr.Markdown("## 🚨 Theft Detection & Live Location Surveillance AI")
+    gr.Markdown("## 🚨 Theft Image Upload with Live Map Display")
 
     with gr.Row():
-        cam = gr.Image(label="Upload Thief Image", type="pil")
+        img_input = gr.Image(type="filepath", label="Upload Thief Image")
         with gr.Column():
             lat = gr.Number(label="Latitude", value=24.8607)
             lon = gr.Number(label="Longitude", value=67.0011)
-            detect_btn = gr.Button("📍 Show Location on Map")
+            btn = gr.Button("📍 Show Image on Map")
 
-    alert = gr.Textbox(label="Alert")
-    captured = gr.Image(label="Thief Image")
-    map_html = gr.HTML(label="Live Location Map")
+    alert_box = gr.Textbox(label="Alert")
+    map_out = gr.HTML(label="Map with Image")
 
-    detect_btn.click(fn=detect_theft, inputs=[cam, lat, lon], outputs=[alert, captured, map_html])
+    def generate_base64_map(image_path, lat, lon):
+        import base64
+        with open(image_path, "rb") as img_file:
+            encoded = base64.b64encode(img_file.read()).decode("utf-8")
+        return show_thief_location(encoded, lat, lon)
+
+    btn.click(fn=generate_base64_map, inputs=[img_input, lat, lon], outputs=[alert_box, map_out])
 
 demo.launch()
+