AI Vector Mask Artisan

\n This application translates your creative description and geometric constraints into a\n complete, symmetric, vector-based SVG eye mask using AI.\n

\n\n

Controls

\n \n

\n\n

Result (SVG)

\n $\"Generated$ \n

\n\n\n\n`;\n}\n\n// --- VAL TOWN HTTP HANDLER ---\n\nexport default async function(req: Request) {\n const url = new URL(req.url);\n\n // --- POST: Handle API request for generation ---\n if (req.method === \"POST\") {\n let body;\n try {\n body = await req.json();\n if (!body.description || !body.eye_y_v) {\n throw new Error(\"Missing required fields: description, eye_y_v\");\n }\n } catch (e) {\n return new Response(JSON.stringify({ error: `Invalid request: ${e.message}` }), {\n status: 400,\n headers: { \"Content-Type\": \"application/json\" },\n });\n }\n\n try {\n const openai = new OpenAI();\n\n // Construct the precise user message for the AI\n const userMessage = `\n DESCRIPTION: \"${body.description}\"\n GEOMETRY:\n - eye_y_v: ${body.eye_y_v}\n - eye_separation_u: ${body.eye_separation_u}\n - eye_width_u: ${body.eye_width_u}\n - eye_height_v: ${body.eye_height_v}\n `;\n\n const completion = await openai.chat.completions.create({\n model: \"gpt-4o\",\n messages: [\n { role: \"system\", content: SVG_GENERATOR_PROMPT },\n { role: \"user\", content: userMessage },\n ],\n temperature: 0.4,\n response_format: { type: \"json_object\" },\n });\n\n const aiResponse = completion.choices[0].message.content;\n\n // Robustly extract the JSON from the AI's response\n const jsonString = extractJson(aiResponse);\n if (!jsonString) {\n throw new Error(\"AI returned a non-JSON response.\");\n }\n\n const parsed = JSON.parse(jsonString);\n if (!parsed.svg || !parsed.reason) {\n throw new Error(\"AI response is missing 'svg' or 'reason' keys.\");\n }\n\n // Sanitize the untrusted AI output by Base64-encoding the SVG.\n // This allows it to be safely rendered in an tag\n // via a data URL, mitigating XSS risks.\n const svgBase64 = btoa(parsed.svg);\n const dataUrl = `data:image/svg+xml;base64,${svgBase64}`;\n\n return new Response(JSON.stringify({\n svgDataUrl: dataUrl,\n reason: parsed.reason,\n }), {\n headers: { \"Content-Type\": \"application/json\" },\n });\n } catch (error) {\n console.error(\"AI Generation Error:\", error);\n return new Response(JSON.stringify({ error: `AI generation failed: ${error.message}` }), {\n status: 500,\n headers: { \"Content-Type\": \"application/json\" },\n });\n }\n }\n\n // --- GET: Serve the HTML frontend ---\n const sourceUrl = `https://${url.hostname}${url.pathname}`;\n return new Response(generateHtml(sourceUrl), { headers: { \"Content-Type\": \"text/html\" } });\n}","deleted","label",[99],"permalink","https://www.val.town/x/bomb/hmmm/code/main.ts","extension","actionData","errors"]