Spaces:
Running
Running
| import os | |
| from flask import Flask, render_template_string | |
| import gradio as gr | |
| # Initialize Flask app | |
| app = Flask(__name__) | |
| # Install and upgrade gradio if not already installed | |
| os.system("pip install --upgrade gradio") | |
| # HTML template with metadata | |
| html_template = """ | |
| <!DOCTYPE html> | |
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <!-- Twitter Card metadata --> | |
| <meta name="twitter:card" content="player"> | |
| <meta name="twitter:site" content="@broadfield-dev"> | |
| <meta name="twitter:title" content="Gradio Sketch Demo"> | |
| <meta name="twitter:description" content="No-Code Gradio App Builder - Demo"> | |
| <meta name="twitter:image" content="https://your-domain.com/preview-image.jpg"> | |
| <meta name="twitter:player" content="https://broadfield-dev-gradio-sketch.hf.space"> | |
| <meta name="twitter:player:width" content="480"> | |
| <meta name="twitter:player:height" content="480"> | |
| <meta name="twitter:player:stream" content="https://broadfield-dev-gradio-sketch.hf.space"> | |
| <title>Gradio Sketch Demo</title> | |
| </head> | |
| <body> | |
| {{ gradio_ui|safe }} | |
| </body> | |
| </html> | |
| """ | |
| # Define the Gradio interface | |
| def create_gradio_interface(): | |
| with gr.Blocks(title="Gradio Sketch Demo") as demo: | |
| gr.Markdown("# Gradio Sketch Demo") | |
| sketchpad = gr.Sketchpad() | |
| output = gr.Image() | |
| sketchpad.change(fn=lambda x: x, inputs=sketchpad, outputs=output) | |
| return demo | |
| # Flask route | |
| def index(): | |
| gradio_app = create_gradio_interface() | |
| # Launch Gradio and get its HTML content | |
| gradio_html = gradio_app.launch(prevent_thread_lock=True, show_api=False, inline=True) | |
| return render_template_string(html_template, gradio_ui=gradio_html) | |
| if __name__ == "__main__": | |
| # For Hugging Face Spaces, use port 7860 | |
| app.run(host="0.0.0.0", port=7860, debug=False) |