Spaces:
Sleeping
Sleeping
| import gradio as gr | |
| import os | |
| import shutil | |
| import uuid | |
| import subprocess | |
| from threading import Timer | |
| from functools import partial | |
| import time | |
| from huggingface_hub import InferenceClient | |
| from smolagents import ToolCollection, CodeAgent, InferenceClientModel | |
| MODEL = "Qwen/Qwen2.5-Coder-32B-Instruct" | |
| BUILD_SERVER_MCP_CONFIG = {"url": "https://agents-mcp-hackathon-gradio-motioncanvas-mcp-server.hf.space/gradio_api/mcp/sse", "transport": "sse"} | |
| DOCS_SERVER_MCP_CONFIG = {"url": "https://prathje-gradio-motioncanvas-docs-mcp-server.hf.space/gradio_api/mcp/sse", "transport": "sse"} | |
| all_tools = [] | |
| with ToolCollection.from_mcp(BUILD_SERVER_MCP_CONFIG, trust_remote_code=True) as build_tool_collection: | |
| with ToolCollection.from_mcp(DOCS_SERVER_MCP_CONFIG, trust_remote_code=True) as docs_tool_collection: | |
| all_tools = build_tool_collection.tools + docs_tool_collection.tools | |
| if os.environ.get("HF_TOKEN"): | |
| model = InferenceClientModel(model_id=MODEL) | |
| agent = CodeAgent(tools=[*all_tools], model=model) | |
| def generate(message, history, code, logs): | |
| try: | |
| res = agent.run( | |
| "From the following prompt, generate code for a standalone motion canvas scene.tsx and build. You can browse the docs to help you.", | |
| additional_args={'prompt': 'Please animate the formula for the area of a circle'} | |
| ) | |
| print(res) | |
| except Exception as e: | |
| print(e) | |
| return "An error occurred while generating the code", "", "" | |
| else: | |
| print("No HF_TOKEN found, Zero GPU space not implemented") | |
| def generate(message, history, code, logs): | |
| return "LLM not available", "", "" | |
| from gradio_motioncanvasplayer import MotionCanvasPlayer | |
| # Just some example project that servers as a placholder in the beginning | |
| example_project_path = "https://prathje-gradio-motioncanvasplayer.hf.space/gradio_api/file=/home/user/app/public/project-3.17.2.js" | |
| def load_example(example): | |
| return example['project_path'], example['code'], "" | |
| with gr.Blocks(theme=gr.themes.Monochrome()) as app: | |
| gr.Markdown("# Motion Canvas Agent") | |
| gr.Markdown("Leverage the power of AI and Motion Canvas to create animations using TypeScript.") | |
| player = MotionCanvasPlayer(example_project_path, auto=True, quality=0.5, width=1920, height=1080, variables="{}", render=False) | |
| code = gr.Code(value="", language="typescript", render=False) | |
| logs = gr.Textbox(value="", label="Build Logs", interactive=False, render=False) | |
| with gr.Row(): | |
| with gr.Column(): | |
| gr.Markdown("## Chat") | |
| chat = gr.ChatInterface(fn=generate, type="messages", additional_inputs=[code, logs], additional_outputs=[player, code, logs]) | |
| with gr.Column(): | |
| gr.Markdown("## Preview") | |
| player.render() | |
| if __name__ == "__main__": | |
| # Todo: In the future we could allow to use this as an MCP server, but right now, we need the preview to be available. | |
| app.launch(mcp_server=False, strict_cors=False) |