Update app.py

app.py

@@ -8,91 +8,110 @@ import spaces
 import torch
 from gradio_imageslider import ImageSlider
 from PIL import Image
-import requests
-import sys
-import subprocess
 from huggingface_hub import hf_hub_download
+import subprocess
+import sys
 import tempfile
+from typing import Sequence, Mapping, Any, Union
+import asyncio
+import execution
+from nodes import init_extra_nodes
+import server
+
+# Copy functions from FluxSimpleUpscaler.txt
+def get_value_at_index(obj: Union[Sequence, Mapping], index: int) -> Any:
+    try:
+        return obj[index]
+    except KeyError:
+        return obj["result"][index]
 
-os.environ["GIT_TERMINAL_PROMPT"] = "0"
+def find_path(name: str, path: str = None) -> str:
+    if path is None:
+        path = os.getcwd()
+    if name in os.listdir(path):
+        path_name = os.path.join(path, name)
+        print(f"{name} found: {path_name}")
+        return path_name
+    parent_directory = os.path.dirname(path)
+    if parent_directory == path:
+        return None
+    return find_path(name, parent_directory)
+
+def add_comfyui_directory_to_sys_path() -> None:
+    comfyui_path = find_path("ComfyUI")
+    if comfyui_path is not None and os.path.isdir(comfyui_path):
+        sys.path.append(comfyui_path)
+        print(f"'{comfyui_path}' added to sys.path")
+
+def add_extra_model_paths() -> None:
+    try:
+        from main import load_extra_path_config
+    except ImportError:
+        print("Could not import load_extra_path_config from main.py. Looking in utils.extra_config instead.")
+        from utils.extra_config import load_extra_path_config
+    extra_model_paths = find_path("extra_model_paths.yaml")
+    if extra_model_paths is not None:
+        load_extra_path_config(extra_model_paths)
+    else:
+        print("Could not find the extra_model_paths config file.")
+
+def import_custom_nodes() -> None:
+    import asyncio
+    import execution
+    from nodes import init_extra_nodes
+    import server
+    loop = asyncio.new_event_loop()
+    asyncio.set_event_loop(loop)
+    server_instance = server.PromptServer(loop)
+    execution.PromptQueue(server_instance)
+    init_extra_nodes()
 
 # Setup ComfyUI and custom nodes
 if not os.path.exists("ComfyUI"):
-    subprocess.run(["git", "clone", "https://github.com/comfyanonymous/ComfyUI"])
-
-custom_nodes_dir = os.path.join("ComfyUI", "custom_nodes")
-os.makedirs(custom_nodes_dir, exist_ok=True)
-
-# Clone UltimateSDUpscaler
-usd_dir = os.path.join(custom_nodes_dir, "ComfyUI_UltimateSDUpscaler")
-if not os.path.exists(usd_dir):
-    subprocess.run(["git", "clone", "https://github.com/ssitu/ComfyUI_UltimateSDUpscaler", usd_dir])
-
-# Clone comfy_mtb
-mtb_dir = os.path.join(custom_nodes_dir, "comfy_mtb")
-if not os.path.exists(mtb_dir):
-    subprocess.run(["git", "clone", "https://github.com/melMass/comfy_mtb", mtb_dir])
-    # Install requirements
-    if os.path.exists(os.path.join(mtb_dir, "requirements.txt")):
-        subprocess.run([sys.executable, "-m", "pip", "install", "-r", "requirements.txt"], cwd=mtb_dir)
-
-# Clone KJNodes
-kjn_dir = os.path.join(custom_nodes_dir, "ComfyUI-KJNodes")
-if not os.path.exists(kjn_dir):
-    subprocess.run(["git", "clone", "https://github.com/kijai/ComfyUI-KJNodes", kjn_dir])
-    # Install requirements
-    if os.path.exists(os.path.join(kjn_dir, "requirements.txt")):
-        subprocess.run([sys.executable, "-m", "pip", "install", "-r", "requirements.txt"], cwd=kjn_dir)
+    subprocess.run(["git", "clone", "https://github.com/comfyanonymous/ComfyUI.git"])
+
+custom_node_path = "ComfyUI/custom_nodes/ComfyUI_UltimateSDUpscale"
+if not os.path.exists(custom_node_path):
+    subprocess.run(["git", "clone", "https://github.com/ssitu/ComfyUI_UltimateSDUpscale.git", custom_node_path])
+
+# Create model directories
+os.makedirs("ComfyUI/models/unet", exist_ok=True)
+os.makedirs("ComfyUI/models/clip", exist_ok=True)
+os.makedirs("ComfyUI/models/vae", exist_ok=True)
+os.makedirs("ComfyUI/models/upscale_models", exist_ok=True)
 
 # Download models if not present
-comfy_models_dir = os.path.join("ComfyUI", "models")
-os.makedirs(comfy_models_dir, exist_ok=True)
-
-# Diffusion models (Flux FP8)
-diffusion_dir = os.path.join(comfy_models_dir, "diffusion_models")
-os.makedirs(diffusion_dir, exist_ok=True)
-if not os.path.exists(os.path.join(diffusion_dir, "flux1-dev-fp8.safetensors")):
-    hf_hub_download(repo_id="Kijai/flux-fp8", filename="flux1-dev-fp8.safetensors", local_dir=diffusion_dir)
-
-# CLIP models
-clip_dir = os.path.join(comfy_models_dir, "clip")
-os.makedirs(clip_dir, exist_ok=True)
-if not os.path.exists(os.path.join(clip_dir, "clip_l.safetensors")):
-    hf_hub_download(repo_id="comfyanonymous/flux_text_encoders", filename="clip_l.safetensors", local_dir=clip_dir)
-if not os.path.exists(os.path.join(clip_dir, "t5xxl_fp8_e4m3fn.safetensors")):
-    hf_hub_download(repo_id="comfyanonymous/flux_text_encoders", filename="t5xxl_fp8_e4m3fn.safetensors", local_dir=clip_dir)
-
-# VAE
-vae_dir = os.path.join(comfy_models_dir, "vae")
-os.makedirs(vae_dir, exist_ok=True)
-if not os.path.exists(os.path.join(vae_dir, "ae.safetensors")):
-    hf_hub_download(repo_id="black-forest-labs/FLUX.1-dev", filename="ae.safetensors", local_dir=vae_dir)
-
-# Upscale models
-upscale_dir = os.path.join(comfy_models_dir, "upscale_models")
-os.makedirs(upscale_dir, exist_ok=True)
-for model_name in ["RealESRGAN_x2.pth", "RealESRGAN_x4.pth"]:
-    model_path = os.path.join(upscale_dir, model_name)
-    if not os.path.exists(model_path):
-        url = f"https://huggingface.co/ai-forever/Real-ESRGAN/resolve/main/{model_name}"
-        with open(model_path, "wb") as f:
-            f.write(requests.get(url).content)
-
-# Add ComfyUI to sys.path
-sys.path.append(os.path.abspath("ComfyUI"))
-
-# Import custom nodes
-from nodes import NODE_CLASS_MAPPINGS, init_custom_nodes
-init_custom_nodes()
-
-# From the provided script
-def get_value_at_index(obj, index):
-    try:
-        return obj[index]
-    except KeyError:
-        return obj["result"][index]
+unet_path = "ComfyUI/models/unet/flux1-dev-fp8.safetensors"
+if not os.path.exists(unet_path):
+    hf_hub_download("Kijai/flux-fp8", "flux1-dev-fp8.safetensors", local_dir="ComfyUI/models/unet")
+
+clip_l_path = "ComfyUI/models/clip/clip_l.safetensors"
+if not os.path.exists(clip_l_path):
+    hf_hub_download("comfyanonymous/flux_text_encoders", "clip_l.safetensors", local_dir="ComfyUI/models/clip")
+
+t5_path = "ComfyUI/models/clip/t5xxl_fp8_e4m3fn.safetensors"
+if not os.path.exists(t5_path):
+    hf_hub_download("comfyanonymous/flux_text_encoders", "t5xxl_fp8_e4m3fn.safetensors", local_dir="ComfyUI/models/clip")
+
+vae_path = "ComfyUI/models/vae/ae.safetensors"
+if not os.path.exists(vae_path):
+    hf_hub_download("black-forest-labs/FLUX.1-dev", "ae.safetensors", subfolder="vae", local_dir="ComfyUI/models/vae")
+
+esrgan_x2_path = "ComfyUI/models/upscale_models/RealESRGAN_x2.pth"
+if not os.path.exists(esrgan_x2_path):
+    hf_hub_download("ai-forever/Real-ESRGAN", "RealESRGAN_x2.pth", local_dir="ComfyUI/models/upscale_models")
+
+esrgan_x4_path = "ComfyUI/models/upscale_models/RealESRGAN_x4.pth"
+if not os.path.exists(esrgan_x4_path):
+    hf_hub_download("ai-forever/Real-ESRGAN", "RealESRGAN_x4.pth", local_dir="ComfyUI/models/upscale_models")
+
+# Add ComfyUI to path and import custom nodes
+add_comfyui_directory_to_sys_path()
+add_extra_model_paths()
+import_custom_nodes()
+
+from nodes import NODE_CLASS_MAPPINGS
 
-# CSS and constants similar to original
 css = """
 #col-container {
     margin: 0 auto;
@@ -104,7 +123,6 @@ css = """
 }
 """
 
-power_device = "ZeroGPU"
 MAX_SEED = 1000000
 MAX_PIXEL_BUDGET = 8192 * 8192
 
@@ -118,7 +136,7 @@ def process_input(input_image, upscale_factor):
     was_resized = False
 
     if w * h * upscale_factor**2 > MAX_PIXEL_BUDGET:
-        gr.Info("Requested output too large. Resizing input.")
+        gr.Info(f"Requested output image is too large. Resizing input to fit within pixel budget.")
         target_input_pixels = MAX_PIXEL_BUDGET / (upscale_factor ** 2)
         scale = (target_input_pixels / (w * h)) ** 0.5
         new_w = max(16, int(w * scale) // 16 * 16)
@@ -128,13 +146,19 @@ def process_input(input_image, upscale_factor):
 
     return input_image, w_original, h_original, was_resized
 
+import requests
 def load_image_from_url(url):
     try:
         response = requests.get(url, stream=True)
         response.raise_for_status()
         return Image.open(response.raw)
     except Exception as e:
-        raise gr.Error(f"Failed to load image: {e}")
+        raise gr.Error(f"Failed to load image from URL: {e}")
+
+def tensor_to_pil(tensor):
+    tensor = tensor.cpu().clamp(0, 1) * 255
+    img = tensor.numpy().astype(np.uint8)[0]
+    return Image.fromarray(img)
 
 @spaces.GPU(duration=120)
 def enhance_image(
@@ -149,71 +173,73 @@ def enhance_image(
     tile_size,
     progress=gr.Progress(track_tqdm=True),
 ):
-    with torch.inference_mode():
-        # Handle input image
-        if image_input is not None:
-            true_input_image = image_input
-        elif image_url:
-            true_input_image = load_image_from_url(image_url)
-        else:
-            raise gr.Error("Provide an image or URL")
-
-        input_image, w_original, h_original, was_resized = process_input(true_input_image, upscale_factor)
-
-        if randomize_seed:
-            seed = random.randint(0, MAX_SEED)
-
-        # Prepare ComfyUI input image
-        input_dir = os.path.join("ComfyUI", "input")
-        os.makedirs(input_dir, exist_ok=True)
-        temp_filename = f"input_{random.randint(0, 1000000)}.png"
-        input_path = os.path.join(input_dir, temp_filename)
-        input_image.save(input_path)
-
-        # Nodes
-        load_image_node = NODE_CLASS_MAPPINGS["LoadImage"]()
-        image_loaded = load_image_node.load_image(image=temp_filename)
-        image = get_value_at_index(image_loaded, 0)
-
-        text_multiline = NODE_CLASS_MAPPINGS["Text Multiline"]()
-        text_out = text_multiline.text_multiline(text=custom_prompt if custom_prompt.strip() else "")
-        prompt_text = get_value_at_index(text_out, 0)
+    if image_input is not None:
+        true_input_image = image_input
+    elif image_url:
+        true_input_image = load_image_from_url(image_url)
+    else:
+        raise gr.Error("Please provide an image (upload or URL)")
+
+    if randomize_seed:
+        seed = random.randint(0, MAX_SEED)
+
+    input_image, w_original, h_original, was_resized = process_input(true_input_image, upscale_factor)
+
+    if upscale_factor == 2:
+        upscale_model_name = "RealESRGAN_x2.pth"
+    else:
+        upscale_model_name = "RealESRGAN_x4.pth"
 
+    with tempfile.NamedTemporaryFile(suffix=".png", delete=False) as tmp:
+        input_image.save(tmp.name)
+        image_path = tmp.name
+
+    with torch.inference_mode():
         dualcliploader = NODE_CLASS_MAPPINGS["DualCLIPLoader"]()
-        clip_out = dualcliploader.load_clip(
+        dualcliploader_res = dualcliploader.load_clip(
             clip_name1="clip_l.safetensors",
             clip_name2="t5xxl_fp8_e4m3fn.safetensors",
             type="flux",
         )
-        clip = get_value_at_index(clip_out, 0)
+        clip = get_value_at_index(dualcliploader_res, 0)
 
         cliptextencode = NODE_CLASS_MAPPINGS["CLIPTextEncode"]()
-        conditioning = get_value_at_index(cliptextencode.encode(text=prompt_text, clip=clip), 0)
-
-        fluxguidance = NODE_CLASS_MAPPINGS["FluxGuidance"]()
-        positive_out = fluxguidance.append(guidance=3.5, conditioning=conditioning)  # Using 3.5 as in original app
-        positive = get_value_at_index(positive_out, 0)
-
-        conditioningzeroout = NODE_CLASS_MAPPINGS["ConditioningZeroOut"]()
-        negative_out = conditioningzeroout.zero_out(conditioning=conditioning)
-        negative = get_value_at_index(negative_out, 0)
+        positive_res = cliptextencode.encode(
+            text=custom_prompt,
+            clip=clip
+        )
+        negative_res = cliptextencode.encode(
+            text="",
+            clip=clip
+        )
 
-        upscale_name = "RealESRGAN_x2.pth" if upscale_factor == 2 else "RealESRGAN_x4.pth"
         upscalemodelloader = NODE_CLASS_MAPPINGS["UpscaleModelLoader"]()
-        upscale_model = get_value_at_index(upscalemodelloader.load_model(model_name=upscale_name), 0)
+        upscalemodelloader_res = upscalemodelloader.load_model(
+            model_name=upscale_model_name
+        )
 
         vaeloader = NODE_CLASS_MAPPINGS["VAELoader"]()
-        vae = get_value_at_index(vaeloader.load_vae(vae_name="ae.safetensors"), 0)
+        vaeloader_res = vaeloader.load_vae(vae_name="ae.safetensors")
+
+        unetloader = NODE_CLASS_MAPPINGS["UNETLoader"]()
+        unetloader_res = unetloader.load_unet(
+            unet_name="flux1-dev-fp8.safetensors", weight_dtype="fp8_e4m3fn"
+        )
 
-        unetloader = NODE_CLASS_MAPPINGS["LoadDiffusionModel"]()
-        model = get_value_at_index(unetloader.load_diffusion_model(unet_name="flux1-dev-fp8.safetensors", weight_dtype="fp8_e4m3fn"), 0)
+        loadimage = NODE_CLASS_MAPPINGS["LoadImage"]()
+        loadimage_res = loadimage.load_image(image=os.path.basename(image_path))
+
+        fluxguidance = NODE_CLASS_MAPPINGS["FluxGuidance"]()
+        fluxguidance_res = fluxguidance.append(
+            guidance=30, conditioning=get_value_at_index(positive_res, 0)
+        )
 
         ultimatesdupscale = NODE_CLASS_MAPPINGS["UltimateSDUpscale"]()
-        upscale_out = ultimatesdupscale.upscale(
-            upscale_by=float(upscale_factor),
+        usd_res = ultimatesdupscale.upscale(
+            upscale_by=upscale_factor,
             seed=seed,
             steps=num_inference_steps,
-            cfg=1.0,
+            cfg=1,
             sampler_name="euler",
             scheduler="normal",
             denoise=denoising_strength,
@@ -223,47 +249,45 @@ def enhance_image(
             mask_blur=8,
             tile_padding=32,
             seam_fix_mode="None",
-            seam_fix_denoise=1.0,
+            seam_fix_denoise=1,
             seam_fix_width=64,
             seam_fix_mask_blur=8,
             seam_fix_padding=16,
             force_uniform_tiles=True,
             tiled_decode=False,
-            image=image,
-            model=model,
-            positive=positive,
-            negative=negative,
-            vae=vae,
-            upscale_model=upscale_model,
+            image=get_value_at_index(loadimage_res, 0),
+            model=get_value_at_index(unetloader_res, 0),
+            positive=get_value_at_index(fluxguidance_res, 0),
+            negative=get_value_at_index(negative_res, 0),
+            vae=get_value_at_index(vaeloader_res, 0),
+            upscale_model=get_value_at_index(upscalemodelloader_res, 0),
         )
-        upscaled_tensor = get_value_at_index(upscale_out, 0)
 
-        # Convert to PIL
-        upscaled_img = Image.fromarray((upscaled_tensor[0].cpu().numpy() * 255).astype(np.uint8))
+        output_tensor = get_value_at_index(usd_res, 0)
+        image = tensor_to_pil(output_tensor)
 
-        target_w, target_h = w_original * upscale_factor, h_original * upscale_factor
-        if upscaled_img.size != (target_w, target_h):
-            upscaled_img = upscaled_img.resize((target_w, target_h), resample=Image.LANCZOS)
+    os.unlink(image_path)
 
-        if was_resized:
-            upscaled_img = upscaled_img.resize((target_w, target_h), resample=Image.LANCZOS)
+    target_w, target_h = w_original * upscale_factor, h_original * upscale_factor
+    if image.size != (target_w, target_h):
+        image = image.resize((target_w, target_h), resample=Image.LANCZOS)
 
-        resized_input = true_input_image.resize(upscaled_img.size, resample=Image.LANCZOS)
+    if was_resized:
+        gr.Info(f"Resizing output to target size: {target_w}x{target_h}")
+        image = image.resize((target_w, target_h), resample=Image.LANCZOS)
 
-        # Cleanup temp file
-        os.remove(input_path)
+    resized_input = true_input_image.resize(image.size, resample=Image.LANCZOS)
 
-        return [resized_input, upscaled_img]
+    return [resized_input, image]
 
-# Gradio interface similar to original
-with gr.Blocks(css=css, title="🎨 AI Image Upscaler - Flux FP8") as demo:
+with gr.Blocks(css=css, title="🎨 AI Image Upscaler - FLUX ComfyUI") as demo:
     gr.HTML("""
     <div class="main-header">
-        <h1>🎨 AI Image Upscaler - Flux FP8</h1>
-        <p>Upscale images using Flux FP8 with ComfyUI workflow</p>
-        <p>Running on <strong>{}</strong></p>
+        <h1>🎨 AI Image Upscaler (ComfyUI Workflow)</h1>
+        <p>Upload an image or provide a URL to upscale it using FLUX FP8 with ComfyUI Ultimate SD Upscale</p>
+        <p>Using FLUX.1-dev FP8 model</p>
     </div>
-    """.format(power_device))
+    """)
 
     with gr.Row():
         with gr.Column(scale=1):
@@ -271,7 +295,11 @@ with gr.Blocks(css=css, title="🎨 AI Image Upscaler - Flux FP8") as demo:
             
             with gr.Tabs():
                 with gr.TabItem("📁 Upload Image"):
-                    input_image = gr.Image(label="Upload Image", type="pil", height=200)
+                    input_image = gr.Image(
+                        label="Upload Image",
+                        type="pil",
+                        height=200
+                    )
                 
                 with gr.TabItem("🔗 Image URL"):
                     image_url = gr.Textbox(
@@ -295,15 +323,17 @@ with gr.Blocks(css=css, title="🎨 AI Image Upscaler - Flux FP8") as demo:
                 minimum=1,
                 maximum=4,
                 step=1,
-                value=2
+                value=2,
+                info="How much to upscale the image"
             )
             
             num_inference_steps = gr.Slider(
-                label="Inference Steps",
+                label="Number of Inference Steps",
                 minimum=1,
                 maximum=50,
                 step=1,
-                value=25
+                value=25,
+                info="More steps = better quality but slower"
             )
             
             denoising_strength = gr.Slider(
@@ -311,7 +341,8 @@ with gr.Blocks(css=css, title="🎨 AI Image Upscaler - Flux FP8") as demo:
                 minimum=0.0,
                 maximum=1.0,
                 step=0.05,
-                value=0.3
+                value=0.3,
+                info="Controls how much the image is transformed"
             )
 
             tile_size = gr.Slider(
@@ -319,19 +350,40 @@ with gr.Blocks(css=css, title="🎨 AI Image Upscaler - Flux FP8") as demo:
                 minimum=256,
                 maximum=2048,
                 step=64,
-                value=1024
+                value=1024,
+                info="Size of tiles for processing (larger = faster but more memory)"
             )
             
             with gr.Row():
-                randomize_seed = gr.Checkbox(label="Randomize seed", value=True)
-                seed = gr.Slider(label="Seed", minimum=0, maximum=MAX_SEED, step=1, value=42)
+                randomize_seed = gr.Checkbox(
+                    label="Randomize seed",
+                    value=True
+                )
+                seed = gr.Slider(
+                    label="Seed",
+                    minimum=0,
+                    maximum=MAX_SEED,
+                    step=1,
+                    value=42,
+                    interactive=True
+                )
             
-            enhance_btn = gr.Button("🚀 Upscale Image", variant="primary", size="lg")
+            enhance_btn = gr.Button(
+                "🚀 Upscale Image",
+                variant="primary",
+                size="lg"
+            )
 
         with gr.Column(scale=2):
             gr.HTML("<h3>📊 Results</h3>")
             
-            result_slider = ImageSlider(type="pil", interactive=False, height=600, label=None)
+            result_slider = ImageSlider(
+                type="pil",
+                interactive=False,
+                height=600,
+                elem_id="result_slider",
+                label=None
+            )
 
     enhance_btn.click(
         fn=enhance_image,
@@ -351,18 +403,63 @@ with gr.Blocks(css=css, title="🎨 AI Image Upscaler - Flux FP8") as demo:
     
     gr.HTML("""
     <div style="margin-top: 2rem; padding: 1rem; background: #f0f0f0; border-radius: 8px;">
-        <p><strong>Note:</strong> Uses Flux FP8 model. Ensure compliance with licenses for commercial use.</p>
+        <p><strong>Note:</strong> This upscaler uses the Flux.1-dev model. Users are responsible for obtaining commercial rights if used commercially under their license.</p>
     </div>
     """)
     
     gr.HTML("""
     <style>
-        #result_slider .slider { width: 100% !important; }
-        #result_slider img { object-fit: contain !important; width: 100% !important; height: auto !important; }
-        #result_slider .gr-button-tool, #result_slider .gr-button-undo, #result_slider .gr-button-clear { display: none !important; }
-        #result_slider .badge-container .badge { display: none !important; }
-        #result_slider .badge-container::before { content: "Before"; position: absolute; top: 10px; left: 10px; background: rgba(0,0,0,0.5); color: white; padding: 5px; border-radius: 5px; z-index: 10; }
-        #result_slider .badge-container::after { content: "After"; position: absolute; top: 10px; right: 10px; background: rgba(0,0,0,0.5); color: white; padding: 5px; border-radius: 5px; z-index: 10; }
+        #result_slider .slider {
+            width: 100% !important;
+            max-width: inherit !important;
+        }
+        #result_slider img {
+            object-fit: contain !important;
+            width: 100% !important;
+            height: auto !important;
+        }
+        #result_slider .gr-button-tool {
+            display: none !important;
+        }
+        #result_slider .gr-button-undo {
+            display: none !important;
+        }
+        #result_slider .gr-button-clear {
+            display: none !important;
+        }
+        #result_slider .badge-container .badge {
+            display: none !important;
+        }
+        #result_slider .badge-container::before {
+            content: "Before";
+            position: absolute;
+            top: 10px;
+            left: 10px;
+            background: rgba(0,0,0,0.5);
+            color: white;
+            padding: 5px;
+            border-radius: 5px;
+            z-index: 10;
+        }
+        #result_slider .badge-container::after {
+            content: "After";
+            position: absolute;
+            top: 10px;
+            right: 10px;
+            background: rgba(0,0,0,0.5);
+            color: white;
+            padding: 5px;
+            border-radius: 5px;
+            z-index: 10;
+        }
+        #result_slider .fullscreen img {
+            object-fit: contain !important;
+            width: 100vw !important;
+            height: 100vh !important;
+            position: absolute;
+            top: 0;
+            left: 0;
+        }
     </style>
     """)
     
@@ -370,7 +467,10 @@ with gr.Blocks(css=css, title="🎨 AI Image Upscaler - Flux FP8") as demo:
     <script>
         document.addEventListener('DOMContentLoaded', function() {
             const sliderInput = document.querySelector('#result_slider input[type="range"]');
-            if (sliderInput) { sliderInput.value = 50; sliderInput.dispatchEvent(new Event('input')); }
+            if (sliderInput) {
+                sliderInput.value = 50;
+                sliderInput.dispatchEvent(new Event('input'));
+            }
         });
     </script>
     """)