Create app.py

app.py

@@ -0,0 +1,145 @@
+# app.py
+import gradio as gr
+import json
+import os
+import random
+import string
+from html_generator import generate_website_html
+
+# CSS for styling the interface
+css = """
+body {
+    font-family: 'Inter', sans-serif;
+    background-color: #f9fafb;
+}
+.container {
+    max-width: 900px;
+    margin: 0 auto;
+}
+.header {
+    text-align: center;
+    margin-bottom: 20px;
+}
+.header h1 {
+    font-size: 2.5rem;
+    font-weight: 700;
+    color: #1f2937;
+}
+.header p {
+    font-size: 1.1rem;
+    color: #6b7280;
+}
+.output-container {
+    margin-top: 20px;
+    border-radius: 8px;
+    overflow: hidden;
+    border: 1px solid #e5e7eb;
+}
+.prompt-box {
+    border: 1px solid #d1d5db;
+    border-radius: 8px;
+    padding: 15px;
+}
+.generate-btn {
+    background-color: #3b82f6 !important;
+    color: white !important;
+}
+.generate-btn:hover {
+    background-color: #2563eb !important;
+}
+.example-btn {
+    background-color: #f3f4f6 !important;
+    border: 1px solid #d1d5db !important;
+    color: #374151 !important;
+}
+"""
+
+# Function to generate a random ID for the website
+def generate_site_id():
+    letters = string.ascii_lowercase + string.digits
+    return ''.join(random.choice(letters) for i in range(8))
+
+# List of example prompts
+example_prompts = [
+    "Create a landing page for a fitness app with a modern design",
+    "Make a personal portfolio website for a photographer with a dark theme",
+    "Design a restaurant website with menu, about us, and contact sections",
+    "Build a simple e-commerce product page for a smart watch",
+    "Create a tech startup landing page with features and pricing sections"
+]
+
+# Function to handle website generation
+def create_website(prompt):
+    site_id = generate_site_id()
+    
+    try:
+        # Generate HTML content based on the prompt
+        html_content = generate_website_html(prompt)
+        
+        # Save the HTML content to a file
+        os.makedirs('websites', exist_ok=True)
+        file_path = f"websites/{site_id}.html"
+        with open(file_path, "w") as f:
+            f.write(html_content)
+        
+        # In a real Hugging Face Space, you might use a different mechanism to serve the file
+        # For demo purposes, we'll return the HTML directly
+        preview_html = f"""
+        <div style="padding: 10px; background-color: #f0f0f0; border-radius: 8px; margin-bottom: 10px;">
+            <p><strong>Site ID:</strong> {site_id}</p>
+            <p><strong>Prompt:</strong> {prompt}</p>
+        </div>
+        <div style="border: 1px solid #ddd; border-radius: 8px; overflow: hidden;">
+            <iframe srcdoc="{html_content.replace('"', '&quot;')}" width="100%" height="600px"></iframe>
+        </div>
+        """
+        
+        return preview_html, html_content
+    
+    except Exception as e:
+        return f"Error generating website: {str(e)}", ""
+
+# Define the Gradio interface
+with gr.Blocks(css=css) as demo:
+    with gr.Column(elem_classes="container"):
+        gr.HTML("""
+        <div class="header">
+            <h1>🚀 InstaSite</h1>
+            <p>Generate a complete website from a simple prompt. Describe what you want, and we'll create it.</p>
+        </div>
+        """)
+        
+        with gr.Row():
+            prompt_input = gr.Textbox(
+                placeholder="Describe the website you want to create...",
+                label="Your Website Prompt",
+                elem_classes="prompt-box"
+            )
+        
+        with gr.Row():
+            generate_btn = gr.Button("Generate Website", elem_classes="generate-btn")
+        
+        with gr.Row():
+            gr.HTML("<p>Need inspiration? Try one of these examples:</p>")
+        
+        with gr.Row():
+            example_buttons = [gr.Button(f"Example {i+1}", elem_classes="example-btn") for i in range(5)]
+        
+        with gr.Accordion("Advanced Options", open=False):
+            gr.Checkbox(label="Include responsive design", value=True)
+            gr.Checkbox(label="Generate CSS animations", value=False)
+            gr.Dropdown(["Light", "Dark", "Colorful"], label="Color Theme", value="Light")
+        
+        output_preview = gr.HTML(elem_classes="output-container")
+        output_code = gr.Code(language="html", label="HTML Code", visible=False)
+        
+        # Set up button actions
+        generate_btn.click(create_website, inputs=[prompt_input], outputs=[output_preview, output_code])
+        
+        # Set up example button actions
+        for i, btn in enumerate(example_buttons):
+            btn.click(lambda _, i=i: example_prompts[i], outputs=prompt_input)
+
+# Launch the app
+if __name__ == "__main__":
+    demo.launch(share=True)