🎥 AI Video Creator

\n \n

\n \n {selectedVideo && (\n

\n )}\n\n {videoAnalysis && (\n

AI Video Insights

Mood: {videoAnalysis.mood}

Tags: {videoAnalysis.tags.join(', ')}

Summary: {videoAnalysis.summary}

\n )}\n

\n\n

🤖 AI Video Templates

\n {videoTemplates.map(template => (\n

generateVideoFromTemplate(template)}\n >\n {template.icon}\n

{template.name}

{template.description}

\n 📏 {template.recommendedDuration}s\n

\n ))}\n

\n\n

Recent Videos

\n {videos.map(video => (\n

\n ))}\n

\n );\n}\n\nfunction client() {\n createRoot(document.getElementById(\"root\")).render();\n}\nif (typeof document !== \"undefined\") { client(); }\n\nexport default async function server(request: Request): Promise {\n const { OpenAI } = await import(\"https://esm.town/v/std/openai\");\n const openai = new OpenAI();\n\n const url = new URL(request.url);\n\n // Video Analysis Endpoint\n if (url.pathname === '/analyze-video' && request.method === 'POST') {\n const formData = await request.formData();\n const videoFile = formData.get('video') as File;\n\n try {\n // Simulated video analysis (in a real scenario, you'd use a more advanced video processing service)\n const analysisResponse = await openai.chat.completions.create({\n messages: [\n { \n role: \"user\", \n content: \"Analyze this video. Provide a mood, relevant tags, and a brief summary.\" \n }\n ],\n model: \"gpt-4o-mini\",\n max_tokens: 300\n });\n\n const analysisText = analysisResponse.choices[0].message.content || '';\n const [mood, tagsStr, summary] = analysisText.split('|').map(s => s.trim());\n const tags = tagsStr.split(',').map(tag => tag.trim());\n\n return new Response(JSON.stringify({ \n analysis: { mood, tags, summary } \n }), {\n headers: { 'Content-Type': 'application/json' }\n });\n } catch (error) {\n return new Response(JSON.stringify({ error: 'Video analysis failed' }), {\n status: 500,\n headers: { 'Content-Type': 'application/json' }\n });\n }\n }\n\n // Video Generation Endpoint\n if (url.pathname === '/generate-video-content' && request.method === 'POST') {\n const { template, userContext } = await request.json();\n\n try {\n // Generate video concept\n const conceptResponse = await openai.chat.completions.create({\n messages: [\n { \n role: \"system\", \n content: \"You are a creative video content generator for social media.\" \n },\n { \n role: \"user\", \n content: `Generate a ${template.category} video concept for ${userContext.username}. \n Template: ${template.name}\n Description: ${template.description}\n Recommended Duration: ${template.recommendedDuration} seconds` \n }\n ],\n model: \"gpt-4o-mini\",\n max_tokens: 300\n });\n\n const videoContent = conceptResponse.choices[0].message.content || '';\n const [title, description] = videoContent.split('|').map(s => s.trim());\n\n // Generate a placeholder image/thumbnail\n const thumbnailResponse = await fetch(`https://maxm-imggenurl.web.val.run/${encodeURIComponent(title)}`);\n const thumbnailUrl = thumbnailResponse.url;\n\n // Simulate video URL (in a real app, this would be an actual video generation/upload)\n const videoUrl = `https://maxm-imggenurl.web.val.run/video-${encodeURIComponent(title)}`;\n\n return new Response(JSON.stringify({\n title,\n description,\n videoUrl,\n thumbnailUrl,\n analysis: {\n mood: 'Engaging',\n tags: [template.category, 'AI-Generated'],\n summary: description\n }\n }), {\n headers: { 'Content-Type': 'application/json' }\n });\n } catch (error) {\n return new Response(JSON.stringify({ error: 'Video content generation failed' }), {\n status: 500,\n headers: { 'Content-Type': 'application/json' }\n });\n }\n }\n\n return new Response(`\n \n \n AI Video Creator\n \n \n \n \n

\n \n \n \n `, {\n headers: { \"Content-Type\": \"text/html\" }\n });\n}\n\nconst css = `\nbody {\n font-family: 'Arial', sans-serif;\n background-color: #f4f4f4;\n margin: 0;\n padding: 20px;\n}\n\n.ai-video-app {\n max-width: 800px;\n margin: 0 auto;\n background-color: white;\n padding: 20px;\n border-radius: 10px;\n box-shadow: 0 4px 6px rgba(0,0,0,0.1);\n}\n\n.video-upload-section {\n margin-bottom: 20px;\n text-align: center;\n}\n\n.ai-video-templates {\n margin-bottom: 20px;\n}\n\n.template-grid {\n display: grid;\n grid-template-columns: repeat(2, 1fr);\n gap: 15px;\n}\n\n.template-card {\n background-color: #f9f9f9;\n border-radius: 8px;\n padding: 15px;\n text-align: center;\n cursor: pointer;\n transition: transform 0.3s ease;\n}\n\n.template-card:hover {\n transform: scale(1.05);\n background-color: #f0f0f0;\n}\n\n.template-icon {\n font-size: 2em;\n display: block;\n margin-bottom: 10px;\n}\n\n.video-feed {\n margin-top: 20px;\n}\n\n.video-post {\n margin-bottom: 20px;\n background-color: #f9f9f9;\n border-radius: 8px;\n overflow: hidden;\n}\n\n.video-post video {\n width: 100%;\n max-height: 400px;\n object-fit: cover;\n}\n\n.video-details {\n padding: 15px;\n}\n\n.ai-badge {\n display: inline-block;\n background-color: #e0f7fa;\n color: #00838f;\n padding: 5px 10px;\n border-radius: 4px;\n margin-top: 10px;\n}\n`;","deleted","label",[98],"permalink","https://www.val.town/x/Priyansh/aiVideoApp/code/main.tsx","extension","actionData","errors"]

🎥 AI Video Creator

AI Video Insights

🤖 AI Video Templates

{template.name}

Recent Videos

{video.title}