Update app.py

app.py

@@ -1,5 +1,5 @@
 # --------------------------------------------------------------
-#  Qwen‑Image‑Edit‑Plus (Optimized) – Minimal UI with full style
+#  Qwen‑Image‑Edit‑Plus (Optimized) – Minimal UI + hidden dev params
 # --------------------------------------------------------------
 
 import os
@@ -28,10 +28,7 @@ logger = logging.getLogger(__name__)
 # 1️⃣  Prompt translation (Albanian → English)
 # ------------------------------------------------------------------
 def translate_prompt(text: str) -> str:
-    """
-    Calls the external HF Space that translates Albanian → English.
-    Returns the translated string (or raises a Gradio error).
-    """
+    """Calls the external HF Space that translates Albanian → English."""
     if not text.strip():
         raise gr.Error("Please enter a prompt.")
     url = (
@@ -87,243 +84,214 @@ pipeline.load_lora_weights(
 )
 pipeline.fuse_lora()
 
+
+# ------------------------------------------------------------------
+# 3️⃣  **Hidden developer‑only inference parameters**
+# ------------------------------------------------------------------
+# You can edit any of these constants in the source file – they are NOT
+# exposed to the end‑user UI.
+DEFAULT_SEED = 0                     # 0 → deterministic; set to random if you like
+DEFAULT_NUM_STEPS = 4                # Lightning version uses 4 steps
+DEFAULT_TRUE_CFG_SCALE = 1.0         # Keep at 1.0 for the Lightning LoRA
+DEFAULT_GUIDANCE_SCALE = 1.0         # Same as true_cfg_scale for this model
+DEFAULT_NEGATIVE_PROMPT = ""         # Empty by default; change if you want a negative prompt
+QUALITY_SUFFIX = ", high quality, detailed, vibrant, professional lighting"
+
+
 # ------------------------------------------------------------------
-# 3️⃣  Core inference – runs on a GPU worker (Spaces)
+# 4️⃣  Core inference – runs on a GPU worker (Spaces)
 # ------------------------------------------------------------------
 @spaces.GPU(duration=60)
 def edit_images(image1, image2, prompt):
     """
-    Takes two input images + a user prompt, translates the prompt to English,
+    Takes two input images + a prompt, translates the prompt,
     then runs the Qwen‑Image‑Edit‑Plus pipeline.
-    Returns the first generated image.
+    The hyper‑parameters used are the hidden constants above.
     """
-    # ------------------------------------------------------------------
-    # Validate inputs
-    # ------------------------------------------------------------------
     if image1 is None or image2 is None:
         raise gr.Error("Please upload **both** images.")
 
-    # Gradio may give us a PIL.Image already – otherwise convert
+    # Convert possible ndarray → PIL.Image
     if not isinstance(image1, Image.Image):
         image1 = Image.fromarray(image1)
     if not isinstance(image2, Image.Image):
         image2 = Image.fromarray(image2)
 
-    # ------------------------------------------------------------------
-    # Prompt translation + small quality suffix (kept from the original UI)
-    # ------------------------------------------------------------------
+    # 1️⃣ Translate prompt + add quality suffix
     translated = translate_prompt(prompt.strip())
-    prompt_enhanced = translated + ", high quality, detailed, vibrant, professional lighting"
+    prompt_enhanced = translated + QUALITY_SUFFIX
 
-    # ------------------------------------------------------------------
-    # Random seed (kept deterministic per request)
-    # ------------------------------------------------------------------
-    seed = random.randint(0, np.iinfo(np.int32).max)
+    # 2️⃣ Seed & generator (editable via DEFAULT_SEED)
+    seed = DEFAULT_SEED if DEFAULT_SEED != 0 else random.randint(0, np.iinfo(np.int32).max)
     generator = torch.Generator(device="cuda").manual_seed(seed)
 
-    # ------------------------------------------------------------------
-    # Run the pipeline (no extra CFG or negative prompt – defaults)
-    # ------------------------------------------------------------------
+    # 3️⃣ Run the pipeline (Lightning defaults)
     with torch.inference_mode():
         out = pipeline(
             image=[image1, image2],
             prompt=prompt_enhanced,
             generator=generator,
-            num_inference_steps=4,          # Lightning 4‑step inference
-            true_cfg_scale=1.0,            # no classifier‑free guidance
+            num_inference_steps=DEFAULT_NUM_STEPS,
+            true_cfg_scale=DEFAULT_TRUE_CFG_SCALE,
+            # `guidance_scale` is ignored by the Lightning LoRA but kept for completeness
+            # (the pipeline internally uses `true_cfg_scale` only)
+            negative_prompt=DEFAULT_NEGATIVE_PROMPT,
         )
     return out.images[0] if out.images else None
 
 
 # ------------------------------------------------------------------
-# 4️⃣  UI – full visual theme, only the required components
+# 5️⃣  UI – full visual theme, only the four components you want
 # ------------------------------------------------------------------
 def create_demo():
     with gr.Blocks(css="", title="Qwen Image Edit Plus (Optimized)") as demo:
         # --------------------------------------------------------------
-        # 4️⃣‑a️⃣  Full CSS / JS from the first UI you posted
+        # 5️⃣‑a️⃣  Full CSS / JS (exactly the reference style, includes 600 px top gap)
         # --------------------------------------------------------------
         gr.HTML(
             """
             <style>
             @import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@400;600;700&display=swap');
-            @keyframes glow {
-                0% { box-shadow: 0 0 14px rgba(0, 255, 128, 0.5); }
-                50% { box-shadow: 0 0 14px rgba(0, 255, 128, 0.7); }
-                100% { box-shadow: 0 0 14px rgba(0, 255, 128, 0.5); }
-            }
-            @keyframes glow-hover {
-                0% { box-shadow: 0 0 20px rgba(0, 255, 128, 0.7); }
-                50% { box-shadow: 0 0 20px rgba(0, 255, 128, 0.9); }
-                100% { box-shadow: 0 0 20px rgba(0, 255, 128, 0.7); }
+            @keyframes glow { 0%{box-shadow:0 0 14px rgba(0,255,128,0.5);} 50%{box-shadow:0 0 14px rgba(0,255,128,0.7);} 100%{box-shadow:0 0 14px rgba(0,255,128,0.5);} }
+            @keyframes glow-hover { 0%{box-shadow:0 0 20px rgba(0,255,128,0.7);} 50%{box-shadow:0 0 20px rgba(0,255,128,0.9);} 100%{box-shadow:0 0 20px rgba(0,255,128,0.7);} }
+            @keyframes slide { 0%{background-position:0% 50%;} 50%{background-position:100% 50%;} 100%{background-position:0% 50%;} }
+            body{
+                background:#000000 !important;
+                color:#FFFFFF !important;
+                font-family:'Orbitron',sans-serif;
+                min-height:100vh;
+                margin:0 !important;
+                padding:0 !important;
+                width:100% !important;
+                max-width:100vw !important;
+                overflow-x:hidden !important;
+                display:flex !important;
+                justify-content:center;
+                align-items:center;
+                flex-direction:column;
             }
-            @keyframes slide {
-                0% { background-position: 0% 50%; }
-                50% { background-position: 100% 50%; }
-                100% { background-position: 0% 50%; }
+            /* 600 px empty strip at the top – exactly as you asked */
+            body::before{
+                content:"";
+                display:block;
+                height:600px;
+                background:#000000 !important;
             }
-            body {
-                background: #000000 !important;
-                color: #FFFFFF !important;
-                font-family: 'Orbitron', sans-serif;
-                min-height: 100vh;
-                margin: 0 !important;
-                padding: 0 !important;
-                width: 100% !important;
-                max-width: 100vw !important;
-                overflow-x: hidden !important;
-                display: flex !important;
-                justify-content: center;
-                align-items: center;
-                flex-direction: column;
+            .gr-blocks,.container{
+                width:100% !important;
+                max-width:100vw !important;
+                background:#000000 !important;
+                color:#FFFFFF !important;
+                margin:0 !important;
+                padding:0 !important;
+                box-sizing:border-box !important;
+                overflow-x:hidden !important;
             }
-            .gr-blocks, .container {
-                width: 100% !important;
-                max-width: 100vw !important;
-                background: #000000 !important;
-                color: #FFFFFF !important;
-                margin: 0 !important;
-                padding: 0 !important;
-                box-sizing: border-box !important;
-                overflow-x: hidden !important;
+            #general_items{
+                width:100% !important;
+                max-width:100vw !important;
+                margin:2rem 0 !important;
+                display:flex !important;
+                flex-direction:column;
+                align-items:center;
+                justify-content:center;
+                background:#000000 !important;
+                color:#FFFFFF !important;
             }
-            #general_items {
-                width: 100% !important;
-                max-width: 100vw !important;
-                margin: 2rem 0 !important;
-                display: flex !important;
-                flex-direction: column;
-                align-items: center;
-                justify-content: center;
-                background: #000000 !important;
-                color: #FFFFFF !important;
+            #input_column{
+                background:#000000 !important;
+                border:none !important;
+                border-radius:8px;
+                padding:1rem !important;
+                box-shadow:0 0 10px rgba(255,255,255,0.3) !important;
+                width:100% !important;
+                max-width:100vw !important;
+                box-sizing:border-box !important;
+                color:#FFFFFF !important;
             }
-            #input_column {
-                background: #000000 !important;
-                border: none !important;
-                border-radius: 8px;
-                padding: 1rem !important;
-                box-shadow: 0 0 10px rgba(255, 255, 255, 0.3) !important;
-                width: 100% !important;
-                max-width: 100vw !important;
-                box-sizing: border-box !important;
-                color: #FFFFFF !important;
+            .gradio-component{
+                background:#000000 !important;
+                border:none;
+                margin:0.75rem 0;
+                width:100% !important;
+                max-width:100vw !important;
+                color:#FFFFFF !important;
             }
-            h1 {
-                font-size: 5rem;
-                font-weight: 700;
-                text-align: center;
-                color: #FFFFFF !important;
-                text-shadow: 0 0 8px rgba(255, 255, 255, 0.3) !important;
-                margin: 0 auto 0.5rem auto;
-                display: block;
+            .image-container{
+                aspect-ratio:1/1;
+                width:100% !important;
+                max-width:100vw !important;
+                min-height:500px;
+                height:auto;
+                border:0.5px solid #FFFFFF !important;
+                border-radius:4px;
+                box-sizing:border-box !important;
+                background:#000000 !important;
+                box-shadow:0 0 10px rgba(255,255,255,0.3) !important;
+                position:relative;
+                color:#FFFFFF !important;
             }
-            #subtitle {
-                font-size: 1rem;
-                text-align: center;
-                color: #FFFFFF !important;
-                opacity: 0.8;
-                margin-bottom: 1rem;
-                display: block;
+            .image-container img{width:100% !important;height:auto;display:block !important;}
+            input,textarea,select{
+                background:#000000 !important;
+                color:#FFFFFF !important;
+                border:1px solid #FFFFFF !important;
+                border-radius:4px;
+                padding:0.5rem;
+                width:100% !important;
+                max-width:100vw !important;
+                box-sizing:border-box !important;
+                font-family:'Orbitron',sans-serif;
             }
-            .gradio-component {
-                background: #000000 !important;
-                border: none;
-                margin: 0.75rem 0;
-                width: 100% !important;
-                max-width: 100vw !important;
-                color: #FFFFFF !important;
+            .gr-button-primary{
+                background:linear-gradient(90deg,rgba(0,255,128,0.3),rgba(0,200,100,0.3),rgba(0,255,128,0.3)) !important;
+                background-size:200% 100%;
+                animation:slide 4s ease-in-out infinite,glow 3s ease-in-out infinite;
+                color:#FFFFFF !important;
+                border:1px solid #FFFFFF !important;
+                border-radius:6px;
+                padding:0.75rem 1.5rem;
+                font-size:1.1rem;
+                font-weight:600;
+                box-shadow:0 0 14px rgba(0,255,128,0.7) !important;
+                transition:box-shadow 0.3s,transform 0.3s;
+                width:100% !important;
+                max-width:100vw !important;
+                min-height:48px;
+                cursor:pointer;
             }
-            .image-container {
-                aspect-ratio: 1/1;
-                width: 100% !important;
-                max-width: 100vw !important;
-                min-height: 500px;
-                height: auto;
-                border: 0.5px solid #FFFFFF !important;
-                border-radius: 4px;
-                box-sizing: border-box !important;
-                background: #000000 !important;
-                box-shadow: 0 0 10px rgba(255, 255, 255, 0.3) !important;
-                position: relative;
-                color: #FFFFFF !important;
+            .gr-button-primary:hover{
+                box-shadow:0 0 20px rgba(0,255,128,0.9) !important;
+                animation:slide 4s ease-in-out infinite,glow-hover 3s ease-in-out infinite;
+                transform:scale(1.05);
             }
-            .image-container img {
-                width: 100% !important;
-                height: auto;
-                display: block !important;
+            button[aria-label="Fullscreen"],button[aria-label="Share"]{display:none !important;}
+            button[aria-label="Download"]{
+                transform:scale(3);
+                transform-origin:top right;
+                background:#000000 !important;
+                color:#FFFFFF !important;
+                border:1px solid #FFFFFF !important;
+                border-radius:4px;
+                padding:0.4rem !important;
+                margin:0.5rem !important;
+                box-shadow:0 0 8px rgba(255,255,255,0.3) !important;
+                transition:box-shadow 0.3s;
             }
-            input, textarea, select {
-                background: #000000 !important;
-                color: #FFFFFF !important;
-                border: 1px solid #FFFFFF !important;
-                border-radius: 4px;
-                padding: 0.5rem;
-                width: 100% !important;
-                max-width: 100vw !important;
-                box-sizing: border-box !important;
-                font-family: 'Orbitron', sans-serif;
-            }
-            .gr-button-primary {
-                background: linear-gradient(90deg, rgba(0,255,128,0.3), rgba(0,200,100,0.3), rgba(0,255,128,0.3)) !important;
-                background-size: 200% 100%;
-                animation: slide 4s ease-in-out infinite, glow 3s ease-in-out infinite;
-                color: #FFFFFF !important;
-                border: 1px solid #FFFFFF !important;
-                border-radius: 6px;
-                padding: 0.75rem 1.5rem;
-                font-size: 1.1rem;
-                font-weight: 600;
-                box-shadow: 0 0 14px rgba(0,255,128,0.7) !important;
-                transition: box-shadow 0.3s, transform 0.3s;
-                width: 100% !important;
-                max-width: 100vw !important;
-                min-height: 48px;
-                cursor: pointer;
-            }
-            .gr-button-primary:hover {
-                box-shadow: 0 0 20px rgba(0,255,128,0.9) !important;
-                animation: slide 4s ease-in-out infinite, glow-hover 3s ease-in-out infinite;
-                transform: scale(1.05);
-            }
-            button[aria-label="Fullscreen"], button[aria-label="Share"] { display: none !important; }
-            button[aria-label="Download"] {
-                transform: scale(3);
-                transform-origin: top right;
-                background: #000000 !important;
-                color: #FFFFFF !important;
-                border: 1px solid #FFFFFF !important;
-                border-radius: 4px;
-                padding: 0.4rem !important;
-                margin: 0.5rem !important;
-                box-shadow: 0 0 8px rgba(255,255,255,0.3) !important;
-                transition: box-shadow 0.3s;
-            }
-            button[aria-label="Download"]:hover {
-                box-shadow: 0 0 12px rgba(255,255,255,0.5) !important;
-            }
-            .progress-text, .gr-progress, .gr-prose, .gr-log,
-            footer, .gr-button-secondary, .gr-accordion, .gr-examples,
-            .gr-group { display: none !important; }
-            @media (max-width: 768px) {
-                h1 { font-size: 4rem; }
-                #subtitle { font-size: 0.9rem; }
-                .gr-button-primary {
-                    padding: 0.6rem 1rem;
-                    font-size: 1rem;
-                    box-shadow: 0 0 10px rgba(0,255,128,0.7) !important;
-                }
-                .image-container { min-height: 300px; }
+            button[aria-label="Download"]:hover{box-shadow:0 0 12px rgba(255,255,255,0.5) !important;}
+            .progress-text,.gr-progress,.gr-prose,.gr-log,
+            footer,.gr-button-secondary,.gr-accordion,.gr-examples,
+            .gr-group{display:none !important;}
+            @media (max-width:768px){
+                .gr-button-primary{padding:0.6rem 1rem;font-size:1rem;box-shadow:0 0 10px rgba(0,255,128,0.7) !important;}
+                .image-container{min-height:300px;}
             }
             </style>
             <script>
             // Debug helper – logs dimensions and forces hidden UI bits
             document.addEventListener('DOMContentLoaded', () => {
                 const containers = document.querySelectorAll('#general_items, #input_column, .image-container');
-                containers.forEach(c => {
-                    console.log(`Container ${c.id||c.className}: ${c.offsetWidth}px`);
-                });
-                // Hide any stray toolbar elements (just in case)
+                containers.forEach(c => console.log(`Container ${c.id||c.className}: ${c.offsetWidth}px`));
                 const toolbar = document.querySelectorAll('.gr-file-upload, .gr-image-toolbar, .gr-button');
                 toolbar.forEach(el => el.style.display='none');
             });
@@ -332,7 +300,7 @@ def create_demo():
         )
 
         # --------------------------------------------------------------
-        # 4️⃣‑b️⃣  Main layout – exactly the pieces you asked for
+        # 5️⃣‑b️⃣  Main layout – only the four widgets you asked for
         # --------------------------------------------------------------
         with gr.Row(elem_id="general_items"):
             # ----- Left column: inputs -------------------------------------------------
@@ -371,7 +339,7 @@ def create_demo():
                 )
 
         # --------------------------------------------------------------
-        # 4️⃣‑c️⃣  Wire the button to the inference function
+        # 5️⃣‑c️⃣  Wire the button to the inference function
         # --------------------------------------------------------------
         generate_btn.click(
             fn=edit_images,
@@ -383,6 +351,9 @@ def create_demo():
     return demo
 
 
+# ------------------------------------------------------------------
+# 6️⃣  Launch
+# ------------------------------------------------------------------
 if __name__ == "__main__":
     logger.info(f"Gradio version: {gr.__version__}")
     demo = create_demo()