🎬 AI Movie Mood Recommender

\n {moods.map((mood) => (\n handleMoodSelect(mood)}\n className={selectedMood === mood ? \"selected\" : \"\"}\n >\n {mood} {getMoodEmoji(mood)}\n \n ))}\n

\n \n {loading &&

Loading... 🍿

}\n {error &&

{error}

}\n {recommendation && (\n

{recommendation.title}

{recommendation.description}

\n \n \n \n

\n )}\n {history.length > 0 && (\n

Your Movie History

\n {item.movie} - {item.feedback}\n

\n )}\n \n View Source\n \n

\n );\n}\n\nfunction getMoodEmoji(mood: Mood): string {\n const moodEmojis: { [key: string]: string } = {\n Happy: \"😊\",\n Sad: \"😢\",\n Excited: \"🎉\",\n Relaxed: \"😌\",\n Anxious: \"😰\",\n Angry: \"😠\",\n Bored: \"😑\",\n Confused: \"🤔\",\n Surprised: \"😲\",\n Tired: \"😴\",\n };\n\n return moodEmojis[mood] || \"🎭\";\n}\n\n// Client-side only code\nfunction client() {\n createRoot(document.getElementById(\"root\")!).render();\n}\n\nif (typeof document !== \"undefined\") {\n client();\n}\n\n// Server-side only code\nasync function server(request: Request): Promise {\n const url = new URL(request.url);\n const { sqlite } = await import(\"https://esm.town/v/stevekrouse/sqlite\");\n const KEY = \"AIMovie\";\n const SCHEMA_VERSION = 2;\n\n // Create tables if not exists\n await sqlite.execute(`\n CREATE TABLE IF NOT EXISTS ${KEY}_movies_${SCHEMA_VERSION} (\n id INTEGER PRIMARY KEY AUTOINCREMENT,\n title TEXT NOT NULL UNIQUE,\n description TEXT NOT NULL\n )\n `);\n\n await sqlite.execute(`\n CREATE TABLE IF NOT EXISTS ${KEY}_moods_${SCHEMA_VERSION} (\n id INTEGER PRIMARY KEY AUTOINCREMENT,\n mood TEXT NOT NULL UNIQUE\n )\n `);\n\n if (url.pathname === \"/recommend\" && request.method === \"POST\") {\n const { OpenAI } = await import(\"https://esm.town/v/std/openai\");\n const openai = new OpenAI();\n\n try {\n const { mood, history } = await request.json();\n\n // Get all recommended movies\n const result = await sqlite.execute(`SELECT title FROM ${KEY}_movies_${SCHEMA_VERSION}`);\n const recommendedMovies = result.rows.map(row => row.title);\n\n let prompt =\n `You are a movie recommendation system that only returns JSON and no extra text. Use the following structure: { \"movie_title\": \"string\", \"description\": \"string\" } Provide a movie recommendation based on the user's mood.`;\n\n if (history.length > 0) {\n prompt += ` The user has previously seen these movies: ${\n history.map(h => `${h.movie} (${h.feedback})`).join(\", \")\n }.`;\n }\n\n prompt += ` Recommend a different movie for when they're feeling ${mood}.`;\n\n const completion = await openai.chat.completions.create({\n messages: [\n { role: \"system\", content: prompt },\n {\n role: \"user\",\n content: `I'm feeling ${mood}. What movie do you recommend? Do not recommend any of these movies: ${\n recommendedMovies.join(\", \")\n }.`,\n },\n ],\n model: \"gpt-4-mini\",\n max_tokens: 150,\n });\n\n const recommendation = completion.choices[0].message.content;\n console.log(\"Raw AI response:\", recommendation);\n\n let title, description;\n\n try {\n const jsonObject = JSON.parse(recommendation);\n title = jsonObject.movie_title || jsonObject.title;\n description = jsonObject.description;\n } catch (error) {\n console.error(\"Error parsing JSON:\", error);\n // Fallback: try to extract title and description from the text\n const lines = recommendation.split(\"\\n\");\n title = lines[0].replace(/^(Title:|Movie:)?\\s*/i, \"\").trim();\n description = lines.slice(1).join(\"\\n\").trim();\n }\n\n if (!title || !description) {\n console.error(\"Failed to extract title or description. Raw response:\", recommendation);\n throw new Error(\"Failed to extract title or description from the recommendation\");\n }\n\n console.log(\"Extracted title:\", title);\n console.log(\"Extracted description:\", description);\n\n // Save the recommended movie\n await sqlite.execute(\n `\n INSERT INTO ${KEY}_movies_${SCHEMA_VERSION} (title, description)\n VALUES (?, ?)\n `,\n [title, description],\n );\n\n return new Response(JSON.stringify({ title, description }), {\n headers: { \"Content-Type\": \"application/json\" },\n });\n } catch (error) {\n console.error(\"Error getting recommendation:\", error);\n return new Response(JSON.stringify({ error: \"Failed to get recommendation\", details: error.message }), {\n status: 500,\n headers: { \"Content-Type\": \"application/json\" },\n });\n }\n }\n\n if (url.pathname === \"/more-moods\" && request.method === \"POST\") {\n const { OpenAI } = await import(\"https://esm.town/v/std/openai\");\n const openai = new OpenAI();\n\n try {\n const { currentMoods } = await request.json();\n\n const completion = await openai.chat.completions.create({\n messages: [\n { role: \"system\", content: \"You are a helpful assistant that generates mood suggestions for a movie recommendation system.\" },\n { role: \"user\", content: `Generate 5 new mood suggestions that are different from these: ${currentMoods.join(\", \")}. Return only a JSON array of mood strings.` },\n ],\n model: \"gpt-4-mini\",\n max_tokens: 100,\n });\n\n const newMoodsResponse = completion.choices[0].message.content;\n console.log(\"Raw AI response for moods:\", newMoodsResponse);\n\n let newMoods;\n try {\n newMoods = JSON.parse(newMoodsResponse);\n } catch (error) {\n console.error(\"Error parsing JSON for moods:\", error);\n newMoods = newMoodsResponse.replace(/^\\[|\\]$/g, '').split(',').map(mood => mood.trim());\n }\n\n if (!Array.isArray(newMoods) || newMoods.length === 0) {\n throw new Error(\"Failed to generate new moods\");\n }\n\n // Save new moods to the database\n for (const mood of newMoods) {\n await sqlite.execute(\n `INSERT OR IGNORE INTO ${KEY}_moods_${SCHEMA_VERSION} (mood) VALUES (?)`,\n [mood]\n );\n }\n\n return new Response(JSON.stringify({ moods: newMoods }), {\n headers: { \"Content-Type\": \"application/json\" },\n });\n } catch (error) {\n console.error(\"Error generating more moods:\", error);\n return new Response(JSON.stringify({ error: \"Failed to generate more moods\", details: error.message }), {\n status: 500,\n headers: { \"Content-Type\": \"application/json\" },\n });\n }\n }\n\n return new Response(\n `\n \n \n \n \n \n AI Movie Mood Recommender\n \n \n \n \n

\n \n \n \n `,\n {\n headers: { \"content-type\": \"text/html\" },\n },\n );\n}\n\nconst css = `\n body {\n font-family: 'Poppins', sans-serif;\n background-color: #f0f0f0;\n color: #333;\n line-height: 1.6;\n margin: 0;\n padding: 0;\n }\n .container {\n max-width: 800px;\n margin: 0 auto;\n padding: 20px;\n }\n h1 {\n text-align: center;\n color: #2c3e50;\n }\n .mood-container {\n display: flex;\n flex-wrap: wrap;\n justify-content: center;\n gap: 10px;\n margin-bottom: 20px;\n }\n button {\n background-color: #3498db;\n color: white;\n border: none;\n padding: 10px 20px;\n border-radius: 5px;\n cursor: pointer;\n transition: background-color 0.3s;\n }\n button:hover {\n background-color: #2980b9;\n }\n button.selected {\n background-color: #2c3e50;\n }\n .more-moods-btn {\n display: block;\n margin: 20px auto;\n background-color: #2c3e50;\n }\n .more-moods-btn:hover {\n background-color: #34495e;\n }\n .loading {\n text-align: center;\n font-style: italic;\n }\n .error {\n color: #e74c3c;\n text-align: center;\n }\n .recommendation {\n background-color: white;\n padding: 20px;\n border-radius: 5px;\n box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);\n margin-top: 20px;\n }\n .feedback-buttons {\n display: flex;\n justify-content: space-around;\n margin-top: 20px;\n }\n .history {\n margin-top: 30px;\n }\n .history ul {\n list-style-type: none;\n padding: 0;\n }\n .history li {\n background-color: white;\n margin-bottom: 10px;\n padding: 10px;\n border-radius: 5px;\n box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);\n }\n .view-source {\n display: block;\n text-align: center;\n margin-top: 30px;\n color: #7f8c8d;\n text-decoration: none;\n }\n .view-source:hover {\n text-decoration: underline;\n }\n`;\n\nexport default server;","deleted","label",[103],"permalink","https://www.val.town/x/movienerd/AIMovie/code/main.tsx","extension","routes/embed","actionData","errors"]