import gradio as gr
import sys
import os

# Add the dist directory to Python path
sys.path.insert(0, os.path.join(os.path.dirname(__file__), 'dist'))

# Import obfuscated module
try:
    import core_logic
    from core_logic import *
    data_manager = DataManager()
except ImportError as e:
    print(f"Error: Obfuscated module not found: {e}")
    print("Current directory:", os.getcwd())
    print("Files in dist:", os.listdir('dist') if os.path.exists('dist') else 'dist not found')
    sys.exit(1)

def handle_like(request: gr.Request):
    """Handle like button click"""
    user_context = get_user_context(request)
    print(f"User {user_context} liked the result!")
    
    return gr.update(
        value="❤️ Thanks for liking! Please star our repo!",
        interactive=False,
        variant="secondary"
    )

def create_footer():
    return f"""
    <div style="text-align: center; margin-top: 30px; padding: 15px; border-radius: 8px;">
        <p style="margin: 5px 0;">© 2025 {COMPANY_NAME}. All rights reserved.</p>
        <p style="margin: 5px 0;">
            <a href="{COMPANY_URL}" target="_blank" style="color: #0984e3; text-decoration: none;">Website</a> | 
            <a href="mailto:{CONTACT_EMAIL}" style="color: #0984e3; text-decoration: none;">Contact Us</a> | 
            <a href="{COMPANY_URL}/privacy-policy" target="_blank" style="color: #0984e3; text-decoration: none;">Privacy Policy</a>
        </p>
    </div>
    """

def create_instructions():
    return """
    <div style="padding: 15px; border-radius: 8px; margin-bottom: 20px;">
        <h2 style="margin-top: 0;">How to use:</h2>
        <ol style="color: #636e72;">
            <li>Upload a clear photo of a person (front view works best)</li>
            <li>Upload an image of the garment you want to try on</li>
            <li>Click "Run Virtual Try-On" to see the result</li>
        </ol>
        <p style="margin-bottom: 0;"><strong>Tip:</strong> For best results, use images with plain backgrounds.</p>
    </div>
    """

def virtual_tryon_with_like(human_img, garment_img, garment_type, request: gr.Request):
    if human_img is None:
        raise gr.Error("Please upload a person image first!")
    
    if garment_img is None:
        raise gr.Error("Please upload a garment image first!")
    
    user_context = get_user_context(request)
    current_attempts = data_manager.get_attempts(user_context)
    print(f"Current attempts for {user_context}: {current_attempts}")
    
    if current_attempts >= MAX_FREE_TRIALS:
        raise gr.Error(
            f"You've used {MAX_FREE_TRIALS} free daily credits. "
            f"Please visit https://miragic.ai/ to sign up for unlimited access!"
        )
    
    try:
        # Process the images
        result_img = process_tryon_request(human_img, garment_img, garment_type)
        
        # Increment attempts after successful generation
        new_count = data_manager.increment_attempts(user_context)
        print(f"New attempt count for {user_context}: {new_count}")
        
        return result_img, gr.update(visible=True, interactive=True, value="👍 Like this result!")
    
    except Exception as e:
        print(f"Error in virtual_tryon: {str(e)}")
        raise e

# Custom CSS
css = """
footer {visibility: hidden}
.banner {
    background-color: #f8f9fa;
    padding: 10px;
    border-radius: 5px;
    margin-bottom: 20px;
    text-align: center;
}
.button-gradient {
  background: linear-gradient(45deg, #ff416c, #ff4b2b, #ff9b00, #ff416c);
  background-size: 400% 400%;
  border: none;
  padding: 14px 28px;
  font-size: 16px;
  font-weight: bold;
  color: white;
  border-radius: 10px;
  cursor: pointer;
  transition: 0.3s ease-in-out;
  animation: gradientAnimation 2s infinite linear;
  box-shadow: 0 4px 10px rgba(255, 65, 108, 0.6);
}
@keyframes gradientAnimation {
  0% { background-position: 0% 50%; }
  100% { background-position: 100% 50%; }
}
.button-gradient:hover {
  transform: scale(1.05);
  box-shadow: 0 6px 15px rgba(255, 75, 43, 0.8);
}
.signup-container {
    text-align: center;
    padding: 20px;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    border-radius: 8px;
    margin-top: 20px;
    color: white;
    box-shadow: 0 4px 15px rgba(0,0,0,0.2);
}
.signup-container h3 {
    margin-bottom: 10px;
    color: white;
}
.signup-container p {
    margin-bottom: 15px;
    color: #f0f0f0;
}
.signup-button {
  background: linear-gradient(45deg, #ff416c, #ff4b2b);
  border: none;
  padding: 12px 25px;
  font-size: 16px;
  font-weight: bold;
  color: white;
  border-radius: 8px;
  text-decoration: none;
  display: inline-block;
  transition: all 0.3s ease;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
}
.signup-button:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.3);
}
.attempts-counter {
    background: #e3f2fd;
    padding: 10px;
    border-radius: 5px;
    margin: 10px 0;
    text-align: center;
    font-weight: bold;
    color: #1976d2;
}
#col-container {
    max-width: 1400px;
    margin: 0 auto;
}
.step-column {
    padding: 20px;
    border-radius: 8px;
    box-shadow: var(--card-shadow);
    margin: 10px;
}
.step-title {
    color: var(--primary-color);
    text-align: center;
    margin-bottom: 15px;
}
.image-preview {
    border-radius: 8px;
    overflow: hidden;
    box-shadow: var(--card-shadow);
}
.result-section {
    background-color: white;
    padding: 20px;
    border-radius: 8px;
    box-shadow: var(--card-shadow);
}
.footer {
    margin-top: 30px;
    text-align: center;
}
.like-button {
    background: linear-gradient(45deg, #ff6b6b, #ff8e8e);
    border: none;
    padding: 10px 20px;
    font-size: 14px;
    font-weight: bold;
    color: white;
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: 0 2px 8px rgba(255, 107, 107, 0.3);
}
.like-button:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(255, 107, 107, 0.5);
}
.interaction-section {
    text-align: center;
    padding: 20px;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    border-radius: 8px;
    margin-top: 20px;
    color: white;
    box-shadow: 0 4px 15px rgba(0,0,0,0.2);
}
"""

# Example images setup
example_path = os.path.join(os.path.dirname(__file__), 'assets')

human_examples = [
    os.path.join(example_path, "human", f) for f in os.listdir(os.path.join(example_path, "human")) 
    if f.endswith(('.jpg', '.jpeg', '.png'))
] if os.path.exists(os.path.join(example_path, "human")) else []

garment_examples = [
    os.path.join(example_path, "garment", f) for f in os.listdir(os.path.join(example_path, "garment")) 
    if f.endswith(('.jpg', '.jpeg', '.png'))
] if os.path.exists(os.path.join(example_path, "garment")) else []

with gr.Blocks(css=css, title=f"{COMPANY_NAME} Virtual Try-On", theme=gr.themes.Ocean()) as demo:
    gr.Markdown("""
    <div style="display: flex; align-items: center;">
        <img src="https://avatars.githubusercontent.com/u/211682198?s=200&v=4" style="width: 80px; margin-right: 20px;"/>
        <div>
            <h1 style="margin-bottom: 0;">Miragic Virtual Try-On 👕 👗</h1>
            <p style="margin-top: 0; color: #636e72;">Try on complete outfits with our AI-powered virtual try-on technology</p>
        </div>
    </div>
    """)

    # Instructions
    gr.HTML(create_instructions())
    
    with gr.Row(elem_id="col-container"):
        # Step 1: Person Image
        with gr.Column(elem_classes="step-column"):
            gr.HTML("""
            <div class="step-title">
                <span style="font-size: 24px;">1. Upload Person Image</span><br>
            </div>
            """)
            human_img = gr.Image(
                label="Person Image", 
                sources='upload', 
                type="numpy",
                elem_classes="image-preview",
                height=400
            )
            if human_examples:
                gr.Examples(
                    examples=human_examples,
                    inputs=human_img,
                    label="Example Person Images",
                    examples_per_page=12
                )
        
        # Step 2: Garment Image
        with gr.Column(elem_classes="step-column"):
            gr.HTML("""
            <div class="step-title">
                <span style="font-size: 24px;">2. Upload Garment Image</span><br>
            </div>
            """)
            garment_img = gr.Image(
                label="Garment Image", 
                sources='upload', 
                type="numpy",
                elem_classes="image-preview",
                height=400
            )

            garment_type = gr.Dropdown(
                choices=["Dress/Suit", "Top", "Bottom"],
                value="Dress/Suit",
                label="Garment Type",
                info="Select the type of garment you want to try on"
            )

            if garment_examples:
                gr.Examples(
                    examples=garment_examples,
                    inputs=garment_img,
                    label="Example Garment Images",
                    examples_per_page=12
                )
        
        # Step 3: Results
        with gr.Column(elem_classes="step-column"):
            gr.HTML("""
            <div class="step-title">
                <span style="font-size: 24px;">3. Virtual Try-On Result</span><br>
            </div>
            """)
            result_img = gr.Image(
                label="Try-On Result", 
                interactive=False,
                elem_classes="image-preview",
                height=400
            )

            with gr.Row():
                like_button = gr.Button(
                    "👍 Like this result!",
                    elem_classes="like-button",
                    visible=False
                )

            try_button = gr.Button(
                "Run Virtual Try-On 🚀",
                elem_classes="button-gradient"
            )

            gr.HTML("""
            <div class="interaction-section">
                <p style="margin: 5px 0;">If you like our Virtual Try-On results, please give us a ⭐ into our space!</p>
            </div>
            """)
    
            signup_prompt = gr.HTML(
            visible=True,
            value="""<div class="signup-container">
                <h3>🚀 Want unlimited generations?</h3>
                <p>Please sign up at Miragic.ai for unlimited access to all our AI tools!</p>
                <a href='https://miragic.ai/products/virtual-try-on' target='_blank' class="signup-button">
                    SignUp for Free 🚀
                </a>
            </div>"""
            )
    
    if os.path.exists("assets/examples"):
        with gr.Row():
            gr.Examples(
                examples=[
                    ["assets/examples/model1.jpg", "assets/examples/garment1.png", "Dress/Suit", "assets/examples/result1.jpg"],
                    ["assets/examples/model2.png", "assets/examples/garment2.jpg", "Dress/Suit", "assets/examples/result2.jpg"],
                    ["assets/examples/model3.jpg", "assets/examples/garment3.jpg", "Dress/Suit", "assets/examples/result3.jpg"],
                ],
                inputs=[human_img, garment_img, garment_type, result_img],
                label=None,
                examples_per_page=3
            )
    
    # Button action
    try_button.click(
        fn=virtual_tryon_with_like,
        inputs=[human_img, garment_img, garment_type],
        outputs=[result_img, like_button],
        api_name="virtual_tryon"
    )

    like_button.click(
        fn=handle_like,
        inputs=[],
        outputs=[like_button]
    )

    gr.HTML('<a href="https://visitorbadge.io/status?path=https%3A%2F%2Fhuggingface.co%2Fspaces%2FMiragic-AI%2FMiragic-Virtual-Try-On"><img src="https://api.visitorbadge.io/api/combined?path=https%3A%2F%2Fhuggingface.co%2Fspaces%2FMiragic-AI%2FMiragic-Virtual-Try-On&label=VISITORS&labelColor=%2337d67a&countColor=%23f47373&style=plastic&labelStyle=upper" /></a>')

    # Footer
    gr.HTML(create_footer())
    
if __name__ == "__main__":
    demo.launch(
        show_api=False,
        server_name="0.0.0.0",
        server_port=7860
    )