Character Guesser

\n {isLoading ? \"Thinking...\" : message}\n

\n {\n setSwipeDirection(\"left\");\n setSwipeProgress(1);\n setTimeout(() => handleAIRequest(\"left\"), 300);\n }}\n disabled={isLoading}\n className=\"w-16 h-16 bg-red-500 rounded-full shadow-lg flex items-center justify-center disabled:opacity-50 disabled:cursor-not-allowed\"\n title=\"No\"\n >\n \n \n \n \n {\n setGameStarted(false);\n setMessage(\"Think of a new character, then swipe right to start!\");\n setImageUrl(\"\");\n window.history.replaceState({}, \"\", window.location.pathname);\n }}\n className=\"w-16 h-16 bg-blue-500 rounded-full shadow-lg flex items-center justify-center\"\n title=\"Reset\"\n >\n \n \n \n \n {\n setSwipeDirection(\"right\");\n setSwipeProgress(1);\n setTimeout(() => handleAIRequest(\"right\"), 300);\n }}\n disabled={isLoading}\n className=\"w-16 h-16 bg-green-500 rounded-full shadow-lg flex items-center justify-center disabled:opacity-50 disabled:cursor-not-allowed\"\n title=\"Yes\"\n >\n \n \n \n \n

\n \n View Source\n \n \n );\n}\n\nfunction client() {\n createRoot(document.getElementById(\"root\")).render();\n}\n\nif (typeof document !== \"undefined\") { client(); }\n\nexport default async function server(request: Request): Promise {\n const url = new URL(request.url);\n\n if (url.pathname === \"/ai\") {\n const direction = url.searchParams.get(\"direction\");\n const conversationParam = url.searchParams.get(\"conversation\");\n const { Cerebras } = await import(\"https://esm.sh/@cerebras/cerebras_cloud_sdk\");\n const client = new Cerebras({ apiKey: Deno.env.get(\"CEREBRAS_API_KEY\") });\n\n let conversation = conversationParam ? JSON.parse(decodeURIComponent(conversationParam)) : [];\n\n console.log(conversation);\n\n if (conversation.length === 0) {\n conversation = [\n {\n role: \"system\",\n content:\n \"You are an AI that guesses the fictional or real character that the user is thinking of. Ask yes/no questions to gather information. The user will respond with 'yes' for yes and 'no' for no. Start by introducing the game and asking the first question. After each response, also provide a brief image description (without spaces) based on the current knowledge of the character.\",\n },\n {\n role: \"assistant\",\n content:\n \"Welcome to the Character Guesser game! I'll try to guess the character you're thinking of by asking yes/no questions. Let's begin! Is your character a real person (as opposed to fictional)?\\n\\nImage description: mysterious_silhouette_with_question_mark\",\n },\n ];\n }\n\n // Add user's response to the conversation\n if (direction === \"right\" || direction === \"left\") {\n conversation.push({ role: \"user\", content: direction === \"right\" ? \"Yes\" : \"No\" });\n }\n\n try {\n const completion = await client.chat.completions.create({\n messages: conversation,\n model: \"llama3.3-70b\",\n });\n\n const aiMessage = completion.choices[0].message.content.trim();\n const [message, imageDescription] = aiMessage.split(\"\\n\\nImage description: \");\n const imageUrl = `https://maxm-imggenurl.web.val.run/${imageDescription}`;\n\n conversation.push({ role: \"assistant\", content: aiMessage });\n\n return new Response(JSON.stringify({ message, imageUrl, conversation }), {\n headers: { \"Content-Type\": \"application/json\" },\n });\n } catch (error) {\n return new Response(JSON.stringify({ message: \"Error generating AI response\" }), {\n status: 500,\n headers: { \"Content-Type\": \"application/json\" },\n });\n }\n }\n\n return new Response(\n `\n \n \n \n \n \n Character Guesser\n \n \n \n

\n \n \n \n \n `,\n {\n headers: {\n \"content-type\": \"text/html\",\n },\n },\n );\n}","deleted","label",[99],"permalink","https://www.val.town/x/vawogbemi/characterGuesser/code/main.tsx","extension","actionData","errors"]