Update app.py

app.py

@@ -3,7 +3,6 @@ import requests
 import io
 import random
 import os
-import time
 from PIL import Image
 from deep_translator import GoogleTranslator
 
@@ -14,8 +13,8 @@ API_TOKEN = os.getenv("HF_READ_TOKEN")
 headers = {"Authorization": f"Bearer {API_TOKEN}"}
 timeout = 100
 
-def query(prompt, is_negative=False, steps=30, cfg_scale=7, sampler="DPM++ 2M Karras", seed=-1, strength=0.7):
-    if not prompt:
+def query(prompt, is_negative=False, steps=30, cfg_scale=7, sampler="DPM++ 2M Karras", seed=-1, strength=0.7, width=1024, height=1024):
+    if prompt == "" or prompt is None:
         return None
 
     key = random.randint(0, 999)
@@ -39,7 +38,9 @@ def query(prompt, is_negative=False, steps=30, cfg_scale=7, sampler="DPM++ 2M Ka
         "steps": steps,
         "cfg_scale": cfg_scale,
         "seed": seed if seed != -1 else random.randint(1, 1000000000),
-        "strength": strength
+        "strength": strength,
+        "width": width,
+        "height": height
     }
 
     response = requests.post(API_URL, headers=headers, json=payload, timeout=timeout)
@@ -64,77 +65,70 @@ css = """
     max-width: 600px;
     margin-left: auto;
     margin-right: auto;
+    background-color: #ffffff; /* Fondo blanco */
+    color: #333333; /* Texto gris oscuro */
 }
 
 input, textarea, select {
     background-color: #f5f5f5; /* Fondo gris claro para inputs */
     color: #333333; /* Texto gris oscuro en inputs */
-    border: 1px solid #cccccc; /* Borde gris claro en inputs */
+    border: 1px solid #333333; /* Borde negro en inputs */
 }
 
 button {
-    background-color: #f5f5f5; /* Fondo gris claro */
-    color: #333333; /* Texto gris oscuro */
-    border: 2px solid black; /* Borde negro en botones */
-}
-
-button.primary {
-    background-color: green; /* Fondo verde para el botón 'Generate' */
-    color: white; /* Texto blanco en el botón 'Generate' */
-}
-
-button.secondary {
-    background-color: #f5f5f5; /* Fondo gris claro para el botón 'Clear' */
-    color: #333333; /* Texto gris oscuro en el botón 'Clear' */
+    background-color: #28a745; /* Fondo verde */
+    color: #ffffff; /* Texto blanco en botones */
+    border: 1px solid #333333; /* Borde negro en botones */
+    border-radius: 4px; /* Bordes redondeados */
 }
 
 button:hover {
-    background-color: #e0e0e0; /* Fondo gris más oscuro en hover */
+    background-color: #218838; /* Verde oscuro en hover */
 }
 
-h1, h2, h3, h4, h5, h6 {
-    color: #333333; /* Texto gris oscuro en encabezados */
+h1 {
+    color: #333333; /* Texto gris oscuro en h1 */
 }
 
-@media (max-width: 768px) {
-    .button-row {
-        display: flex;
-        flex-direction: column;
-        gap: 10px;
-    }
+h2 {
+    color: #333333; /* Texto gris oscuro en h2 */
 }
 """
 
 with gr.Blocks(css=css) as app:
-    gr.HTML("""
-    <center>
-        <h1>Dream Generator with Flux</h1>
-        <h2>Transforma tus sueños en imágenes vibrantes con un solo clic.</h2>
-    </center>
-    """)
-    
-    with gr.Row():
-        with gr.Column(scale=1):
-            text_prompt = gr.Textbox(label="Prompt", placeholder="Enter a prompt here", lines=2, elem_id="prompt-text-input")
-            negative_prompt = gr.Textbox(label="Negative Prompt", placeholder="What should not be in the image", value="(deformed, distorted, disfigured), poorly drawn, bad anatomy, wrong anatomy, extra limb, missing limb, floating limbs, (mutated hands and fingers), disconnected limbs, mutation, mutated, ugly, disgusting, blurry, amputation, misspellings, typos", lines=3, elem_id="negative-prompt-text-input")
-            steps = gr.Slider(label="Sampling steps", value=35, minimum=1, maximum=100, step=1)
-            cfg = gr.Slider(label="CFG Scale", value=7, minimum=1, maximum=20, step=1)
-            method = gr.Radio(label="Sampling method", value="DPM++ 2M Karras", choices=["DPM++ 2M Karras", "DPM++ SDE Karras", "Euler", "Euler a", "Heun", "DDIM"])
-            strength = gr.Slider(label="Strength", value=0.7, minimum=0, maximum=1, step=0.001)
-            seed = gr.Slider(label="Seed", value=-1, minimum=-1, maximum=1000000000, step=1)
-
-            with gr.Row(elem_id="button-row"):
-                clear_button = gr.Button("Clear", elem_id="clear-button", variant="secondary")
-                generate_button = gr.Button("Generate", elem_id="generate-button", variant="primary")
-
-        with gr.Column(scale=1):
-            image_output = gr.Image(type="pil", label="Image Output", elem_id="gallery")
-
-    generate_button.click(query, inputs=[text_prompt, negative_prompt, steps, cfg, method, seed, strength], outputs=image_output)
-    
-    def clear_prompt():
-        return gr.Textbox.update(value="")
-    
-    clear_button.click(clear_prompt, inputs=[], outputs=text_prompt)
+    gr.HTML("<center><h1>Generador de Sueños con Flux</h1></center>")
+    gr.HTML("<center><h2>Transforma tus sueños en imágenes vibrantes con un solo clic.</h2></center>")
+    with gr.Column(elem_id="app-container"):
+        with gr.Row():
+            with gr.Column():
+                text_prompt = gr.Textbox(label="Prompt", placeholder="Introduce un prompt aquí", lines=2, elem_id="prompt-text-input")
+                with gr.Accordion("Opciones avanzadas", open=False):
+                    negative_prompt = gr.Textbox(label="Prompt Negativo", placeholder="Qué no debería aparecer en la imagen", value="(deformed, distorted, disfigured), poorly drawn, bad anatomy, wrong anatomy, extra limb, missing limb, floating limbs, (mutated hands and fingers), disconnected limbs, mutation, mutated, ugly, disgusting, blurry, amputation, misspellings, typos", lines=3, elem_id="negative-prompt-text-input")
+                    steps = gr.Slider(label="Pasos de muestreo", value=35, minimum=1, maximum=100, step=1)
+                    cfg = gr.Slider(label="Escala CFG", value=7, minimum=1, maximum=20, step=1)
+                    method = gr.Radio(label="Método de muestreo", value="DPM++ 2M Karras", choices=["DPM++ 2M Karras", "DPM++ SDE Karras", "Euler", "Euler a", "Heun", "DDIM"])
+                    strength = gr.Slider(label="Fuerza", value=0.7, minimum=0, maximum=1, step=0.001)
+                    seed = gr.Slider(label="Semilla", value=-1, minimum=-1, maximum=1000000000, step=1)
+                    
+                    image_size = gr.Dropdown(
+                        label="Tamaño de Imagen",
+                        choices=[
+                            "4:3 (1024x768 px)",
+                            "16:9 (1920x1080 px)",
+                            "1:1 (1080x1080 px)",
+                            "1:1 (500x500 px)",
+                            "9:16 (720x1280 px)",
+                            "9:16 (1080x1920 px)"
+                        ],
+                        value="16:9 (1920x1080 px)"
+                    )
+
+            with gr.Column():
+                with gr.Row():
+                    generate_button = gr.Button("Generar", elem_id="generate-button", variant="primary")
+                with gr.Row():
+                    image_output = gr.Image(type="pil", label="Imagen de Salida", elem_id="gallery")
+        
+        generate_button.click(query, inputs=[text_prompt, negative_prompt, steps, cfg, method, seed, strength, image_size], outputs=image_output)
 
 app.launch(show_api=False, share=False)