flux_app/frontend.py

# frontend.py
import gradio as gr
import sys
import os

# Add the parent directory to sys.path
parent_dir = os.path.abspath(os.path.join(os.path.dirname(__file__), ".."))
sys.path.insert(0, parent_dir)
#print(sys.path) #DEBUG

from flux_app.backend import ModelManager  # Absolute import
from flux_app.config import MAX_SEED      # Absolute import
from flux_app.lora_handling import (
    add_custom_lora, remove_custom_lora, prepare_prompt,
    unload_lora_weights, load_lora_weights_into_pipeline, update_selection
)
from flux_app.utilities import randomize_seed_if_needed, calculateDuration  # Absolute import
import spaces

# Import the prompt enhancer generate function from the new module
from flux_app.enhance import generate

# Dummy loras data for initial UI setup.
initial_loras = [
    {"image": "placeholder.jpg", "title": "Placeholder LoRA", "repo": "placeholder/repo", "weights": None, "trigger_word": ""},
]

class Frontend:
    def __init__(self, model_manager: ModelManager):
        self.model_manager = model_manager
        self.loras = initial_loras
        self.load_initial_loras()
        self.css = self.define_css()

    def define_css(self):
        # A cleaner, professional CSS styling.
        return '''
        /* Title Styling */
        #title {
            text-align: center;
            margin-bottom: 20px;
        }
        #title h1 {
            font-size: 2.5rem;
            margin: 0;
            color: #333;
        }
        /* Button and Column Styling */
        #gen_btn {
            width: 100%;
            padding: 12px;
            font-weight: bold;
            border-radius: 5px;
        }
        #gen_column {
            display: flex;
            align-items: center;
            justify-content: center;
        }
        /* Gallery and List Styling */
        #gallery .grid-wrap {
            margin-top: 15px;
        }
        #lora_list {
            background-color: #f5f5f5;
            padding: 10px;
            border-radius: 4px;
            font-size: 0.9rem;
        }
        .card_internal {
            display: flex;
            align-items: center;
            height: 100px;
            margin-top: 10px;
        }
        .card_internal img {
            margin-right: 10px;
        }
        .styler {
            --form-gap-width: 0px !important;
        }
        /* Progress Bar Styling */
        .progress-container {
            width: 100%;
            height: 20px;
            background-color: #e0e0e0;
            border-radius: 10px;
            overflow: hidden;
            margin-bottom: 20px;
        }
        .progress-bar {
            height: 100%;
            background-color: #4f46e5;
            transition: width 0.3s ease-in-out;
            width: calc(var(--current) / var(--total) * 100%);
        }
        '''

    def load_initial_loras(self):
        try:
            from flux_app.lora import loras as loras_list  # Absolute import
            self.loras = loras_list
        except ImportError:
            print("Warning: lora.py not found, using placeholder LoRAs.")
            pass

    @spaces.GPU(duration=100)
    def run_lora(self, prompt, image_input, image_strength, cfg_scale, steps, selected_index, randomize_seed, seed, width, height, lora_scale, use_enhancer, progress=gr.Progress(track_tqdm=True)):
        # If prompt enhancer is enabled, generate the enhanced prompt.
        if use_enhancer:
            enhanced_prompt = ""
            # Generate the enhanced prompt (consume the generator to get the final result)
            for chunk in generate(prompt):
                enhanced_prompt = chunk
            prompt_used = enhanced_prompt
        else:
            enhanced_prompt = ""
            prompt_used = prompt

        seed = randomize_seed_if_needed(randomize_seed, seed, MAX_SEED)
        prompt_mash = prepare_prompt(prompt_used, selected_index, self.loras)
        selected_lora = self.loras[selected_index]

        unload_lora_weights(self.model_manager.pipe, self.model_manager.pipe_i2i)
        pipe_to_use = self.model_manager.pipe_i2i if image_input is not None else self.model_manager.pipe
        load_lora_weights_into_pipeline(pipe_to_use, selected_lora["repo"], selected_lora.get("weights"))

        if image_input is not None:
            final_image = self.model_manager.generate_image_to_image(
                prompt_mash, image_input, image_strength, steps, cfg_scale, width, height, lora_scale, seed
            )
            yield final_image, seed, gr.update(visible=False), enhanced_prompt
        else:
            image_generator = self.model_manager.generate_image(prompt_mash, steps, seed, cfg_scale, width, height, lora_scale)
            final_image = None
            step_counter = 0
            for image in image_generator:
                step_counter += 1
                final_image = image
                progress_bar = f'<div class="progress-container"><div class="progress-bar" style="--current: {step_counter}; --total: {steps};"></div></div>'
                yield image, seed, gr.update(value=progress_bar, visible=True), enhanced_prompt

            yield final_image, seed, gr.update(value=progress_bar, visible=False), enhanced_prompt

    def create_ui(self):
        with gr.Blocks(theme=gr.themes.Base(), css=self.css, title="Flux LoRA Generation") as app:
            title = gr.HTML(
                """<h1>Flux LoRA Generation</h1>""",
                elem_id="title",
            )
            selected_index = gr.State(None)

            with gr.Row():
                with gr.Column(scale=3):
                    prompt = gr.Textbox(label="Prompt", lines=1, placeholder="Choose the LoRA and type the prompt")
                with gr.Column(scale=1, elem_id="gen_column"):
                    generate_button = gr.Button("Generate", variant="primary", elem_id="gen_btn")
            with gr.Row():
                with gr.Column():
                    selected_info = gr.Markdown("")
                    gallery = gr.Gallery(
                        [(item["image"], item["title"]) for item in self.loras],
                        label="LoRA Collection",
                        allow_preview=False,
                        columns=3,
                        elem_id="gallery",
                        show_share_button=False
                    )
                    with gr.Group():
                        custom_lora = gr.Textbox(label="Enter Custom LoRA", placeholder="prithivMLmods/Canopus-LoRA-Flux-Anime")
                        gr.Markdown("[Check the list of FLUX LoRA's](https://huggingface.co/models?other=base_model:adapter:black-forest-labs/FLUX.1-dev)", elem_id="lora_list")
                    custom_lora_info = gr.HTML(visible=False)
                    custom_lora_button = gr.Button("Remove custom LoRA", visible=False)
                with gr.Column():
                    progress_bar = gr.Markdown(elem_id="progress", visible=False)
                    result = gr.Image(label="Generated Image")

            with gr.Row():
                with gr.Accordion("Advanced Settings", open=False):
                    with gr.Row():
                        input_image = gr.Image(label="Input image", type="filepath")
                        image_strength = gr.Slider(label="Denoise Strength", info="Lower means more image influence", minimum=0.1, maximum=1.0, step=0.01, value=0.75)
                    with gr.Column():
                        with gr.Row():
                            cfg_scale = gr.Slider(label="CFG Scale", minimum=1, maximum=20, step=0.5, value=3.5)
                            steps = gr.Slider(label="Steps", minimum=1, maximum=50, step=1, value=28)
                        with gr.Row():
                            width = gr.Slider(label="Width", minimum=256, maximum=1536, step=64, value=1024)
                            height = gr.Slider(label="Height", minimum=256, maximum=1536, step=64, value=1024)
                        with gr.Row():
                            randomize_seed = gr.Checkbox(True, label="Randomize seed")
                            seed = gr.Slider(label="Seed", minimum=0, maximum=MAX_SEED, step=1, value=0, randomize=True)
                            lora_scale = gr.Slider(label="LoRA Scale", minimum=0, maximum=3, step=0.01, value=0.95)
                    # Prompt Enhancer Section
                    with gr.Group():
                        use_enhancer = gr.Checkbox(label="Use Prompt Enhancer", value=True)
                        show_enhanced_prompt = gr.Checkbox(label="Display Enhanced Prompt", value=False)
                        enhanced_prompt_box = gr.Textbox(label="Enhanced Prompt", lines=3, visible=False)

            gallery.select(
                update_selection,
                inputs=[width, height, gr.State(self.loras)],
                outputs=[prompt, selected_info, selected_index, width, height]
            )
            custom_lora.input(
                add_custom_lora,
                inputs=[custom_lora, gr.State(self.loras)],
                outputs=[custom_lora_info, custom_lora_button, gallery, selected_info, selected_index, prompt]
            )
            custom_lora_button.click(
                remove_custom_lora,
                outputs=[custom_lora_info, custom_lora_button, gallery, selected_info, selected_index, custom_lora]
            )

            # Toggle the visibility of the enhanced prompt textbox based on the checkbox state.
            show_enhanced_prompt.change(fn=lambda show: gr.update(visible=show),
                                        inputs=show_enhanced_prompt,
                                        outputs=enhanced_prompt_box)

            gr.on(
                triggers=[generate_button.click, prompt.submit],
                fn=self.run_lora,
                inputs=[prompt, input_image, image_strength, cfg_scale, steps, selected_index, randomize_seed, seed, width, height, lora_scale, use_enhancer],
                outputs=[result, seed, progress_bar, enhanced_prompt_box]
            )

            # Credits section added at the bottom
            with gr.Row():
                gr.HTML("<div style='text-align:center; font-size:0.9em; margin-top:20px;'>Credits: <a href='https://ruslanmv.com' target='_blank'>ruslanmv.com</a></div>")
            
            return app

if __name__ == "__main__":
    model_manager = ModelManager()
    frontend = Frontend(model_manager)
    app = frontend.create_ui()
    app.queue()
    app.launch(debug=True)