Spaces:
Paused
Paused
File size: 3,123 Bytes
c7b9c60 e6812d5 c7b9c60 e6812d5 734f3d3 bf6568f c7b9c60 bf6568f c7b9c60 bf6568f 734f3d3 c7b9c60 f95b0b5 c7b9c60 f95b0b5 c7b9c60 734f3d3 e6812d5 734f3d3 c7b9c60 734f3d3 bf6568f e6812d5 f95b0b5 e6812d5 bf6568f f95b0b5 bf6568f f95b0b5 bf6568f f95b0b5 bf6568f 5b8b5b9 c7b9c60 e6812d5 734f3d3 e6812d5 734f3d3 bf6568f e6812d5 734f3d3 e6812d5 bf6568f 5b8b5b9 734f3d3 bf6568f e6812d5 bf6568f c7b9c60 e6812d5 c7b9c60 |
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 |
"use client"
import { useEffect, useRef, useState, useTransition } from "react"
import { VideoPlayer } from "@/components/business/video-player"
import {
Select,
SelectContent,
SelectItem,
SelectTrigger,
SelectValue,
} from "@/components/ui/select"
import { render } from "./render"
import { Agent, AgentType, Scene } from "./agents/types"
import { agents, defaultAgent, getAgent } from "./agents"
import { ImageSegment } from "./types"
export default function Main() {
const [url, setUrl] = useState<string>("")
const [isPending, startTransition] = useTransition()
const [scene, setScene] = useState<Scene>()
const [segments, setSegments] = useState<ImageSegment[]>([])
const ref = useRef<AgentType>(defaultAgent)
useEffect(() => {
const updateView = async () => {
// console.log(`update view..`)
await startTransition(async () => {
// console.log(`getting agent..`)
const type = ref?.current
const agent = getAgent(type)
// console.log(`asking agent to determine things..`)
const scene = agent.simulate()
// console.log(`rendering scene..`)
const rendered = await render(scene.prompt, scene.actionnables)
if (type !== ref?.current) {
console.log("agent type changed! reloading scene")
setTimeout(() => { updateView() }, 0)
return
}
if (rendered.videoUrl) {
// console.log(`got a new url: ${newUrl}`)
setUrl(rendered.videoUrl)
setScene(scene)
setSegments(rendered.segments)
setTimeout(() => { updateView()}, 1000)
} else {
// console.log(`going to wait a bit more: ${newUrl}`)
setTimeout(() => { updateView()}, rendered.error ? 6000 : 3000)
}
})
}
updateView()
}, [])
return (
<div className="flex flex-col w-full pt-4">
<div className="flex flex-col space-y-3 px-2">
<div className="flex flex-row items-center space-x-3">
<label className="flex">Agent model:</label>
<Select
defaultValue={defaultAgent}
onValueChange={(value) => {
ref.current = value as AgentType
setUrl("")
}}>
<SelectTrigger className="w-[180px]">
<SelectValue placeholder="Type" />
</SelectTrigger>
<SelectContent>
{Object.entries(agents).map(([key, agent]) =>
<SelectItem key={key} value={key}>{agent.title}</SelectItem>
)}
</SelectContent>
</Select>
</div>
<p>Note: changing the model might take up to 1 minute</p>
{(scene) ? <div>
<p>Action: {scene.action}</p>
<p>Position: {scene.position}</p>
<p>Light: {scene.light}</p>
</div> : null}
<div className="flex flex-col">
{segments.map((segment, i) =>
<div key={i}>
{segment.label} ({segment.score})
</div>)}
</div>
</div>
<VideoPlayer url={url} />
</div>
)
} |