// This approach creates an HTML page with an iframe and a form to submit prompts to VALL-E. // We use postMessage to communicate between the iframe and the parent window. // The main function renders the HTML and handles the postMessage events. // We use a list of 10 prompts to test VALL-E with various small website scenarios. // We've added functionality to evaluate the generated vals and retry on errors. // Timeouts have been added for both generation and evaluation phases. // A query parameter "model" can be passed to specify the model to use. // The progress information is now displayed above the iframe, including the model being used. export default async function main(req: Request): Promise { const url = new URL(req.url); const model = url.searchParams.get("model") || "gpt-4o-mini"; const contextWindowSize = url.searchParams.get("contextWindowSize") || "9999999999"; const genericPrompt = "Create an HTML website that returns meaningful HTML on the homepage (without any query parameters). It should have a backend that uses blob storage. "; const prompts = [ "Create a simple todo list app with a backend API", "Develop a basic blog platform with posts and comments", "Make a currency converter (with hardcoded exchange rates)", "Create a quiz game with a scoring system", "Build a simple e-commerce product listing page", "Develop a recipe sharing website with search functionality", "Make a basic chat application", "Create a personal finance tracker with data visualization", "Build a movie review website with user ratings", "Make a realistic looking Hacker News clone with a backend, upvotes, and a separate page for submitting new stories", ].map(prompt => genericPrompt + prompt); const html = ` VALL-E Evaluation

VALL-E Evaluation

Model: ${model}

`; return new Response(html, { headers: { "Content-Type": "text/html" }, }); }

eVALLuator