Spaces:
Sleeping
Sleeping
| import gradio as gr | |
| from transformers import pipeline | |
| import zipfile | |
| import io | |
| # Load AI assistant (can change model to faster one if needed) | |
| assistant = pipeline("text-generation", model="tiiuae/falcon-7b-instruct", max_new_tokens=1024) | |
| def generate_code(prompt): | |
| formatted = f"Create a full website. Include:\n[HTML]\n...HTML here...\n[CSS]\n...CSS here...\n[JS]\n...JS here...\nUser Prompt: {prompt}" | |
| response = assistant(formatted)[0]["generated_text"] | |
| # Try to split out HTML, CSS, JS sections | |
| html = css = js = "" | |
| if "[HTML]" in response and "[CSS]" in response and "[JS]" in response: | |
| try: | |
| html = response.split("[HTML]")[1].split("[CSS]")[0].strip() | |
| css = response.split("[CSS]")[1].split("[JS]")[0].strip() | |
| js = response.split("[JS]")[1].strip() | |
| except: | |
| html = response | |
| else: | |
| html = response | |
| return html, css, js, f"✅ AI generated your website!" | |
| def combine_code(html, css, js): | |
| return f""" | |
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <style>{css}</style> | |
| </head> | |
| <body> | |
| {html} | |
| <script>{js}</script> | |
| </body> | |
| </html> | |
| """ | |
| def export_zip(html, css, js): | |
| in_memory = io.BytesIO() | |
| with zipfile.ZipFile(in_memory, 'w') as zf: | |
| zf.writestr("index.html", f"<!DOCTYPE html><html><head><link rel='stylesheet' href='style.css'></head><body>\n{html}\n<script src='script.js'></script></body></html>") | |
| zf.writestr("style.css", css) | |
| zf.writestr("script.js", js) | |
| in_memory.seek(0) | |
| return (in_memory, "website.zip") | |
| with gr.Blocks(css=""" | |
| body { font-family: 'Courier New', monospace; background-color: #1e1e1e; color: white; } | |
| .gr-button { background-color: #007acc; color: white; border: none; } | |
| .gr-code textarea { background-color: #252526; color: white; font-size: 14px; } | |
| .gr-textbox textarea { background-color: #1e1e1e; color: white; } | |
| .gr-markdown h2 { color: #61dafb; } | |
| """) as demo: | |
| with gr.Row(): | |
| with gr.Column(scale=1): | |
| gr.Markdown("## 🤖 AI Assistant") | |
| prompt = gr.Textbox(label="Describe the website you want", placeholder="e.g., A landing page for a pet adoption service") | |
| generate_btn = gr.Button("✨ Generate Website") | |
| status = gr.Textbox(label="Status") | |
| with gr.Column(scale=2): | |
| gr.Markdown("## 💻 Code Editor (HTML / CSS / JS)") | |
| with gr.Tabs(): | |
| with gr.Tab("HTML"): | |
| html_editor = gr.Code(language="html", label="HTML") | |
| with gr.Tab("CSS"): | |
| css_editor = gr.Code(language="css", label="CSS") | |
| with gr.Tab("JavaScript"): | |
| js_editor = gr.Code(language="javascript", label="JavaScript") | |
| run_btn = gr.Button("▶️ Preview") | |
| preview = gr.HTML() | |
| zip_btn = gr.Button("📦 Export as ZIP") | |
| zip_file = gr.File() | |
| # Button Actions | |
| generate_btn.click(generate_code, inputs=prompt, outputs=[html_editor, css_editor, js_editor, status]) | |
| run_btn.click(combine_code, inputs=[html_editor, css_editor, js_editor], outputs=preview) | |
| zip_btn.click(export_zip, inputs=[html_editor, css_editor, js_editor], outputs=zip_file) | |
| demo.launch() |