Update app.py

app.py

@@ -7,8 +7,16 @@ import json
 BACKEND = os.getenv('BACKEND')
 TOKEN = os.getenv('TOKEN')
 backend = Client(BACKEND, hf_token=TOKEN)
+JS_FUNC1 = os.getenv("JS_FUNC1")
+JS_FUNC2 = os.getenv("JS_FUNC2")
 
 def search_image(file):    
+    try:
+        handle_file(file)
+    except Exception as e:
+        gr.Info("Please upload an image file.")
+        return []
+
     result_text = backend.predict(
             file=handle_file(file),
             api_name="/search_image"
@@ -38,6 +46,34 @@ div#component-18 {
     width: 48px;
     height: 48px;
 }
+
+.button-gradient {
+  background: linear-gradient(45deg, #ff416c, #ff4b2b, #ff9b00, #ff416c);
+  background-size: 400% 400%;
+  border: none;
+  padding: 14px 28px;
+  font-size: 16px;
+  font-weight: bold;
+  color: white;
+  border-radius: 10px;
+  cursor: pointer;
+  transition: 0.3s ease-in-out;
+  animation: gradientAnimation 2s infinite linear;
+  box-shadow: 0 4px 10px rgba(255, 65, 108, 0.6);
+}
+
+@keyframes gradientAnimation {
+  0% { background-position: 0% 50%; }
+  25% { background-position: 50% 100%; }
+  50% { background-position: 100% 50%; }
+  75% { background-position: 50% 0%; }
+  100% { background-position: 0% 50%; }
+}
+
+.button-gradient:hover {
+  transform: scale(1.05);
+  box-shadow: 0 6px 15px rgba(255, 75, 43, 0.8);
+}
 """
 
 output = gr.Gallery(label="Found Images (The search may take a couple of minutes.)", columns=[3], object_fit="contain", height="480px", interactive=False)
@@ -49,30 +85,35 @@ def init_ui():
 def search_ui():
     return gr.update(visible=False), gr.update(visible=True)
 
-with gr.Blocks(css=custom_css, delete_cache=(3600, 3600)) as demo:
-    gr.Markdown(
-        """
-    # Free Reverse Image Search
+MARKDOWN0 = """
+    # Free Reverse Image Search - ❤️Like above if this space helps
     ### [Learn more about our Reverse Image Search](https://faceonlive.com/reverse-image-search)
-    <br/>
-    """
-    )
+"""
+MARKDOWN3 = """
+<div align="right"><a href="https://faceonlive.com/face-search-online" target='_blank' style='font-size: 16px;'>Reverse Face Search</div><br/>
+<div align="right"><a href="https://faceonlive.com/deepfake-detector" target='_blank' style='font-size: 16px;'>AI Generated Image & Deepfake Detector</div>
+"""
+
+with gr.Blocks(css=custom_css, delete_cache=(3600, 3600)) as demo:
+    gr.Markdown(MARKDOWN0)
     with gr.Row():
         with gr.Column(scale=1) as col1:
             image = gr.Image(type='filepath', height=360)          
-            gr.HTML("<a href='https://faceonlive.com/face-search-online' target='_blank' style='font-size: 20px;'>Try Reverse Face Search Here</a>")  
-            search_image_button = gr.Button("Reverse Image Search")            
-            
+            gr.HTML("<div id='limit'></div>")
+            limit_button = gr.Button("🔍 Reverse Image Search", elem_classes="button-gradient")
+            search_image_button = gr.Button("Reverse Image Search", visible=False, elem_id="submit_btn")
+            gr.HTML(MARKDOWN3)
         with col2.render():
             output.render()
-            gr.HTML("<a href='https://faceonlive.com/face-search-online' target='_blank' style='font-size: 20px;'>Try Reverse Face Search Here</a>")
             new_search_button = gr.Button("🚀 Try New Search")
+            gr.HTML(MARKDOWN3)
         
+    limit_button.click(None, js=JS_FUNC2)
+    demo.load(None, inputs=None, outputs=None, js=JS_FUNC1)
     search_image_button.click(search_ui, inputs=[], outputs=[col1, col2], api_name=False)
     search_image_button.click(search_image, inputs=[image], outputs=[output], api_name=False)
 
     new_search_button.click(init_ui, inputs=[], outputs=[col1, col2], api_name=False)
-
     gr.HTML('<a href="https://visitorbadge.io/status?path=https%3A%2F%2Fhuggingface.co%2Fspaces%2FReverseImageSearch%2FReverse-Image-Search"><img src="https://api.visitorbadge.io/api/visitors?path=https%3A%2F%2Fhuggingface.co%2Fspaces%2FReverseImageSearch%2FReverse-Image-Search&labelColor=%23ff8a65&countColor=%2337d67a&style=flat&labelStyle=upper" /></a>')
 
 demo.queue(api_open=False, default_concurrency_limit=8).launch(server_name="0.0.0.0", server_port=7860, show_api=False)