Update app.py

app.py

@@ -1,4 +1,9 @@
 import os
+
+# Set this environment variable to disable torch.compiler features
+os.environ["TRANSFORMERS_NO_ADVISORY_WARNINGS"] = "1"
+os.environ["TRANSFORMERS_COMPILER_DISABLED"] = "1"
+
 import yaml
 import torch
 import sys
@@ -53,20 +58,27 @@ def load_message(height, width, seed, prompt, args, stage_a_tiled):
 def is_korean(text):
     return any('\uac00' <= char <= '\ud7a3' for char in text)
 
-def translate_if_korean(text):
+def translate_if_korean(text, translation_display=None):
     if is_korean(text):
         translated = translator(text, max_length=512)[0]['translation_text']
         print(f"Translated from Korean: {text} -> {translated}")
+        
+        # If translation_display is provided, update it to show the translation
+        if translation_display is not None:
+            translation_display.update(value=f"Original (Korean): {text}\nTranslation (English): {translated}", visible=True)
+            
         return translated
+    
+    # If not Korean, hide the translation display if it exists
+    if translation_display is not None:
+        translation_display.update(visible=False)
+    
     return text
 
 @spaces.GPU(duration=120)
 def get_image(height, width, seed, prompt, cfg, timesteps, stage_a_tiled):
     global args
     
-    # Translate the prompt if it's in Korean
-    prompt = translate_if_korean(prompt)
-    
     args = load_message(height, width, seed, prompt, args, stage_a_tiled)
     torch.manual_seed(args.seed)
     random.seed(args.seed) 
@@ -119,93 +131,311 @@ def get_image(height, width, seed, prompt, cfg, timesteps, stage_a_tiled):
             torch.cuda.empty_cache()
             imgs = show_images(sampled)
                     
-    return imgs[0]           
+    return imgs[0]
+
+def process_and_generate(height, width, seed, prompt, cfg, timesteps, stage_a_tiled, translation_display):
+    # First translate if needed and show the translation
+    translated_prompt = translate_if_korean(prompt, translation_display)
+    
+    # Then generate the image
+    return get_image(height, width, seed, translated_prompt, cfg, timesteps, stage_a_tiled)
 
 css = """
 footer {
     visibility: hidden;
 }
+
+/* Main container styling */
+#col-container {
+    max-width: 1200px;
+    margin: 0 auto;
+    padding: 20px;
+    background-color: #f8f9fa;
+    border-radius: 15px;
+    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
+}
+
+/* Header styling */
+h1 {
+    text-align: center;
+    color: #ff6b00;
+    font-size: 2.5rem;
+    margin-bottom: 20px;
+    font-weight: 700;
+    text-shadow: 1px 1px 2px rgba(0,0,0,0.1);
+}
+
+/* Button styling */
+button.primary {
+    background-color: #ff6b00 !important;
+    color: white !important;
+    border: none !important;
+    border-radius: 8px !important;
+    padding: 10px 20px !important;
+    font-weight: 600 !important;
+    transition: all 0.3s ease !important;
+}
+
+button.primary:hover {
+    background-color: #e55f00 !important;
+    transform: translateY(-2px);
+    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2) !important;
+}
+
+/* Input field styling */
+input[type="text"] {
+    border-radius: 8px !important;
+    border: 2px solid #ddd !important;
+    padding: 12px !important;
+    font-size: 1rem !important;
+    transition: all 0.3s ease !important;
+}
+
+input[type="text"]:focus {
+    border-color: #ff6b00 !important;
+    box-shadow: 0 0 0 3px rgba(255, 107, 0, 0.2) !important;
+}
+
+/* Output image container */
+.output-image {
+    border-radius: 12px;
+    overflow: hidden;
+    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15);
+    margin: 20px 0;
+    transition: all 0.3s ease;
+}
+
+.output-image:hover {
+    transform: scale(1.02);
+}
+
+/* Accordion styling */
+.accordion {
+    border-radius: 10px !important;
+    overflow: hidden !important;
+    margin: 15px 0 !important;
+    border: 1px solid #eaeaea !important;
+}
+
+/* Example gallery */
+.examples-gallery {
+    display: grid;
+    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
+    gap: 15px;
+    margin-top: 20px;
+}
+
+.example-item {
+    background-color: white;
+    border-radius: 10px;
+    padding: 10px;
+    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
+    transition: all 0.3s ease;
+}
+
+.example-item:hover {
+    transform: translateY(-5px);
+    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
+}
+
+/* Language indicator */
+.language-indicator {
+    background-color: #e6f7ff;
+    color: #0072b5;
+    border-radius: 20px;
+    padding: 2px 10px;
+    font-size: 0.8rem;
+    margin-left: 10px;
+    display: inline-block;
+}
+
+/* Loading animation */
+@keyframes pulse {
+    0% { opacity: 0.6; }
+    50% { opacity: 1; }
+    100% { opacity: 0.6; }
+}
+
+.loading {
+    animation: pulse 1.5s infinite;
+    text-align: center;
+    padding: 20px;
+    color: #ff6b00;
+    font-weight: bold;
+}
 """
 
 with gr.Blocks(theme="Yntec/HaleyCH_Theme_Orange", css=css) as demo:
     with gr.Column(elem_id="col-container"):
-        gr.Markdown("<h1><center>UHD(MAX 5120 X 4096 Pixel) Image Gen</center></h1>")
+        gr.Markdown("<h1>UHD Image Generator (5120×4096)</h1>")
         
-        with gr.Row():
-            prompt = gr.Textbox(
-                label="Text Prompt",
-                show_label=False,
-                max_lines=1,
-                placeholder="Enter your prompt in Korean or English",
-                container=False
+        with gr.Group():
+            with gr.Row():
+                with gr.Column(scale=5):
+                    prompt = gr.Textbox(
+                        label="Text Prompt",
+                        max_lines=2,
+                        placeholder="Enter your prompt in Korean or English (한국어나 영어로 프롬프트를 입력하세요)",
+                        elem_id="prompt-input"
+                    )
+                
+                with gr.Column(scale=1):
+                    generate_button = gr.Button("Generate Image", variant="primary", elem_id="generate-btn")
+                    clear_button = gr.Button("Clear", elem_id="clear-btn")
+        
+        # Language detection indicator
+        with gr.Row(visible=False) as language_indicator:
+            gr.Markdown('<div class="language-indicator">Korean detected - will translate to English</div>')
+        
+        # Translation display component
+        with gr.Row(visible=False) as translation_display:
+            translation_text = gr.Textbox(
+                label="Translation Information",
+                interactive=False
             )
-            polish_button = gr.Button("Submit", scale=0)
         
-        output_img = gr.Image(label="Output Image", show_label=False)
+        # Loading indicator
+        with gr.Row(visible=False) as loading_indicator:
+            gr.Markdown('<div class="loading">Generating your ultra high resolution image... This may take a minute...</div>')
+        
+        # Output image with nicer styling
+        output_img = gr.Image(label="Generated Image", elem_classes="output-image")
         
         with gr.Accordion("Advanced Settings", open=False):
-            seed = gr.Number(
-                label="Random Seed",
-                value=123,
-                step=1,
-                minimum=0,
-            )
-            
             with gr.Row():
-                width = gr.Slider(
-                    label="Width",
-                    minimum=1536,
-                    maximum=5120,
-                    step=32,
-                    value=4096
-                )
+                with gr.Column():
+                    seed = gr.Number(
+                        label="Random Seed",
+                        value=123,
+                        step=1,
+                        minimum=0,
+                    )
+                    
+                    cfg = gr.Slider(
+                        label="CFG Scale (Creativity vs. Prompt Adherence)",
+                        minimum=3,
+                        maximum=10,
+                        step=0.1,
+                        value=4
+                    )
                 
-                height = gr.Slider(
-                    label="Height",
-                    minimum=1536,
-                    maximum=4096,
-                    step=32,
-                    value=2304
-                )
+                with gr.Column():
+                    with gr.Row():
+                        width = gr.Slider(
+                            label="Width",
+                            minimum=1536,
+                            maximum=5120,
+                            step=32,
+                            value=4096
+                        )
+                        
+                        height = gr.Slider(
+                            label="Height",
+                            minimum=1536,
+                            maximum=4096,
+                            step=32,
+                            value=2304
+                        )
+                    
+                    timesteps = gr.Slider(
+                        label="Timesteps (Quality vs. Speed)",
+                        minimum=10,
+                        maximum=50,
+                        step=1,
+                        value=20
+                    )
+                    
+                    stage_a_tiled = gr.Checkbox(
+                        label="Use Tiled Decoding (Lower Memory Usage)",
+                        value=False
+                    )
+        
+        # Aspect ratio presets
+        with gr.Row():
+            gr.Markdown("### Quick Aspect Ratio Presets")
             
-            with gr.Row():
-                cfg = gr.Slider(
-                    label="CFG",
-                    minimum=3,
-                    maximum=10,
-                    step=0.1,
-                    value=4
-                )
-                
-                timesteps = gr.Slider(
-                    label="Timesteps",
-                    minimum=10,
-                    maximum=50,
-                    step=1,
-                    value=20
-                )
+        with gr.Row():
+            preset_landscape = gr.Button("Landscape (16:9)", size="sm")
+            preset_portrait = gr.Button("Portrait (9:16)", size="sm")
+            preset_square = gr.Button("Square (1:1)", size="sm")
+            preset_ultrawide = gr.Button("Ultrawide (21:9)", size="sm")
             
-            stage_a_tiled = gr.Checkbox(label="Stage_a_tiled", value=False)
-        
-        clear_button = gr.Button("Clear!")
+        # Examples with better organization
+        gr.Markdown("### Example Prompts")
+        with gr.Row():
+            example_tabs = gr.Tabs([
+                gr.TabItem("Nature", gr.Examples(
+                    examples=[
+                        "A detailed view of a blooming magnolia tree, with large, white flowers and dark green leaves, set against a clear blue sky.",
+                        "눈 덮인 산맥의 장엄한 전경, 푸른 하늘을 배경으로 한 고요한 호수가 있는 모습",
+                    ],
+                    inputs=[prompt],
+                    outputs=[output_img],
+                )),
+                gr.TabItem("Animals", gr.Examples(
+                    examples=[
+                        "스웨터를 입은 악어",
+                        "골든 리트리버 강아지가 푸른 잔디밭에서 빨간 공을 쫓는 귀여운 모습",
+                    ],
+                    inputs=[prompt],
+                    outputs=[output_img],
+                )),
+                gr.TabItem("Anime", gr.Examples(
+                    examples=[
+                        "A vibrant anime scene of a young girl with long, flowing pink hair, big sparkling blue eyes, and a school uniform, standing under a cherry blossom tree with petals falling around her.",
+                    ],
+                    inputs=[prompt],
+                    outputs=[output_img],
+                )),
+                gr.TabItem("Architecture", gr.Examples(
+                    examples=[
+                        "A cozy, rustic log cabin nestled in a snow-covered forest, with smoke rising from the stone chimney, warm lights glowing from the windows, and a path of footprints leading to the front door.",
+                    ],
+                    inputs=[prompt],
+                    outputs=[output_img],
+                )),
+            ])
+
+        # Function to set aspect ratio presets
+        def set_landscape():
+            return 5120, 2880
+            
+        def set_portrait():
+            return 2880, 4096
+            
+        def set_square():
+            return 3584, 3584
+            
+        def set_ultrawide():
+            return 5120, 2160
+            
+        # Connect buttons to functions
+        preset_landscape.click(set_landscape, outputs=[width, height])
+        preset_portrait.click(set_portrait, outputs=[width, height])
+        preset_square.click(set_square, outputs=[width, height])
+        preset_ultrawide.click(set_ultrawide, outputs=[width, height])
         
-        gr.Examples(
-            examples=[
-                "A detailed view of a blooming magnolia tree, with large, white flowers and dark green leaves, set against a clear blue sky.",
-                "눈 덮인 산맥의 장엄한 전경, 푸른 하늘을 배경으로 한 고요한 호수가 있는 모습",
-                "The image features a snow-covered mountain range with a large, snow-covered mountain in the background. The mountain is surrounded by a forest of trees, and the sky is filled with clouds. The scene is set during the winter season, with snow covering the ground and the trees.",
-                "스웨터를 입은 악어",
-                "A vibrant anime scene of a young girl with long, flowing pink hair, big sparkling blue eyes, and a school uniform, standing under a cherry blossom tree with petals falling around her. The background shows a traditional Japanese school with cherry blossoms in full bloom.",
-                "골든 리트리버 강아지가 푸른 잔디밭에서 빨간 공을 쫓는 귀여운 모습",
-                "A cozy, rustic log cabin nestled in a snow-covered forest, with smoke rising from the stone chimney, warm lights glowing from the windows, and a path of footprints leading to the front door.",
-            ],
-            inputs=[prompt],
-            outputs=[output_img],
-            examples_per_page=5
+        # Function to show Korean detection indicator
+        def check_korean(text):
+            if any('\uac00' <= char <= '\ud7a3' for char in text):
+                return gr.update(visible=True)
+            return gr.update(visible=False)
+            
+        # Connect events
+        prompt.change(check_korean, inputs=[prompt], outputs=[language_indicator])
+        generate_button.click(
+            lambda: gr.update(visible=True),
+            outputs=[loading_indicator]
+        ).then(
+            process_and_generate,
+            inputs=[height, width, seed, prompt, cfg, timesteps, stage_a_tiled, translation_display],
+            outputs=[output_img]
+        ).then(
+            lambda: gr.update(visible=False),
+            outputs=[loading_indicator]
         )
         
-        polish_button.click(get_image, inputs=[height, width, seed, prompt, cfg, timesteps, stage_a_tiled], outputs=output_img)           
-        polish_button.click(clear_image, inputs=[], outputs=output_img)
+        clear_button.click(clear_image, inputs=[], outputs=[output_img])
 
 def download_with_wget(url, save_path):
     try: