Update app.py

app.py

@@ -265,7 +265,7 @@ async (image) => {
 }
 """
 
-# --- جاوااسکریپت سراسری (استراتژی حذف کامل برای رفع مشکل رفرش) ---
+# --- جاوااسکریپت سراسری (Aggressive Scanner & Cleaner) ---
 js_global_content = """
 <script>
 document.addEventListener('DOMContentLoaded', () => {
@@ -282,44 +282,46 @@ document.addEventListener('DOMContentLoaded', () => {
     forceLight();
     setInterval(forceLight, 1000);
 
-    // 2. HELPER: Completely destroy the error element
-    // This is the key fix. By removing the element, Gradio is forced
-    // to render a completely new one next time, which our scanner will catch.
-    window.destroyErrorToast = function(btn) {
-        // Try to find the container
-        const toast = btn.closest('.toast-wrap') || btn.closest('.toast-body') || btn.closest('.error');
-        
+    // 2. RETRY FUNCTIONALITY
+    window.retryGeneration = function(btn) {
         // Find the main run button and click it to retry
         const runBtn = document.getElementById('run-btn');
-        if(runBtn) runBtn.click();
-
-        // Remove the error UI immediately
-        if (toast) {
-            toast.remove();
+        if(runBtn) {
+            runBtn.click();
         }
-        
-        // Aggressive cleanup: remove ANY other error toasts visible
+
+        // IMPORTANT: Forcefully remove ALL error containers immediately.
+        // This ensures that when Gradio renders the next error, it creates a new element
+        // or updates the DOM in a way our scanner will definitely catch.
         document.querySelectorAll('.toast-body, .toast-wrap, .error').forEach(el => {
-            if(el.innerText.includes("قدم تا ساخت") || el.innerText.includes("quota")) {
-                el.remove();
-            }
+            el.remove();
+        });
+        
+        // Also find any parent containers that might be holding the error
+        const parents = document.querySelectorAll('.gradio-container .prose');
+        parents.forEach(p => {
+             if (p.innerText.includes("quota") || p.innerText.includes("Error")) {
+                 p.innerHTML = "";
+             }
         });
     };
     
-    // Just remove toast (for Back button)
+    // Close function for Back button
     window.closeErrorToast = function(btn) {
          const toast = btn.closest('.toast-wrap') || btn.closest('.toast-body') || btn.closest('.error');
          if(toast) toast.remove();
     };
 
-    // 3. LOGIC: Replace content logic
+    // 3. REPLACEMENT LOGIC
     const replaceErrorContent = (node) => {
         // Safety check: if already has our custom container, do nothing
         if (node.querySelector('.ip-reset-guide-container')) return;
 
         const text = node.innerText || "";
-        // Check triggers
-        if (text.toLowerCase().includes('quota') || text.toLowerCase().includes('exceeded') || text.includes('requested vs')) {
+        
+        // Check triggers: "quota", "exceeded", or even just "Error" if it's in the status bar area
+        // We are aggressive here to catch the "red bar" shown in your video
+        if (text.toLowerCase().includes('quota') || text.toLowerCase().includes('exceeded') || (text.includes('Error') && node.classList.contains('error'))) {
             
             const prettyHtml = `
                 <div class="ip-reset-guide-container">
@@ -368,7 +370,7 @@ document.addEventListener('DOMContentLoaded', () => {
                             <svg class="action-button-icon" viewbox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M19 12H5M12 19l-7-7 7-7" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"></path></svg> 
                             <span>بازگشت</span> 
                         </button>
-                        <button class="action-button retry-button" onclick="window.destroyErrorToast(this)"> 
+                        <button class="action-button retry-button" onclick="window.retryGeneration(this)"> 
                             <svg class="action-button-icon" viewbox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M23 4v6h-6M1 20v-6h6" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"></path><path d="M20.49 9A9 9 0 0 0 5.64 5.64L1 10m22 4l-4.64 4.36A9 9 0 0 1 3.51 15" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"></path></svg> 
                             <span>تلاش مجدد</span> 
                         </button>
@@ -379,29 +381,31 @@ document.addEventListener('DOMContentLoaded', () => {
             // Inject the HTML
             node.innerHTML = prettyHtml;
             
-            // Clean up styles to prevent double boxes
+            // Clean up styles to prevent double boxes and red backgrounds
             node.style.padding = '0';
             node.style.border = 'none';
             node.style.backgroundColor = 'transparent';
             node.style.boxShadow = 'none';
+            node.classList.remove('error'); // Remove error class to stop red styling
         }
     };
 
-    // 4. AGGRESSIVE SCANNER: Check frequently for errors
+    // 4. SCANNER: Check continuously
+    // We scan very fast (50ms) to catch the error element the moment it appears
     setInterval(() => {
-        // Find all potential error containers
-        const potentialErrors = document.querySelectorAll('.toast-body, .error, .toast-wrap');
+        // We look for both toasts AND the inline error status bar (which was likely the red bar in your video)
+        const potentialErrors = document.querySelectorAll('.toast-body, .error, .toast-wrap, .eta-bar.error');
         
         potentialErrors.forEach(el => {
-            // Only process if it has text and doesn't have our card yet
-            // AND specifically checks for quota text
-            if (el.innerText && (el.innerText.includes('quota') || el.innerText.includes('exceeded'))) {
+            // If it has our text triggers and hasn't been replaced yet, replace it
+            if (el.innerText && (el.innerText.includes('quota') || el.innerText.includes('exceeded') || el.innerText.includes('Error'))) {
+                 // Check if we already injected our card
                  if (!el.querySelector('.ip-reset-guide-container')) {
                      replaceErrorContent(el);
                  }
             }
         });
-    }, 150); // Fast check
+    }, 50); 
 });
 </script>
 """
@@ -779,75 +783,4 @@ with gr.Blocks() as demo:
                         value="تبدیل عکس به انیمه"
                     )
                 
-                with gr.Accordion("تنظیمات پیشرفته", open=False, visible=True):
-                    aspect_ratio_selection = gr.Dropdown(
-                        label="ابعاد تصویر خروجی",
-                        choices=ASPECT_RATIOS_LIST,
-                        value="خودکار (پیش‌فرض)",
-                        interactive=True
-                    )
-                    
-                    with gr.Row(visible=False) as custom_dims_row:
-                        custom_width = gr.Slider(
-                            label="عرض دلخواه (Width)",
-                            minimum=256, maximum=2048, step=8, value=1024
-                        )
-                        custom_height = gr.Slider(
-                            label="ارتفاع دلخواه (Height)",
-                            minimum=256, maximum=2048, step=8, value=1024
-                        )
-                    
-                    seed = gr.Slider(label="دانه تصادفی (Seed)", minimum=0, maximum=MAX_SEED, step=1, value=0)
-                    randomize_seed = gr.Checkbox(label="استفاده از Seed تصادفی", value=True)
-                    guidance_scale = gr.Slider(label="میزان وفاداری به متن (Guidance Scale)", minimum=1.0, maximum=10.0, step=0.1, value=1.0)
-                    steps = gr.Slider(label="تعداد مراحل پردازش (Steps)", minimum=1, maximum=50, step=1, value=4)
-        
-        # اصلاح تابع نمایش ردیف اسلایدرها
-        def toggle_row(choice):
-            if choice == "شخصی‌سازی (Custom)":
-                return gr.update(visible=True)
-            return gr.update(visible=False)
-
-        aspect_ratio_selection.change(
-            fn=toggle_row,
-            inputs=aspect_ratio_selection,
-            outputs=custom_dims_row
-        )
-
-        gr.Examples(
-            examples=[
-                ["examples/1.jpg", "تبدیل به انیمه کن.", "تبدیل عکس به انیمه"],
-                ["examples/5.jpg", "سایه‌ها را حذف کن و نورپردازی نرم به تصویر بده.", "اصلاح نور و سایه"],
-                ["examples/4.jpg", "از فیلتر ساعت طلایی با پخش نور ملایم استفاده کن.", "نورپردازی مجدد (Relight)"],
-                ["examples/2.jpeg", "دوربین را ۴۵ درجه به سمت چپ بچرخان.", "تغییر زاویه دید"],
-                ["examples/7.jpg", "منبع نور را از سمت راست عقب قرار بده.", "نورپردازی چند زاویه‌ای"],
-                ["examples/10.jpeg", "کیفیت تصویر را افزایش بده (Upscale).", "افزایش کیفیت (Upscale)"],
-                ["examples/7.jpg", "منبع نور را از پایین بتابان.", "نورپردازی چند زاویه‌ای"],
-                ["examples/2.jpeg", "زاویه دوربین را به نمای بالا گوشه راست تغییر بده.", "تغییر زاویه دید"],
-                ["examples/9.jpg", "دوربین کمی به جلو حرکت می‌کند در حالی که نور خورشید از میان ابرها می‌تابد و درخششی نرم اطراف شبح شخصیت در مه ایجاد می‌کند. سبک سینمایی واقعی.", "صحنه بعدی (سینمایی)"],
-                ["examples/8.jpg", "جزئیات پوست سوژه را برج��ته‌تر و طبیعی‌تر کن.", "روتوش پوست"],
-                ["examples/6.jpg", "دوربین را به نمای پایین به بالا تغییر بده.", "تغییر زاویه دید"],
-            ],
-            inputs=[input_image, prompt, lora_adapter],
-            outputs=[output_image, seed, status_box],
-            fn=infer_example,
-            cache_examples=False,
-            label="نمونه‌ها (برای تست کلیک کنید)"
-        )
-
-    run_button.click(
-        fn=infer,
-        inputs=[input_image, prompt, lora_adapter, seed, randomize_seed, guidance_scale, steps, aspect_ratio_selection, custom_width, custom_height],
-        outputs=[output_image, seed, status_box],
-        api_name="predict"
-    )
-
-    download_button.click(
-        fn=None,
-        inputs=[output_image],
-        outputs=None,
-        js=js_download_func
-    )
-
-if __name__ == "__main__":
-    demo.queue(max_size=30).launch(show_error=True)
+                with gr.Accordion("تنظیمات پیشرفته", open=Fa