Update app.py

app.py

@@ -12,6 +12,7 @@ from diffusers.utils import load_image
 from diffusers.utils import export_to_video
 import random
 from transformers import pipeline
+
 # Translation model load
 translator = pipeline("translation", model="Helsinki-NLP/opus-mt-ko-en")
 
@@ -35,31 +36,29 @@ english_labels = {
     "Seed": "Seed"
 }
 
-# load pipelines
+# Load pipelines
 base_model = "black-forest-labs/FLUX.1-schnell"
 
 taef1 = AutoencoderTiny.from_pretrained("madebyollin/taef1", torch_dtype=torch.bfloat16).to("cuda")
-pipe = FluxPipeline.from_pretrained(base_model,
-                                    vae=taef1,
-                                    torch_dtype=torch.bfloat16)
-
+pipe = FluxPipeline.from_pretrained(
+    base_model,
+    vae=taef1,
+    torch_dtype=torch.bfloat16
+)
 pipe.transformer.to(memory_format=torch.channels_last)
 clip_slider = CLIPSliderFlux(pipe, device=torch.device("cuda"))
 
-MAX_SEED = 2**32-1
+MAX_SEED = 2**32 - 1
 
 def save_images_with_unique_filenames(image_list, save_directory):
     if not os.path.exists(save_directory):
         os.makedirs(save_directory)
-
     paths = []
     for image in image_list:
         unique_filename = f"{uuid.uuid4()}.png"
         file_path = os.path.join(save_directory, unique_filename)
-
         image.save(file_path)
         paths.append(file_path)
-
     return paths
 
 def convert_to_centered_scale(num):
@@ -91,8 +90,7 @@ def generate(prompt,
              x_concept_1="", x_concept_2="",
              avg_diff_x=None,
              total_images=[],
-             gradio_progress=gr.Progress()
-    ):
+             gradio_progress=gr.Progress()):
     # Translate prompt and concepts if Korean
     prompt = translate_if_korean(prompt)
     concept_1 = translate_if_korean(concept_1)
@@ -100,7 +98,7 @@ def generate(prompt,
 
     print(f"Prompt: {prompt}, ← {concept_2}, {concept_1} ➡️ . scale {scale}, interm steps {interm_steps}")
     slider_x = [concept_2, concept_1]
-    # check if avg diff for directions need to be re-calculated
+    # Re-calculate latent direction if needed
     if randomize_seed:
         seed = random.randint(0, MAX_SEED)
 
@@ -116,18 +114,22 @@ def generate(prompt,
     low_scale = -1 * scale
     for i in gradio_progress.tqdm(range(interm_steps), desc="Generating images"):
         cur_scale = low_scale + (high_scale - low_scale) * i / (interm_steps - 1)
-        image = clip_slider.generate(prompt,
-                                     width=768,
-                                     height=768,
-                                     guidance_scale=guidance_scale,
-                                     scale=cur_scale,  seed=seed, num_inference_steps=steps, avg_diff=avg_diff)
+        image = clip_slider.generate(
+            prompt,
+            width=768,
+            height=768,
+            guidance_scale=guidance_scale,
+            scale=cur_scale,
+            seed=seed,
+            num_inference_steps=steps,
+            avg_diff=avg_diff
+        )
         images.append(image)
-    canvas = Image.new('RGB', (256*interm_steps, 256))
+    canvas = Image.new('RGB', (256 * interm_steps, 256))
     for i, im in enumerate(images):
-        canvas.paste(im.resize((256,256)), (256 * i, 0))
+        canvas.paste(im.resize((256, 256)), (256 * i, 0))
 
     comma_concepts_x = f"{slider_x[1]}, {slider_x[0]}"
-
     scale_total = convert_to_centered_scale(interm_steps)
     scale_min = scale_total[0]
     scale_max = scale_total[-1]
@@ -140,9 +142,7 @@ def generate(prompt,
     return x_concept_1, x_concept_2, avg_diff_x, export_to_video(images, video_path, fps=5), canvas, images, images[scale_middle], post_generation_slider_update, seed
 
 def update_pre_generated_images(slider_value, total_images):
-    number_images = 0
-    if total_images:
-        number_images = len(total_images)
+    number_images = len(total_images) if total_images else 0
     if number_images > 0:
         scale_tuple = convert_to_centered_scale(number_images)
         return total_images[scale_tuple.index(slider_value)][0]
@@ -152,41 +152,18 @@ def update_pre_generated_images(slider_value, total_images):
 def reset_recalc_directions():
     return True
 
-# =======================
-# 개선된 예제 프롬프트
-# =======================
+# Five examples fitting the "Time Stream" theme (one Korean example included)
 examples = [
-    [
-        "A serene mountain landscape with a gentle river flowing in the foreground under a bright blue sky.",
-        "Early Spring",
-        "Deep Winter",
-        1.5
-    ],
-    [
-        "A bustling city street at dusk with neon lights reflecting on wet pavement, capturing the contrast between day and night.",
-        "Daytime",
-        "Nighttime",
-        2.5
-    ],
-    [
-        "An abstract digital art composition featuring vibrant colors and dynamic shapes.",
-        "Calm",
-        "Energetic",
-        2.0
-    ],
-    [
-        "여성의 미소와 함께하는 따뜻한 분위기의 인물 사진",
-        "젊음",
-        "노년",
-        2.5
-    ]
+    ["신선한 토마토가 부패한 토마토�� 변해가는 과정", "Fresh", "Rotten", 2.0],
+    ["A blooming flower gradually withers into decay", "Bloom", "Wither", 1.5],
+    ["A vibrant cityscape transforms into a derelict ruin over time", "Modern", "Ruined", 2.5],
+    ["A lively forest slowly changes into an autumnal landscape", "Spring", "Autumn", 2.0],
+    ["A calm ocean evolves into a stormy seascape as time passes", "Calm", "Stormy", 3.0]
 ]
 
-# =======================
-# 밝고 세련된 UI CSS
-# =======================
+# CSS for a bright and modern UI with a background image
 css = """
-/* 배경 이미지와 밝은 톤 적용 */
+/* Bright and modern UI with background image */
 body {
     background: #ffffff url('https://images.unsplash.com/photo-1506748686214-e9df14d4d9d0?ixlib=rb-1.2.1&auto=format&fit=crop&w=1600&q=80') no-repeat center center fixed;
     background-size: cover;
@@ -237,7 +214,10 @@ footer {
 }
 """
 
-with gr.Blocks(css=css) as demo:
+with gr.Blocks(css=css, title="타임 스트림") as demo:
+    # Title and Description
+    gr.Markdown("# 타임 스트림\nA creative journey through the transformation of images over time.")
+    
     x_concept_1 = gr.State("")
     x_concept_2 = gr.State("")
     total_images = gr.State([])
@@ -261,15 +241,14 @@ with gr.Blocks(css=css) as demo:
                             concept_1 = gr.Textbox(
                                 label=english_labels["1st direction to steer"],
                                 info="Initial state",
-                                placeholder="winter"
+                                placeholder="Fresh"
                             )
                         with gr.Column(scale=1):
                             concept_2 = gr.Textbox(
                                 label=english_labels["2nd direction to steer"],
                                 info="Final state",
-                                placeholder="summer"
+                                placeholder="Rotten"
                             )
-
                     with gr.Row(elem_classes="slider-container"):
                         x = gr.Slider(
                             minimum=0,
@@ -279,7 +258,6 @@ with gr.Blocks(css=css) as demo:
                             label=english_labels["Strength"],
                             info="Maximum strength for each direction (above 2.5 may be unstable)"
                         )
-
                     submit = gr.Button(english_labels["Generate directions"], size="lg", variant="primary")
 
             # Advanced Options Panel
@@ -301,7 +279,6 @@ with gr.Blocks(css=css) as demo:
                             step=0.1,
                             value=3.5
                         )
-
                 with gr.Row():
                     with gr.Column(scale=1):
                         iterations = gr.Slider(
@@ -319,7 +296,6 @@ with gr.Blocks(css=css) as demo:
                             maximum=4,
                             step=1
                         )
-
                 with gr.Row():
                     with gr.Column(scale=1):
                         randomize_seed = gr.Checkbox(
@@ -337,32 +313,27 @@ with gr.Blocks(css=css) as demo:
                         )
 
         # Right Column - Output
-        with gr.Column(scale=6):
+        with gr.Column(scale=8):
             with gr.Group(elem_classes="main-panel"):
                 gr.Markdown("### Generated Results")
+                # Video output on top (bigger) and image output below
+                output_video = gr.Video(
+                    label=english_labels["Looping video"],
+                    elem_id="video",
+                    loop=True,
+                    autoplay=True,
+                    height=400
+                )
                 with gr.Row():
-                    with gr.Column(scale=3):
-                        image_seq = gr.Image(
-                            label=english_labels["Strip"],
-                            elem_id="strip",
-                            height=100
-                        )
-                    with gr.Column(scale=2):
-                        output_image = gr.Video(
-                            label=english_labels["Looping video"],
-                            elem_id="video",
-                            loop=True,
-                            autoplay=True,
-                            height=100
-                        )
-                with gr.Row():  # Moved this block to be after the video
-                    with gr.Column():
+                    with gr.Column(scale=1):
                         post_generation_image = gr.Image(
                             label=english_labels["Generated Images"],
                             type="filepath",
                             elem_id="interactive",
-                            elem_classes="image-display"
+                            elem_classes="image-display",
+                            height=200
                         )
+                    with gr.Column(scale=1):
                         post_generation_slider = gr.Slider(
                             minimum=-10,
                             maximum=10,
@@ -376,19 +347,35 @@ with gr.Blocks(css=css) as demo:
         examples=examples,
         inputs=[prompt, concept_1, concept_2, x],
         fn=generate,
-        outputs=[x_concept_1, x_concept_2, avg_diff_x, output_image, image_seq, total_images,
-                post_generation_image, post_generation_slider, seed],
+        outputs=[
+            x_concept_1, x_concept_2, avg_diff_x,
+            output_video,  # video output (larger)
+            canvas,        # image strip (below video)
+            total_images,
+            post_generation_image,
+            post_generation_slider,
+            seed
+        ],
         cache_examples="lazy"
     )
 
     # Event Handlers
     submit.click(
         fn=generate,
-        inputs=[prompt, concept_1, concept_2, x, randomize_seed, seed, recalc_directions,
-                iterations, steps, interm_steps, guidance_scale, x_concept_1, x_concept_2,
-                avg_diff_x, total_images],
-        outputs=[x_concept_1, x_concept_2, avg_diff_x, output_image, image_seq, total_images,
-                post_generation_image, post_generation_slider, seed]
+        inputs=[
+            prompt, concept_1, concept_2, x, randomize_seed, seed,
+            recalc_directions, iterations, steps, interm_steps,
+            guidance_scale, x_concept_1, x_concept_2, avg_diff_x, total_images
+        ],
+        outputs=[
+            x_concept_1, x_concept_2, avg_diff_x,
+            output_video,  # video output (larger)
+            canvas,        # image strip (below video)
+            total_images,
+            post_generation_image,
+            post_generation_slider,
+            seed
+        ]
     )
 
     iterations.change(fn=reset_recalc_directions, outputs=[recalc_directions])