🤖 Voice Assistant

\n {renderBrowserSupportWarning()}\n

\n Select Voice: \n \n

\n \n {response && (\n

{response}

\n )}\n

\n \n View Source\n \n

\n );\n}\n\nconst styles = {\n container: {\n fontFamily: 'Arial, sans-serif',\n maxWidth: '400px',\n margin: '0 auto',\n textAlign: 'center',\n padding: '20px',\n },\n voiceSelector: {\n margin: '20px 0',\n },\n normalButton: {\n backgroundColor: '#4CAF50',\n color: 'white',\n border: 'none',\n padding: '10px 20px',\n borderRadius: '5px',\n cursor: 'pointer',\n },\n listeningButton: {\n backgroundColor: '#FF5722',\n color: 'white',\n border: 'none',\n padding: '10px 20px',\n borderRadius: '5px',\n opacity: 0.5,\n cursor: 'not-allowed',\n },\n responseBox: {\n marginTop: '20px',\n padding: '10px',\n backgroundColor: '#f0f0f0',\n borderRadius: '5px',\n },\n warningBox: {\n backgroundColor: '#FFEB3B',\n color: '#000',\n padding: '10px',\n borderRadius: '5px',\n margin: '10px 0',\n },\n sourceLink: {\n marginTop: '20px',\n fontSize: '12px',\n },\n sourceLinkText: {\n color: '#888',\n textDecoration: 'none',\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 return new Response(`\n \n \n Voice Assistant\n \n \n \n

\n \n \n \n \n `, {\n headers: { \"content-type\": \"text/html\" }\n });\n}\n\nasync function fetchAIResponse(query: string): Promise {\n const { OpenAI } = await import(\"https://esm.town/v/std/openai\");\n const openai = new OpenAI();\n\n const completion = await openai.chat.completions.create({\n messages: [\n { role: \"system\", content: \"You are a helpful voice assistant. Keep responses concise and friendly.\" },\n { role: \"user\", content: query }\n ],\n model: \"gpt-4o-mini\",\n max_tokens: 100,\n });\n\n return completion.choices[0]?.message?.content || \"I'm not sure how to respond.\";\n}","deleted","label",[98],"permalink","https://www.val.town/x/Nxnxnxnxn/adaptableJadeCrow/code/main.tsx","extension","actionData","errors"]