Update app.py

app.py

@@ -16,7 +16,7 @@ if not os.path.exists(SAVE_DIR):
 
 device = "cuda" if torch.cuda.is_available() else "cpu"
 repo_id = "black-forest-labs/FLUX.1-dev"
-adapter_id = "openfree/paul-cezanne"  # Already correct as Cezanne model
+adapter_id = "openfree/paul-cezanne"
 
 pipeline = DiffusionPipeline.from_pretrained(repo_id, torch_dtype=torch.bfloat16)
 pipeline.load_lora_weights(adapter_id)
@@ -71,94 +71,168 @@ def inference(
     # Save the generated image
     filepath = save_generated_image(image, prompt)
     
-    # Return just the image and seed (removed gallery)
+    # Return just the image and seed
     return image, seed
 
+# Updated examples with 1880s clothing style
 examples = [
-    "Cézanne's painting of a lively outdoor dance scene at Moulin de la Galette, with dappled sunlight filtering through trees, illuminating well-dressed Parisians enjoying a summer afternoon. Couples dance while others socialize at tables, capturing the joie de vivre of 1870s Montmartre. [trigger]",
-    "Cézanne's intimate portrait of a young woman with rosy cheeks and lips, soft blonde hair, and a gentle smile. She wears a vibrant blue dress against a background of lush flowers and greenery, showcasing his mastery of depicting feminine beauty with warm, luminous skin tones. [trigger]",
-    "Cézanne's painting of two young girls seated at a piano, captured in his distinctive soft focus style. The scene shows one girl playing while the other stands beside her, both wearing delicate white dresses. The interior setting features warm colors and loose brushwork typical of his mature period. [trigger]",
-    "Cézanne's painting of an elegant boating party, with fashionably dressed men and women relaxing on a restaurant terrace overlooking the Seine. The scene captures the leisurely atmosphere of 1880s French society, with sparkling water reflections and a bright, airy palette of blues, whites, and warm flesh tones. [trigger]",
-    "Cézanne's painting of a sun-dappled garden scene with children playing. The composition features vibrant flowers in full bloom, lush greenery, and Cézanne's characteristic luminous treatment of sunlight filtering through foliage, creating patches of brilliant color across the canvas. [trigger]",
-    "Cézanne's depiction of bathers by a riverbank, with several female figures arranged in a harmonious composition. The painting showcases his later style with fuller figures rendered in pearlescent flesh tones against a backdrop of shimmering water and verdant landscape, demonstrating his unique approach to the nude figure in nature. [trigger]"
+    "Cézanne's painting of a lively outdoor gathering in the 1880s, with men in formal top hats, frock coats, and women in bustled dresses with elaborate hats, enjoying a summer afternoon. The scene captures the Belle Époque atmosphere with dappled sunlight filtering through trees, highlighting the fashionable attire of the period. [trigger]",
+    "Cézanne's intimate portrait of a young woman from the 1880s, with her hair styled in a fashionable updo, wearing a high-necked dress with lace details and leg-of-mutton sleeves. She wears delicate jewelry and has the soft facial features characteristic of Cézanne's portraiture, set against a background of vibrant colors. [trigger]",
+    "Cézanne's painting of two young girls in 1880s attire seated at a piano. One plays while the other stands nearby, both dressed in white frocks with ribbon details, sashes, and high collars typical of the period. The interior setting features Victorian furnishings and decor with warm tones and the distinctive brushwork of Cézanne. [trigger]",
+    "Cézanne's painting of an elegant 1880s boating party, with gentlemen in striped boating blazers, straw boater hats, and formal trousers, alongside ladies in bustled day dresses with parasols. The scene captures the leisure activities of French society during the Belle Époque era, with a bright palette emphasizing the fashionable clothing of the period. [trigger]",
+    "Cézanne's painting of children playing in an 1880s garden scene, dressed in formal period children's wear including sailor suits for boys and pinafores with full skirts for girls. Their Victorian-era clothing contrasts with their playful activities, set against Cézanne's vibrant treatment of nature and sunlight filtering through the foliage. [trigger]",
+    "Cézanne's depiction of bathers in 1880s swimming attire, showing the modest bathing costumes of the period. Women wear full-coverage dark bathing dresses with stockings, while men are in knee-length swimming suits. The figures are arranged in Cézanne's distinctive compositional style against a backdrop of water and landscape rendered in his bold color blocks. [trigger]"
 ]
 
-# Brighter custom CSS with vibrant colors
+# First example for preloading
+default_prompt = examples[0]
+default_settings = {
+    "seed": 42,
+    "randomize_seed": True,
+    "width": 1024,
+    "height": 768,
+    "guidance_scale": 3.5,
+    "num_inference_steps": 30,
+    "lora_scale": 1.0
+}
+
+# Improved custom CSS with better visuals
 custom_css = """
 :root {
-    --color-primary: #FF9E6C;
-    --color-secondary: #FFD8A9;
+    --color-primary: #0F4C81;
+    --color-secondary: #FF9E6C;
+    --background-fill-primary: linear-gradient(to right, #f6f9fc, #edf2f7);
 }
+
 footer {
     visibility: hidden;
 }
+
 .gradio-container {
-    background: linear-gradient(to right, #FFF4E0, #FFEDDB);
+    background: var(--background-fill-primary);
 }
+
 .title {
-    color: #E25822 !important;
-    font-size: 2.5rem !important;
+    color: var(--color-primary) !important;
+    font-size: 3rem !important;
     font-weight: 700 !important;
     text-align: center;
     margin: 1rem 0;
-    text-shadow: 2px 2px 4px rgba(0,0,0,0.1);
+    text-shadow: 2px 2px 4px rgba(0,0,0,0.05);
+    font-family: 'Playfair Display', serif;
 }
+
 .subtitle {
-    color: #2B3A67 !important;
+    color: #4A5568 !important;
     font-size: 1.2rem !important;
+    text-align: center;
+    margin-bottom: 1.5rem;
+    font-style: italic;
+}
+
+.collection-link {
     text-align: center;
     margin-bottom: 2rem;
+    font-size: 1.1rem;
 }
+
+.collection-link a {
+    color: var(--color-primary);
+    text-decoration: underline;
+    transition: color 0.3s ease;
+}
+
+.collection-link a:hover {
+    color: var(--color-secondary);
+}
+
 .model-description {
-    background-color: rgba(255, 255, 255, 0.7);
-    border-radius: 10px;
-    padding: 20px;
+    background-color: rgba(255, 255, 255, 0.8);
+    border-radius: 12px;
+    padding: 24px;
     margin: 20px 0;
-    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
-    border-left: 5px solid #E25822;
+    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
+    border-left: 5px solid var(--color-primary);
 }
+
 button.primary {
-    background-color: #E25822 !important;
+    background-color: var(--color-primary) !important;
+    transition: all 0.3s ease;
 }
+
 button:hover {
     transform: translateY(-2px);
     box-shadow: 0 5px 15px rgba(0,0,0,0.1);
 }
-.tabs {
-    margin-top: 20px;
+
+.input-container {
+    border-radius: 10px;
+    box-shadow: 0 2px 8px rgba(0,0,0,0.05);
+}
+
+.advanced-settings {
+    margin-top: 1rem;
+    padding: 1rem;
+    border-radius: 10px;
+    background-color: rgba(255, 255, 255, 0.6);
+}
+
+.example-region {
+    background-color: rgba(255, 255, 255, 0.5);
+    border-radius: 10px;
+    padding: 1rem;
+    margin-top: 1rem;
 }
 """
 
+# Add preloading function for the first example
+def preload_example():
+    # Set the default example as the initial state
+    return (
+        default_prompt,
+        inference(
+            prompt=default_prompt,
+            seed=default_settings["seed"],
+            randomize_seed=default_settings["randomize_seed"],
+            width=default_settings["width"],
+            height=default_settings["height"],
+            guidance_scale=default_settings["guidance_scale"],
+            num_inference_steps=default_settings["num_inference_steps"],
+            lora_scale=default_settings["lora_scale"],
+        )
+    )
+
 with gr.Blocks(css=custom_css, analytics_enabled=False) as demo:
     gr.HTML('<div class="title">Paul Cézanne STUDIO</div>')
     
+    # Add collection link below title
+    gr.HTML('<div class="collection-link"><a href="https://huggingface.co/collections/openfree/painting-art-ai-681453484ec15ef5978bbeb1" target="_blank">View the full Painting Art AI Collection</a></div>')
+    
     # Model description with the requested content
     with gr.Group(elem_classes="model-description"):
-        pass
+        gr.HTML('<p>Generate beautiful artwork in the style of Paul Cézanne. Add [trigger] at the end of your prompt for best results.</p>')
 
     # Simplified structure without tabs and gallery
     with gr.Column(elem_id="col-container"):
-        with gr.Row():
+        with gr.Row(elem_classes="input-container"):
             prompt = gr.Text(
                 label="Prompt",
-                show_label=False,
                 max_lines=1,
                 placeholder="Enter your prompt (add [trigger] at the end)",
-                container=False,
             )
             run_button = gr.Button("Generate", variant="primary", scale=0)
 
-        result = gr.Image(label="Result", show_label=False)
+        result = gr.Image(label="Generated Image")
 
-        with gr.Accordion("Advanced Settings", open=False):
+        with gr.Accordion("Advanced Settings", open=False, elem_classes="advanced-settings"):
             seed = gr.Slider(
                 label="Seed",
                 minimum=0,
                 maximum=MAX_SEED,
                 step=1,
-                value=42,
+                value=default_settings["seed"],
             )
-            randomize_seed = gr.Checkbox(label="Randomize seed", value=True)
+            randomize_seed = gr.Checkbox(label="Randomize seed", value=default_settings["randomize_seed"])
 
             with gr.Row():
                 width = gr.Slider(
@@ -166,14 +240,14 @@ with gr.Blocks(css=custom_css, analytics_enabled=False) as demo:
                     minimum=256,
                     maximum=MAX_IMAGE_SIZE,
                     step=32,
-                    value=1024,
+                    value=default_settings["width"],
                 )
                 height = gr.Slider(
                     label="Height",
                     minimum=256,
                     maximum=MAX_IMAGE_SIZE,
                     step=32,
-                    value=768,
+                    value=default_settings["height"],
                 )
 
             with gr.Row():
@@ -182,30 +256,34 @@ with gr.Blocks(css=custom_css, analytics_enabled=False) as demo:
                     minimum=0.0,
                     maximum=10.0,
                     step=0.1,
-                    value=3.5,
+                    value=default_settings["guidance_scale"],
                 )
                 num_inference_steps = gr.Slider(
                     label="Number of inference steps",
                     minimum=1,
                     maximum=50,
                     step=1,
-                    value=30,
+                    value=default_settings["num_inference_steps"],
                 )
                 lora_scale = gr.Slider(
                     label="LoRA scale",
                     minimum=0.0,
                     maximum=1.0,
                     step=0.1,
-                    value=1.0,
+                    value=default_settings["lora_scale"],
                 )
 
-        gr.Examples(
-            examples=examples,
-            inputs=[prompt],
-            outputs=[result, seed],
-        )
+        with gr.Group(elem_classes="example-region"):
+            gr.Markdown("### Examples")
+            gr.Examples(
+                examples=examples,
+                inputs=[prompt],
+                outputs=[result, seed],
+                fn=inference,
+                cache_examples=True,
+            )
 
-    # Event handlers - simplified to remove gallery functionality
+    # Event handlers
     gr.on(
         triggers=[run_button.click, prompt.submit],
         fn=inference,
@@ -221,6 +299,13 @@ with gr.Blocks(css=custom_css, analytics_enabled=False) as demo:
         ],
         outputs=[result, seed],
     )
+    
+    # Preload the first example when the app starts
+    demo.load(
+        fn=preload_example,
+        inputs=None,
+        outputs=[prompt, [result, seed]],
+    )
 
 demo.queue()
 demo.launch()