Spaces:
Configuration error
Configuration error
File size: 5,293 Bytes
4f4b3e9 d407aad 2e9424b d407aad 4f4b3e9 d407aad 4f4b3e9 d407aad 4f4b3e9 d407aad |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 |
import gradio as gr
from transformers import AutoModelForCausalLM, AutoTokenizer
import time
import os
from utils.zip_generator import create_zip
from utils.code_explainer import explain_code
# Load the AI model (using DeepSeek Coder 1.3B as default)
MODEL_NAME = "deepseek-ai/deepseek-coder-1.3b"
tokenizer = AutoTokenizer.from_pretrained(MODEL_NAME)
model = AutoModelForCausalLM.from_pretrained(MODEL_NAME)
# Predefined prompts for common website types
PREBUILT_PROMPTS = {
"Portfolio": "Create a modern portfolio website with dark mode toggle, hero section, about me, projects grid, and contact form. Use Tailwind CSS for styling.",
"Blog": "Build a blog homepage with responsive navbar, featured post section, article cards grid, and newsletter subscription. Make it minimalist and elegant.",
"Landing Page": "Design a one-page landing page for a SaaS product with hero section, features, testimonials, pricing table, and CTA button. Use bright colors.",
"E-commerce": "Create an e-commerce product page with image gallery, product details, add to cart button, and related products section. Make it mobile-friendly."
}
def generate_website(prompt, use_prebuilt=False, explain=False):
start_time = time.time()
# Use prebuilt prompt if selected
if use_prebuilt and prompt in PREBUILT_PROMPTS:
prompt = PREBUILT_PROMPTS[prompt]
# Construct the full prompt for the AI
full_prompt = f"""Create a complete, responsive website based on this description:
{prompt}
Requirements:
- Use HTML, CSS, and minimal JavaScript
- Make it mobile-friendly
- Include all necessary UI elements
- Add comments in the code
Here's the complete code:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Generated Website</title>
<style>"""
# Generate code using the AI model
inputs = tokenizer(full_prompt, return_tensors="pt")
outputs = model.generate(**inputs, max_length=1500, temperature=0.7)
generated_code = tokenizer.decode(outputs[0], skip_special_tokens=True)
# Extract the HTML part (from the prompt onward)
html_start = generated_code.find("<!DOCTYPE html>")
if html_start == -1:
html_start = generated_code.find("<html")
if html_start != -1:
generated_code = generated_code[html_start:]
# Create explanation if requested
explanation = ""
if explain:
explanation = explain_code(generated_code)
# Generate downloadable ZIP
zip_path = create_zip(generated_code)
processing_time = time.time() - start_time
return generated_code, zip_path, explanation, f"Generated in {processing_time:.2f} seconds"
# Gradio UI
with gr.Blocks(title="AI Website Builder", theme=gr.themes.Soft()) as demo:
gr.Markdown("# 🚀 AI Website Builder")
gr.Markdown("Describe the website you want and we'll generate the code for you!")
with gr.Row():
with gr.Column(scale=3):
prompt_type = gr.Dropdown(
choices=list(PREBUILT_PROMPTS.keys()),
label="Or select a prebuilt template",
value="Portfolio"
)
user_prompt = gr.Textbox(
label="Describe your website",
placeholder="e.g., 'A modern portfolio with dark mode and contact form'",
lines=3
)
explain_checkbox = gr.Checkbox(label="Explain the generated code", value=False)
generate_btn = gr.Button("Generate Website", variant="primary")
with gr.Column(scale=2):
gr.Examples(
examples=[
["A minimalist personal blog with dark mode"],
["A restaurant homepage with menu and reservation form"],
["A tech startup landing page with animated features"]
],
inputs=user_prompt,
label="Example Prompts"
)
with gr.Row():
code_output = gr.Code(
label="Generated Code",
language="html",
interactive=True
)
html_output = gr.HTML(
label="Live Preview",
interactive=False
)
with gr.Row():
time_output = gr.Textbox(label="Generation Time")
download_btn = gr.Button("Download Code as ZIP")
download_file = gr.File(label="Download", visible=False)
explanation_output = gr.Textbox(
label="Code Explanation",
visible=False,
lines=5
)
# Event handlers
generate_btn.click(
fn=generate_website,
inputs=[user_prompt, prompt_type, explain_checkbox],
outputs=[code_output, download_file, explanation_output, time_output]
)
code_output.change(
fn=lambda x: x,
inputs=code_output,
outputs=html_output
)
download_btn.click(
fn=lambda x: x,
inputs=download_file,
outputs=download_file
)
explain_checkbox.change(
fn=lambda x: gr.Textbox(visible=x),
inputs=explain_checkbox,
outputs=explanation_output
)
if __name__ == "__main__":
demo.launch() |