Update app.py

app.py

@@ -4,7 +4,6 @@ import torch
 import numpy as np
 from PIL import Image
 import io
-import base64
 
 def remove_background(input_image):
     try:
@@ -16,151 +15,115 @@ def remove_background(input_image):
         
         # Process the image
         result = segmentor(input_image)
-        
-        # Convert the output image to PNG format
-        if isinstance(result['output_image'], Image.Image):
-            output = result['output_image']
-        else:
-            output = Image.fromarray(result['output_image'])
-            
-        return output, output
-        
+        return result['output_image']
     except Exception as e:
         raise gr.Error(f"Error processing image: {str(e)}")
 
-def save_image(image):
-    if image is None:
-        return None
-    try:
-        # Save image to bytes
-        buffer = io.BytesIO()
-        image.save(buffer, format="PNG")
-        return buffer.getvalue()
-    except Exception as e:
-        raise gr.Error(f"Error saving image: {str(e)}")
-
+# Custom CSS for mobile-friendly design
 css = """
 .gradio-container {
     font-family: 'Segoe UI', sans-serif;
-    background: linear-gradient(135deg, #1a1a1a 0%, #2d2d2d 100%);
+    max-width: 100% !important;
+    padding: 10px !important;
 }
-.gr-image {
-    border-radius: 12px;
-    border: 2px solid rgba(255, 215, 0, 0.3);
-    transition: transform 0.3s ease;
+.container {
+    display: flex;
+    flex-direction: column;
+    gap: 20px;
 }
-.gr-image:hover {
-    transform: scale(1.02);
+.image-container {
+    width: 100%;
+    max-width: 500px;
+    margin: 0 auto;
 }
 .gr-button {
     background: linear-gradient(45deg, #FFD700, #FFA500);
-    border: none;
-    color: black;
-    padding: 10px 20px;
-    border-radius: 8px;
-    font-weight: bold;
-    transition: all 0.3s ease;
-}
-.gr-button:hover {
-    transform: translateY(-2px);
-    box-shadow: 0 4px 12px rgba(255, 215, 0, 0.3);
+    border: none !important;
+    color: black !important;
+    padding: 12px 20px !important;
+    border-radius: 8px !important;
+    font-weight: bold !important;
+    margin: 10px 0 !important;
+    width: 100% !important;
+    max-width: 300px !important;
 }
-.container {
-    max-width: 1200px;
-    margin: 0 auto;
-    padding: 2rem;
-}
-.status-msg {
-    text-align: center;
-    margin: 1rem 0;
-    padding: 0.5rem;
-    border-radius: 8px;
-}
-.success {
-    background: rgba(0, 255, 0, 0.1);
-    color: #00ff00;
-}
-.error {
-    background: rgba(255, 0, 0, 0.1);
-    color: #ff0000;
+@media (max-width: 768px) {
+    .gradio-container {
+        padding: 5px !important;
+    }
+    .gr-button {
+        padding: 10px 15px !important;
+    }
 }
 """
 
+# Create Gradio interface
 with gr.Blocks(css=css) as demo:
     gr.HTML(
         """
         <div style="text-align: center; max-width: 800px; margin: 0 auto; padding: 20px;">
-            <h1 style="font-size: 2.5rem; margin-bottom: 1rem; background: linear-gradient(45deg, #FFD700, #FFA500); -webkit-background-clip: text; -webkit-text-fill-color: transparent;">
+            <h1 style="font-size: 2rem; margin-bottom: 1rem; background: linear-gradient(45deg, #FFD700, #FFA500); -webkit-background-clip: text; -webkit-text-fill-color: transparent;">
                 AI Background Remover
             </h1>
-            <p style="color: #cccccc; font-size: 1.1rem; margin-bottom: 2rem;">
-                Powered by RMBG V1.4 model from BRIA AI
+            <p style="color: #666; font-size: 1rem; margin-bottom: 2rem;">
+                Powered by RMBG V1.4 model
             </p>
         </div>
         """
     )
     
-    with gr.Row():
+    with gr.Row(equal_height=True):
         with gr.Column():
+            # Removed 'tool' parameter and added mobile-friendly settings
             input_image = gr.Image(
                 label="Upload Image",
                 type="pil",
                 sources=["upload", "clipboard"],
-                tool="select"
+                interactive=True
             )
             
         with gr.Column():
             output_image = gr.Image(
                 label="Result",
-                type="pil"
+                type="pil",
+                interactive=False
             )
-            download_btn = gr.Button("Download Result", visible=False)
     
     with gr.Row():
-        clear_btn = gr.Button("Clear")
+        clear_btn = gr.Button("Clear", variant="secondary")
         process_btn = gr.Button("Remove Background", variant="primary")
-        
-    status = gr.Textbox(label="Status", visible=False)
+
+    # Status message for feedback
+    status_msg = gr.Textbox(label="Status", interactive=False, visible=False)
 
     # Event handlers
-    def process_and_show(image):
+    def process_and_update(image):
         if image is None:
-            raise gr.Error("Please upload an image first")
+            return None, "Please upload an image first"
         try:
-            output, download = remove_background(image)
-            download_btn.visible = True
-            status.visible = True
-            status.value = "✅ Background removed successfully!"
-            return output, download, True, status
+            result = remove_background(image)
+            return result, "Background removed successfully!"
         except Exception as e:
-            status.visible = True
-            status.value = f"❌ Error: {str(e)}"
-            return None, None, False, status
-
-    def clear_all():
-        return {
-            input_image: None,
-            output_image: None,
-            download_btn: gr.Button(visible=False),
-            status: gr.Textbox(visible=False)
-        }
+            return None, f"Error: {str(e)}"
 
     process_btn.click(
-        fn=process_and_show,
+        fn=process_and_update,
         inputs=[input_image],
-        outputs=[output_image, output_image, download_btn, status]
+        outputs=[output_image, status_msg],
+        api_name="remove_background"
     )
     
     clear_btn.click(
-        fn=clear_all,
-        outputs=[input_image, output_image, download_btn, status]
-    )
-
-    # Download functionality
-    download_btn.click(
-        fn=save_image,
-        inputs=[output_image],
-        outputs=[gr.File(label="Download")]
+        fn=lambda: (None, None, ""),
+        outputs=[input_image, output_image, status_msg],
+        api_name="clear"
     )
 
-demo.queue().launch()
+# Launch the app
+demo.launch(
+    share=True,
+    enable_queue=True,
+    show_error=True,
+    server_port=7860,
+    server_name="0.0.0.0"
+)