Update app.py

app.py

@@ -23,6 +23,8 @@ def convert_mask_image_to_base64_string(mask_image):
 # تنزيل الصورة من رابط
 def download_image(url):
     response = requests.get(url)
+    if response.status_code != 200:
+        raise ValueError(f"Failed to download image from {url}. Status code: {response.status_code}")
     return Image.open(BytesIO(response.content)).convert("RGB")
 
 # استدعاء API الخاص بالإزالة
@@ -33,28 +35,86 @@ def eraser_api_call(image_base64_file, mask_base64_file, mask_type):
         "mask_file": mask_base64_file,
         "mask_type": mask_type,
     }
+    print(f"Payload being sent: {payload}")  # طباعة البيانات المرسلة
     response = requests.post(url, json=payload, headers=auth_headers)
+    print(f"API Response Code: {response.status_code}")  # طباعة رمز الاستجابة
     if response.status_code != 200:
-        raise ValueError(f"API request failed with status code {response.status_code}: {response.text}")
+        print(f"Error Response: {response.text}")  # طباعة نص الخطأ إذا حدث
+        raise ValueError(f"API request failed: {response.status_code}")
     response = response.json()
+    print("Response JSON:", response)  # طباعة الرد JSON
     res_image = download_image(response["result_url"])
     return res_image
 
 # دالة التنبؤ
 def predict(dict):
+    print("Predict function called.")  # للتأكد من استدعاء الدالة
+    print("Received Data Keys:", dict.keys())  # طباعة المفاتيح المستلمة
+
     if 'background' not in dict or 'layers' not in dict:
         raise ValueError("Invalid input format. Missing 'background' or 'layers' keys.")
+
     init_image = Image.fromarray(dict['background'][:, :, :3], 'RGB')
     mask = Image.fromarray(dict['layers'][0][:, :, 3], 'L')
+    
+    print("Initial image and mask created.")  # تأكيد نجاح إنشاء الصور
+
     image_base64_file = convert_mask_image_to_base64_string(init_image)
     mask_base64_file = convert_mask_image_to_base64_string(mask)
+    
     mask_type = "manual"
+    print("Sending API call...")  # تأكيد استدعاء API
     gen_img = eraser_api_call(image_base64_file, mask_base64_file, mask_type)
+    print("API call completed.")  # تأكيد انتهاء استدعاء API
+    
     return gen_img
 
 # CSS مخصص
 css = '''
-/* محتوى CSS كما هو */
+.gradio-container{max-width: 1100px !important}
+#image_upload{min-height:400px}
+#image_upload [data-testid="image"], #image_upload [data-testid="image"] > div{min-height: 400px}
+#mask_radio .gr-form{background:transparent; border: none}
+#word_mask{margin-top: .75em !important}
+#word_mask textarea:disabled{opacity: 0.3}
+.footer {margin-bottom: 45px;margin-top: 35px;text-align: center;border-bottom: 1px solid #e5e5e5}
+.footer>p {font-size: .8rem; display: inline-block; padding: 0 10px;transform: translateY(10px);background: white}
+.dark .footer {border-color: #303030}
+.dark .footer>p {background: #0b0f19}
+.acknowledgments h4{margin: 1.25em 0 .25em 0;font-weight: bold;font-size: 115%}
+#image_upload .touch-none{display: flex}
+@keyframes spin {
+    from {
+        transform: rotate(0deg);
+    }
+    to {
+        transform: rotate(360deg);
+    }
+}
+#share-btn-container {padding-left: 0.5rem !important; padding-right: 0.5rem !important; background-color: #000000; justify-content: center; align-items: center; border-radius: 9999px !important; max-width: 13rem; margin-left: auto;}
+div#share-btn-container > div {flex-direction: row;background: black;align-items: center}
+#share-btn-container:hover {background-color: #060606}
+#share-btn {all: initial; color: #ffffff;font-weight: 600; cursor:pointer; font-family: 'IBM Plex Sans', sans-serif; margin-left: 0.5rem !important; padding-top: 0.5rem !important; padding-bottom: 0.5rem !important;right:0;}
+#share-btn * {all: unset}
+#share-btn-container div:nth-child(-n+2){width: auto !important;min-height: 0px !important;}
+#share-btn-container .wrap {display: none !important}
+#share-btn-container.hidden {display: none!important}
+#prompt input{width: calc(100% - 160px);border-top-right-radius: 0px;border-bottom-right-radius: 0px;}
+#run_button {
+    width: 100%;
+    height: 50px;  /* Set a fixed height for the button */
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}
+#output-img img, #image_upload img {
+    object-fit: contain; /* Ensure aspect ratio is preserved */
+    width: 100%;
+    height: auto; /* Let height adjust automatically */
+}
+#prompt-container{margin-top:-18px;}
+#prompt-container .form{border-top-left-radius: 0;border-top-right-radius: 0}
+#image_upload{border-bottom-left-radius: 0px;border-bottom-right-radius: 0px}
 '''
 
 # واجهة Gradio
@@ -77,4 +137,4 @@ with image_blocks as demo:
             image_out = gr.Image(label="Output", elem_id="output-img")
     btn.click(fn=predict, inputs=image, outputs=image_out, api_name='run')
     gr.HTML("<div class='footer'><p>Footer text here...</p></div>")
-image_blocks.queue(max_size=25, api_open=False).launch(show_api=False)
+image_blocks.queue(max_size=25, api_open=False).launch(show_api=False, ssr=False)