Upload app2.py

app2.py

@@ -0,0 +1,731 @@
+import gradio as gr
+import requests
+import json
+import os
+import time
+from PIL import Image
+import io
+from datetime import datetime
+import numpy as np
+
+# Get API key from Hugging Face secrets
+def get_api_key():
+    return os.environ.get("PIXAZO_API_KEY")
+
+# Call Pixazo API
+def call_pixazo_api(prompt, num_steps=4, seed=None, height=512, width=512, 
+                   style_preset=None, guidance_scale=None):
+    
+    api_key = get_api_key()
+    
+    if not api_key:
+        return None, {
+            "error": "API key not configured",
+            "instructions": "Please set PIXAZO_API_KEY in Hugging Face Space secrets",
+            "timestamp": datetime.now().isoformat()
+        }
+    
+    url = "https://gateway.pixazo.ai/flux-1-schnell/v1/getData"
+    
+    headers = {
+        'Content-Type': 'application/json',
+        'Cache-Control': 'no-cache',
+        'Ocp-Apim-Subscription-Key': api_key,
+    }
+    
+    # Prepare request body
+    body = {
+        "prompt": prompt,
+        "num_steps": num_steps,
+        "height": height,
+        "width": width,
+    }
+    
+    if seed and seed > 0:
+        body["seed"] = seed
+    if style_preset and style_preset != "none":
+        body["style_preset"] = style_preset
+    if guidance_scale:
+        body["guidance_scale"] = guidance_scale
+    
+    try:
+        print(f"🌐 Sending request to Pixazo API...")
+        
+        response = requests.post(
+            url, 
+            headers=headers, 
+            json=body,
+            timeout=120
+        )
+        
+        print(f"✅ Response status: {response.status_code}")
+        
+        if response.status_code == 200:
+            result = response.json()
+            
+            if "output" in result:
+                image_url = result["output"]
+                
+                # Download the image from the URL
+                try:
+                    print(f"⬇️ Downloading image from URL...")
+                    img_response = requests.get(image_url, timeout=30, headers={
+                        'User-Agent': 'Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36'
+                    })
+                    
+                    if img_response.status_code == 200:
+                        image = Image.open(io.BytesIO(img_response.content))
+                        
+                        # Convert to RGB if necessary
+                        if image.mode in ('RGBA', 'LA', 'P'):
+                            image = image.convert('RGB')
+                        
+                        return image, {
+                            "success": True,
+                            "status_code": 200,
+                            "image_url_preview": image_url[:80] + "..." if len(image_url) > 80 else image_url,
+                            "image_size": f"{image.size[0]}x{image.size[1]}",
+                            "timestamp": datetime.now().isoformat()
+                        }
+                    else:
+                        return None, {
+                            "error": f"Failed to download image: HTTP {img_response.status_code}",
+                            "image_url": image_url[:80] + "..." if len(image_url) > 80 else image_url,
+                            "download_status": img_response.status_code,
+                            "timestamp": datetime.now().isoformat()
+                        }
+                        
+                except Exception as e:
+                    return None, {
+                        "error": f"Error downloading image: {str(e)}",
+                        "image_url": image_url[:80] + "..." if len(image_url) > 80 else image_url,
+                        "timestamp": datetime.now().isoformat()
+                    }
+            else:
+                return None, {
+                    "error": "Response missing 'output' field",
+                    "response_keys": list(result.keys()),
+                    "timestamp": datetime.now().isoformat()
+                }
+        else:
+            try:
+                error_data = response.json()
+                error_msg = error_data.get("error", str(error_data))
+            except:
+                error_msg = response.text[:200] if response.text else "No error message"
+            
+            return None, {
+                "error": f"API returned status {response.status_code}: {error_msg}",
+                "status_code": response.status_code,
+                "timestamp": datetime.now().isoformat()
+            }
+            
+    except requests.exceptions.Timeout:
+        return None, {
+            "error": "Request timed out after 120 seconds",
+            "suggestion": "Try reducing image size or number of steps",
+            "timestamp": datetime.now().isoformat()
+        }
+    except requests.exceptions.RequestException as e:
+        return None, {
+            "error": f"Network error: {str(e)}",
+            "timestamp": datetime.now().isoformat()
+        }
+    except Exception as e:
+        return None, {
+            "error": f"Unexpected error: {str(e)}",
+            "timestamp": datetime.now().isoformat()
+        }
+
+# Batch generate images
+def generate_images(prompt, num_steps, seed, height, width, style_preset, 
+                   num_images, guidance_scale):
+    
+    images = []
+    all_results = []
+    
+    for i in range(num_images):
+        try:
+            current_seed = seed + i if seed > 0 else 0
+            
+            image, result = call_pixazo_api(
+                prompt=prompt,
+                num_steps=num_steps,
+                seed=current_seed,
+                height=height,
+                width=width,
+                style_preset=style_preset,
+                guidance_scale=guidance_scale
+            )
+            
+            if image:
+                images.append(image)
+            
+            all_results.append(result)
+            
+            status_text = f"Generated {i+1}/{num_images} images"
+            if "error" in result:
+                status_text = f"Image {i+1} error: {result['error'][:50]}..."
+            
+            yield images if images else None, status_text, json.dumps(result, indent=2)
+            
+            if i < num_images - 1:
+                time.sleep(1)
+                
+        except Exception as e:
+            error_result = {"error": str(e), "image_index": i, "timestamp": datetime.now().isoformat()}
+            all_results.append(error_result)
+            yield images if images else None, f"Exception on image {i+1}: {str(e)[:50]}", json.dumps(error_result, indent=2)
+            break
+    
+    # Final summary
+    success_count = len(images)
+    
+    if success_count == 0:
+        final_status = f"❌ No images generated ({success_count}/{num_images} successful)"
+        gallery_val = None
+    elif success_count < num_images:
+        final_status = f"⚠️ Partial success: {success_count}/{num_images} images"
+        gallery_val = images
+    else:
+        final_status = f"🎉 Success! All {success_count} images generated"
+        gallery_val = images
+    
+    summary = {
+        "summary": {
+            "total_attempts": num_images,
+            "successful": success_count,
+            "failed": num_images - success_count,
+            "timestamp": datetime.now().isoformat()
+        },
+        "parameters_used": {
+            "prompt_length": len(prompt),
+            "steps": num_steps,
+            "resolution": f"{width}x{height}",
+            "style": style_preset
+        }
+    }
+    
+    yield gallery_val, final_status, json.dumps(summary, indent=2)
+
+# Custom CSS for the beautiful UI
+custom_css = """
+:root {
+    --primary-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+    --primary-color: #4f46e5;
+    --success-color: #10b981;
+    --error-color: #ef4444;
+    --warning-color: #f59e0b;
+}
+
+.gradio-container {
+    max-width: 1200px !important;
+    margin: 0 auto !important;
+    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, sans-serif;
+}
+
+.header-container {
+    background: var(--primary-gradient);
+    color: white;
+    padding: 40px 30px;
+    border-radius: 16px;
+    margin-bottom: 30px;
+    text-align: center;
+    box-shadow: 0 20px 60px rgba(102, 126, 234, 0.3);
+}
+
+.header-title {
+    font-size: 2.8em;
+    font-weight: 700;
+    margin-bottom: 10px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    gap: 15px;
+}
+
+.header-subtitle {
+    font-size: 1.2em;
+    opacity: 0.9;
+    max-width: 600px;
+    margin: 0 auto;
+}
+
+.api-status {
+    padding: 16px 20px;
+    border-radius: 12px;
+    margin-bottom: 25px;
+    font-weight: 600;
+    font-size: 1.1em;
+    border-left: 6px solid;
+}
+
+.api-status-success {
+    background: linear-gradient(135deg, #d1fae5 0%, #a7f3d0 100%);
+    color: #065f46;
+    border-left-color: var(--success-color);
+}
+
+.api-status-error {
+    background: linear-gradient(135deg, #fee2e2 0%, #fecaca 100%);
+    color: #7f1d1d;
+    border-left-color: var(--error-color);
+}
+
+.input-section {
+    background: white;
+    padding: 30px;
+    border-radius: 16px;
+    border: 1px solid #e5e7eb;
+    box-shadow: 0 4px 20px rgba(0,0,0,0.05);
+    margin-bottom: 25px;
+}
+
+.section-title {
+    color: #333;
+    font-size: 1.4em;
+    font-weight: 600;
+    margin-bottom: 20px;
+    display: flex;
+    align-items: center;
+    gap: 10px;
+}
+
+.example-card {
+    background: #f8fafc;
+    padding: 20px;
+    border-radius: 12px;
+    border: 2px solid #e2e8f0;
+    margin: 12px 0;
+    cursor: pointer;
+    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+}
+
+.example-card:hover {
+    background: #e2e8f0;
+    transform: translateY(-4px);
+    box-shadow: 0 10px 30px rgba(0,0,0,0.1);
+    border-color: var(--primary-color);
+}
+
+.example-title {
+    color: var(--primary-color);
+    font-weight: 600;
+    font-size: 1.1em;
+    margin-bottom: 8px;
+}
+
+.example-desc {
+    color: #666;
+    font-size: 0.95em;
+    line-height: 1.4;
+}
+
+.generate-btn {
+    background: var(--primary-gradient) !important;
+    color: white !important;
+    font-weight: 700 !important;
+    padding: 18px 40px !important;
+    font-size: 1.2em !important;
+    border-radius: 12px !important;
+    border: none !important;
+    transition: all 0.3s ease !important;
+    box-shadow: 0 8px 25px rgba(102, 126, 234, 0.4) !important;
+}
+
+.generate-btn:hover {
+    transform: translateY(-3px) !important;
+    box-shadow: 0 15px 35px rgba(102, 126, 234, 0.5) !important;
+}
+
+.secondary-btn {
+    background: #f1f5f9 !important;
+    color: #475569 !important;
+    border: 2px solid #e2e8f0 !important;
+}
+
+.param-group {
+    background: #f9fafb;
+    padding: 20px;
+    border-radius: 12px;
+    margin-bottom: 20px;
+    border: 1px solid #e5e7eb;
+}
+
+.param-label {
+    font-weight: 600;
+    color: #374151;
+    margin-bottom: 8px;
+    display: block;
+}
+
+.gallery-container {
+    background: white;
+    padding: 25px;
+    border-radius: 16px;
+    border: 1px solid #e5e7eb;
+    box-shadow: 0 4px 20px rgba(0,0,0,0.05);
+}
+
+.status-box {
+    background: #f8fafc;
+    padding: 20px;
+    border-radius: 12px;
+    border-left: 5px solid var(--primary-color);
+    margin-bottom: 20px;
+    font-size: 1.1em;
+}
+
+.footer {
+    text-align: center;
+    color: #666;
+    font-size: 0.9em;
+    margin-top: 40px;
+    padding-top: 20px;
+    border-top: 1px solid #e5e7eb;
+}
+
+.tab-button {
+    font-weight: 600 !important;
+    padding: 12px 24px !important;
+}
+
+.dark .input-section, .dark .gallery-container {
+    background: #1f2937;
+    border-color: #374151;
+}
+
+.dark .example-card {
+    background: #374151;
+    border-color: #4b5563;
+}
+
+.dark .param-group {
+    background: #374151;
+    border-color: #4b5563;
+}
+"""
+
+# Create the Gradio interface with Gradio 6.x
+with gr.Blocks(title="Pixazo Image Generator", css=custom_css) as demo:
+    
+    # Custom header
+    gr.HTML("""
+    <div class="header-container">
+        <div class="header-title">
+            🎨 Pixazo Image Generator
+        </div>
+        <div class="header-subtitle">
+            Generate stunning AI images with FLUX-1 Schnell model
+        </div>
+    </div>
+    """)
+    
+    # API Status
+    api_key = get_api_key()
+    if api_key:
+        gr.HTML(f"""
+        <div class="api-status api-status-success">
+            ✅ API Status: Connected • Key length: {len(api_key)} characters
+        </div>
+        """)
+    else:
+        gr.HTML("""
+        <div class="api-status api-status-error">
+            ❌ API Status: Not Configured
+            <br><small>Go to Space Settings → Repository secrets → Add: <code>PIXAZO_API_KEY</code> = your API key</small>
+        </div>
+        """)
+    
+    with gr.Row(equal_height=False):
+        # Left Column - Inputs
+        with gr.Column(scale=1, min_width=450):
+            # Prompt Section
+            with gr.Group(elem_classes="input-section"):
+                gr.Markdown("""
+                <div class="section-title">
+                    ✨ Image Description
+                </div>
+                """)
+                prompt = gr.Textbox(
+                    label="",
+                    placeholder="Describe the image you want to generate in detail...",
+                    lines=4,
+                    show_label=False,
+                    container=False
+                )
+            
+            # Parameters Section
+            with gr.Group(elem_classes="input-section"):
+                gr.Markdown("""
+                <div class="section-title">
+                    ⚙️ Generation Parameters
+                </div>
+                """)
+                
+                with gr.Row():
+                    style_preset = gr.Dropdown(
+                        label="🎭 Style Preset",
+                        choices=[
+                            "none", "cyberpunk", "fantasy", "anime", "photographic", 
+                            "digital-art", "comic", "3d-model", "pixel-art", 
+                            "isometric", "watercolor", "oil-painting", "sketch",
+                            "cinematic", "sci-fi", "renaissance", "impressionist"
+                        ],
+                        value="none",
+                        info="Select an art style"
+                    )
+                
+                with gr.Row():
+                    guidance_scale = gr.Slider(
+                        label="🎯 Guidance Scale",
+                        minimum=1.0,
+                        maximum=20.0,
+                        value=7.5,
+                        step=0.5,
+                        info="Higher values = more prompt adherence"
+                    )
+                
+                with gr.Row():
+                    num_steps = gr.Slider(
+                        label="⚡ Inference Steps",
+                        minimum=1,
+                        maximum=100,
+                        value=4,
+                        step=1,
+                        info="More steps = better quality but slower"
+                    )
+                    
+                    seed = gr.Number(
+                        label="🌱 Seed",
+                        value=42,
+                        minimum=0,
+                        maximum=999999,
+                        info="0 for random, fixed for reproducible results"
+                    )
+                
+                with gr.Row():
+                    width = gr.Slider(
+                        label="📏 Width",
+                        minimum=256,
+                        maximum=2048,
+                        value=512,
+                        step=64,
+                        info="Image width in pixels"
+                    )
+                    
+                    height = gr.Slider(
+                        label="📐 Height",
+                        minimum=256,
+                        maximum=2048,
+                        value=512,
+                        step=64,
+                        info="Image height in pixels"
+                    )
+                
+                num_images = gr.Slider(
+                    label="🖼️ Number of Images",
+                    minimum=1,
+                    maximum=8,
+                    value=1,
+                    step=1,
+                    info="Generate multiple variations"
+                )
+            
+            # Action Buttons
+            with gr.Row():
+                generate_btn = gr.Button(
+                    "✨ Generate Images", 
+                    variant="primary",
+                    scale=3,
+                    elem_classes="generate-btn"
+                )
+                clear_btn = gr.Button(
+                    "🗑️ Clear", 
+                    variant="secondary",
+                    scale=1,
+                    elem_classes="secondary-btn"
+                )
+            
+            # Examples Section
+            with gr.Group(elem_classes="input-section"):
+                gr.Markdown("""
+                <div class="section-title">
+                    💡 Example Prompts
+                </div>
+                <p style="color: #666; margin-bottom: 15px;">Click any example to try it:</p>
+                """)
+                
+                examples = [
+                    ("Cyberpunk Cityscape", "A futuristic cyberpunk city at night with neon signs, flying cars, and rain reflections", "cyberpunk"),
+                    ("Fantasy Dragon", "A majestic dragon perched on a mountain peak overlooking a magical kingdom at sunset", "fantasy"),
+                    ("Anime Character", "A cute anime girl with magical powers in a cherry blossom garden, studio ghibli style", "anime"),
+                    ("Space Explorer", "An astronaut on Mars with detailed reflection in visor, photorealistic", "photographic"),
+                    ("Isometric Office", "Cozy isometric bedroom with plants, books, and warm lighting, detailed 3d render", "isometric")
+                ]
+                
+                for title, desc, style in examples:
+                    with gr.Row():
+                        gr.HTML(f"""
+                        <div class="example-card">
+                            <div class="example-title">{title}</div>
+                            <div class="example-desc">{desc}</div>
+                        </div>
+                        """)
+                        
+                        def use_example(p=desc, s=style):
+                            return p, s
+                        
+                        # Make the entire card clickable
+                        demo.load(
+                            fn=None,
+                            inputs=None,
+                            outputs=None,
+                            _js=f"""
+                            (function() {{
+                                setTimeout(() => {{
+                                    const cards = document.querySelectorAll('.example-card');
+                                    cards.forEach(card => {{
+                                        card.addEventListener('click', () => {{
+                                            // This would need JavaScript to update the inputs
+                                            // For now, we'll use the Python handler
+                                        }});
+                                    }});
+                                }}, 1000);
+                            }})();
+                            """
+                        )
+                        
+                        # Add invisible button for the example
+                        example_btn = gr.Button("Use", visible=False)
+                        example_btn.click(
+                            lambda p=desc, s=style: (p, s),
+                            outputs=[prompt, style_preset]
+                        )
+        
+        # Right Column - Outputs
+        with gr.Column(scale=2, min_width=650):
+            # Status Display
+            gr.HTML("""
+            <div class="section-title">
+                ��� Generation Results
+            </div>
+            """)
+            
+            status = gr.Textbox(
+                label="",
+                value="🎯 Ready to generate images. Enter a prompt above and click Generate!",
+                interactive=False,
+                lines=2,
+                container=False,
+                elem_classes="status-box"
+            )
+            
+            # Gallery
+            with gr.Group(elem_classes="gallery-container"):
+                gallery = gr.Gallery(
+                    label="🎨 Generated Images",
+                    columns=3,
+                    height="auto",
+                    object_fit="contain",
+                    show_label=True,
+                    preview=True,
+                    allow_preview=True
+                )
+            
+            # Tabs for additional info
+            with gr.Tabs():
+                with gr.TabItem("📈 Generation Details", elem_classes="tab-button"):
+                    json_output = gr.JSON(
+                        label="API Response & Metrics",
+                        container=True
+                    )
+                
+                with gr.TabItem("🛠️ Quick Actions", elem_classes="tab-button"):
+                    with gr.Column():
+                        gr.Markdown("""
+                        ### Quick Actions
+                        
+                        **Download Options:**
+                        - Right-click any image to save it
+                        - Use browser's "Save image as" option
+                        
+                        **Tips for Better Results:**
+                        1. **Be descriptive** - Include details about lighting, style, mood
+                        2. **Use specific styles** - Try different style presets
+                        3. **Adjust guidance** - Higher values follow prompt more closely
+                        4. **Experiment with seeds** - Same seed + same prompt = same image
+                        """)
+                
+                with gr.TabItem("ℹ️ About", elem_classes="tab-button"):
+                    gr.Markdown(f"""
+                    ### About This Application
+                    
+                    **Version:** 1.0.0
+                    **Gradio:** {gr.__version__}
+                    **API Format:** `{"output": "IMAGE_URL"}`
+                    
+                    **How It Works:**
+                    1. Your prompt is sent to Pixazo's FLUX-1 Schnell API
+                    2. API returns a JSON response with an image URL
+                    3. App downloads and displays the image
+                    4. All metadata is shown for transparency
+                    
+                    **Credits:**
+                    - Powered by [Pixazo AI](https://pixazo.ai)
+                    - Built with [Gradio](https://gradio.app)
+                    - Hosted on [Hugging Face Spaces](https://huggingface.co/spaces)
+                    
+                    **Note:** API key must be set in Space secrets for this to work.
+                    """)
+    
+    # Footer
+    gr.HTML("""
+    <div class="footer">
+        <p>Built with ❤️ using Gradio • Powered by Pixazo FLUX-1 Schnell</p>
+        <p>Model: flux-1-schnell • Response Format: <code>{"output": "IMAGE_URL"}</code></p>
+    </div>
+    """)
+    
+    # Event Handlers
+    def on_generate(prompt, num_steps, seed, height, width, style_preset, num_images, guidance_scale):
+        if not prompt.strip():
+            yield None, "❌ Please enter a prompt first", {"error": "No prompt provided"}
+            return
+        
+        # Generator function that yields progress
+        for gallery_val, status_val, json_val in generate_images(
+            prompt, num_steps, seed, height, width, style_preset, num_images, guidance_scale
+        ):
+            yield gallery_val, status_val, json_val
+    
+    def on_clear():
+        return None, "🎯 Ready to generate images. Enter a prompt above and click Generate!", None
+    
+    # Connect buttons
+    generate_btn.click(
+        fn=on_generate,
+        inputs=[prompt, num_steps, seed, height, width, style_preset, num_images, guidance_scale],
+        outputs=[gallery, status, json_output]
+    )
+    
+    clear_btn.click(
+        fn=on_clear,
+        outputs=[gallery, status, json_output]
+    )
+
+# Launch the app
+if __name__ == "__main__":
+    print("=" * 60)
+    print("🚀 Pixazo Image Generator")
+    print("🎨 Beautiful UI with Gradio 6.2.0")
+    print(f"📦 Gradio Version: {gr.__version__}")
+    print(f"🔑 API Key Configured: {'Yes' if get_api_key() else 'No'}")
+    print("=" * 60)
+    
+    # Launch with correct parameters for Gradio 6.x
+    demo.launch(
+        server_name="0.0.0.0",
+        server_port=7860,
+        share=False
+    )