[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8,"_9":10},"actionData","errors","root",{"_205":206,"_207":208},"routes/_app.x.$handle.$name",{"_11":12,"_13":14,"_15":16,"_17":18,"_38":-7,"_121":-5,"_19":122,"_123":124,"_125":126,"_127":128,"_129":130,"_21":131,"_132":-5,"_133":-5,"_134":24,"_135":136,"_137":84,"_138":-5,"_139":-5,"_140":141},"routes/_app.x.$handle.$name.branch.$branch.history_.$",{"_11":12,"_13":14,"_15":16,"_17":18,"_19":20,"_21":22,"_23":24,"_25":26,"_27":28,"_29":24,"_30":-5},"handle","adamsliu13","name","chinese-vocab-conversation","branchName","main","path","frontend/index.html","project",{"_32":71,"_13":14,"_36":72,"_73":-5,"_74":24,"_75":76,"_77":76,"_78":79,"_80":-5,"_30":67,"_81":82,"_83":84,"_85":-5,"_86":-5,"_87":26,"_40":41,"_88":-5,"_89":-5,"_90":-5,"_91":-5,"_92":93,"_94":93,"_95":96,"_97":96,"_98":96,"_99":93,"_100":93,"_52":101,"_102":103,"_104":105,"_106":24},"file",{"_62":63,"_13":64,"_65":21,"_66":24,"_70":-5},"isDirectory",false,"page",0,"history",[31],"hasNext","userId",{"_32":33,"_34":35,"_36":37,"_38":39,"_40":41,"_42":43,"_44":-5,"_45":46,"_47":-5,"_48":-5,"_49":-5,"_50":-5,"_51":-5,"_52":53,"_21":54,"_55":-5,"_56":-5,"_57":-5,"_58":-5,"_59":60},"id","f69b6626-3dc4-11f1-b93b-42b51c65c3df","branchId","e8670240-3dc4-11f1-8543-42b51c65c3df","createdAt",["D",1776805158229],"version",2,"orgId","019db1d0-4320-765e-984f-fd383e1c531e","parentId","f3323cf8-3dc4-11f1-882f-42b51c65c3df","incomingCommitId","aiChatMessageId","f1e59811-332b-4d14-8c10-56c21971fd1f","aiChatThreadId","aiChatThreadUserId","aiChatThreadTitle","source","clientLabel","user",{"_32":67,"_40":41,"_11":12,"_68":69},{"_62":63,"_13":64,"_65":21,"_66":24},"pull","merge","revert","multiple","commits",[61],{"_32":33,"_34":35,"_36":37,"_38":39,"_40":41,"_42":43,"_44":-5,"_45":46,"_47":-5,"_48":-5,"_49":-5,"_50":-5,"_51":-5,"_52":53,"_21":54,"_55":-5,"_56":-5,"_57":-5},"fileId","f687cf12-3dc4-11f1-b93b-42b51c65c3df","index.html","fileType","deleted","08948d3c-72fa-4c43-a8ea-1ec9b7450dd2","avatar","","deletedAtVersion","e866a872-3dc4-11f1-8543-42b51c65c3df",["D",1776805134710],"deletedAt","legacyEnvVars","privacy","public","httpPrivacy","description","Generate 2-person Chinese conversation scripts from vocab words","imageUrl","pinnedFileId","f3307120-3dc4-11f1-882f-42b51c65c3df","pinPreview",true,"pinMigrated","screenshotVersion","likeCount","tursoName","tursoHostname","tursoMeasuredAt","pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm",{"_11":12,"_120":69},"org",{"_11":12,"_116":-5,"_68":69,"_30":67,"_117":118,"_119":24},"branch",{"_38":107,"_13":16,"_32":35,"_108":71,"_109":-5,"_110":-5,"_111":-5,"_112":-5,"_113":-5,"_114":14,"_115":12},"isOwned",7,"projectId","forkedBranchId","forkedBranchVersion","forkedProjectPrivacy","forkedProjectId","forkedProjectOrgId","projectName","userHandle","displayName","tier","free","canRestrictVals","profileImageUrl","adoptOrgId",{"_32":71,"_13":14,"_36":201,"_73":-5,"_74":24,"_75":76,"_77":76,"_78":79,"_80":-5,"_30":67,"_81":82,"_83":84,"_85":-5,"_86":-5,"_87":26,"_40":41,"_88":-5,"_89":-5,"_90":-5,"_91":-5,"_92":93,"_94":93,"_95":96,"_97":96,"_98":96,"_99":93,"_100":93,"_52":202,"_102":203,"_104":204,"_106":24},"tree",[163,166,167],"files",[163,164,165,166,167],"counts",{"_152":26,"_153":154,"_155":26,"_156":157,"_158":159},"contents",[],{"_32":142,"_13":64,"_62":63,"_42":143,"_34":35,"_144":39,"_145":84,"_36":146,"_38":26,"_65":21,"_147":148,"_66":24,"_149":-5,"_17":150},"upstreamProject","upstreamBranch","emptyEnvVars","flags",[],"hasHttpFiles","grants","orgs","customDomains",{},"f687ce72-3dc4-11f1-b93b-42b51c65c3df","deff41f1-6a11-4cbe-a353-05894f42a7c1","branchVersion","latest",["D",1776805158229],"content","\n\n\n \n \n 中文对话生成器 — Chinese Conversation Generator\n \n \n \n \n\n\n

\n \n\n\n","label",[151,64],"frontend","pulls","branches",1,"forks","envVars",{"_160":26,"_162":26},"connections",{"_160":26,"_161":26},"count","unfilledCount","emptyCount",{"_32":196,"_13":151,"_62":143,"_42":-5,"_34":35,"_144":39,"_145":84,"_36":197,"_38":26,"_65":198,"_147":-5,"_66":24,"_149":-5,"_174":199,"_17":200},{"_32":142,"_13":64,"_62":63,"_42":143,"_34":35,"_144":39,"_145":84,"_36":193,"_38":26,"_65":21,"_147":148,"_66":24,"_149":-5,"_174":194,"_17":195},{"_32":184,"_13":185,"_62":186,"_42":143,"_34":35,"_144":187,"_145":84,"_36":188,"_38":154,"_65":189,"_147":190,"_66":24,"_149":-5,"_174":191,"_17":192},{"_32":177,"_13":178,"_62":179,"_42":-5,"_34":35,"_144":107,"_145":84,"_36":180,"_38":26,"_65":21,"_147":181,"_66":24,"_149":-5,"_174":182,"_17":183},{"_32":168,"_13":169,"_62":82,"_42":-5,"_34":35,"_144":170,"_145":84,"_36":171,"_38":39,"_65":172,"_147":173,"_66":24,"_149":-5,"_174":175,"_17":176},"a50c0026-3dc5-11f1-9c55-42b51c65c3df","main.tsx",6,["D",1776805451189],"http","import { Hono } from \"npm:hono@4\";\nimport { serveFile, parseVal } from \"https://esm.town/v/std/utils/index.ts\";\n\nconst app = new Hono();\n\napp.onError((err) => Promise.reject(err));\n\napp.get(\"/\", (c) => serveFile(\"/frontend/index.html\", import.meta.url));\napp.get(\"/frontend/*\", (c) => serveFile(c.req.path, import.meta.url));\napp.get(\"/source\", (c) => c.redirect(parseVal().links.self.val));\n\napp.post(\"/api/generate\", async (c) => {\n const { OpenAI } = await import(\"https://esm.town/v/std/openai\");\n const openai = new OpenAI();\n\n const { words } = await c.req.json();\n\n if (!words || !Array.isArray(words) || words.length === 0) {\n return c.json({ error: \"Please provide at least one vocab word.\" }, 400);\n }\n\n const wordList = words.join(\", \");\n\n const prompt = `You are a Chinese language teaching assistant. Create a natural, engaging 5-minute conversation script between two people (小明 Xiǎo Míng and 小红 Xiǎo Hóng) that incorporates ALL of the following Chinese vocabulary words: ${wordList}\n\nRequirements:\n- The conversation should feel natural and have a coherent storyline/topic\n- Each vocab word must appear at least once, highlighted in the dialogue\n- Format each line as: **Speaker:** Chinese text (pinyin) — English translation\n- The conversation should be approximately 30-40 exchanges (to fill ~5 minutes when read aloud)\n- Start with a brief scene description\n- Use a mix of simple and intermediate grammar\n- Bold the target vocab words in the Chinese text using **bold** markdown\n- At the end, provide a \"Vocab Review\" section listing each word with pinyin and definition\n\nMake the conversation interesting, maybe involving a real-life scenario like shopping, traveling, ordering food, visiting a friend, etc. Choose the most natural scenario for the given words.`;\n\n try {\n const completion = await openai.chat.completions.create({\n messages: [\n { role: \"system\", content: \"You are a helpful Chinese language tutor who creates engaging conversation scripts for learners.\" },\n { role: \"user\", content: prompt },\n ],\n model: \"gpt-4o-mini\",\n temperature: 0.8,\n max_tokens: 4000,\n });\n\n const script = completion.choices[0].message.content;\n return c.json({ script });\n } catch (err: any) {\n return c.json({ error: \"Failed to generate conversation: \" + (err.message || String(err)) }, 500);\n }\n});\n\nexport default app.fetch;\n","children",[],[169],"bf024b70-3dc5-11f1-92d8-42b51c65c3df","README.md","bf024c42-3dc5-11f1-92d8-42b51c65c3df",["D",1776805494756],"# 🇨🇳 Chinese Vocab Conversation Generator\n\nEnter a list of Chinese vocabulary words and get a **5-minute, 2-person conversation script** that naturally incorporates all of them.\n\n## How it works\n\n1. Type or paste your Chinese vocab words (comma or newline separated)\n2. Click **Generate** — AI creates a dialogue between 小明 and 小红\n3. Each line includes: Chinese → Pinyin → English translation\n4. Target vocab words are highlighted in the script\n5. A vocab review section is included at the end\n\n## Tech Stack\n\n- **Frontend:** React + Twind (Tailwind)\n- **Backend:** Hono on Val Town\n- **AI:** Val Town's built-in OpenAI (gpt-4o-mini) — no API key needed\n\n```mermaid\ngraph LR\n A[User enters vocab words] --> B[POST /api/generate]\n B --> C[Val Town std/openai]\n C --> D[GPT-4o-mini]\n D --> E[Conversation script]\n E --> F[Rendered with react-markdown]\n```\n",[],[178],"a0842e2a-3dc5-11f1-8939-42b51c65c3df","index.tsx","04804b44-3dc5-11f1-aafa-42b51c65c3df",5,["D",1776805443587],"script","/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useState, useCallback } from \"https://esm.sh/react@18.2.0\";\nimport { createRoot } from \"https://esm.sh/react-dom@18.2.0/client\";\nimport ReactMarkdown from \"https://esm.sh/react-markdown@9.0.1?deps=react@18.2.0,react-dom@18.2.0\";\nimport remarkGfm from \"https://esm.sh/remark-gfm@4.0.0\";\n\nfunction App() {\n const [words, setWords] = useState(\"\");\n const [script, setScript] = useState(\"\");\n const [loading, setLoading] = useState(false);\n const [error, setError] = useState(\"\");\n\n const handleGenerate = useCallback(async () => {\n if (!words.trim()) {\n setError(\"Please enter at least one vocab word.\");\n return;\n }\n\n setLoading(true);\n setError(\"\");\n setScript(\"\");\n\n const wordList = words\n .split(/[,，\\n]+/)\n .map((w) => w.trim())\n .filter(Boolean);\n\n try {\n const res = await fetch(\"/api/generate\", {\n method: \"POST\",\n headers: { \"Content-Type\": \"application/json\" },\n body: JSON.stringify({ words: wordList }),\n });\n const data = await res.json();\n if (data.error) {\n setError(data.error);\n } else {\n setScript(data.script);\n }\n } catch (err) {\n setError(\"Network error. Please try again.\");\n } finally {\n setLoading(false);\n }\n }, [words]);\n\n const exampleWords = \"超市, 打折, 新鲜, 付款, 购物袋\";\n\n return (\n

\n {/* Header */}\n

🇨🇳 中文对话生成器

Chinese Conversation Script Generator

\n Enter vocab words → Get a 5-minute 2-person conversation script\n

\n\n {/* Vocab Input */}\n

\n \n 📝 Vocab Words (comma or newline separated)\n \n setWords(e.target.value)}\n placeholder={`e.g.\\n${exampleWords}`}\n rows={4}\n className=\"w-full px-4 py-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-red-400 focus:border-transparent outline-none text-lg\"\n />\n setWords(exampleWords)}\n className=\"mt-2 text-xs text-red-600 hover:text-red-800 underline\"\n >\n Try example: {exampleWords}\n \n

\n\n {/* Generate Button */}\n \n {loading ? (\n \n \n Generating conversation...\n \n ) : (\n \"🎭 Generate Conversation Script\"\n )}\n \n\n {/* Error */}\n {error && (\n

\n ⚠️ {error}\n

\n )}\n\n {/* Result */}\n {script && (\n

🎬 Conversation Script

\n navigator.clipboard.writeText(script)}\n className=\"text-sm px-3 py-1.5 bg-gray-100 rounded-lg hover:bg-gray-200 transition\"\n >\n 📋 Copy\n \n

\n {script}\n

\n )}\n\n {/* Footer */}\n

\n View Source\n {\" · \"}\n Built on Val Town\n

\n );\n}\n\nconst root = createRoot(document.getElementById(\"root\")!);\nroot.render();\n",[],[151,185],["D",1776805158229],[],[151,64],"f687f366-3dc4-11f1-b93b-42b51c65c3df",["D",1776805158229],"directory",[164,165],[151],["D",1776805134710],{"_11":12,"_120":69},{"_11":12,"_116":-5,"_68":69,"_30":67,"_117":118,"_119":24},{"_38":107,"_13":16,"_32":35,"_108":71,"_109":-5,"_110":-5,"_111":-5,"_112":-5,"_113":-5,"_114":14,"_115":12},"ctx",{"_52":-5,"_139":238,"_239":240,"_241":242,"_243":24,"_244":24,"_245":24,"_246":84,"_247":-5,"_248":-7,"_249":-7,"_250":26,"_251":24,"_252":24,"_253":-5,"_254":24,"_255":24,"_256":24,"_257":-5},"ENV",{"_209":210,"_211":212,"_213":16,"_214":215,"_216":217,"_218":219,"_220":221,"_222":223,"_224":225,"_226":227,"_228":229,"_230":231,"_232":233,"_234":235,"_236":237},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","RENDER_GIT_COMMIT","e8c4b7030cb7600e4eb0736b15f422c8b8bd130f","RENDER_GIT_BRANCH","POSTHOG_API_TOKEN","phc_nmoyuAkStEZuUp69rYlg1DZgrIt19Gx0Y4Hwf8tGgJP","POSTHOG_API_HOST","https://wart.val.town","WEB_API_TEMPLATE","https://{val}.web.val.run","APP_URL","https://www.val.town","MODULE_URL","https://esm.town","VANITY_WEB_API_TEMPLATE","https://{label}.val.run/","DENOLS_URL","https://lsp.val.town","NODE_ENV","production","CLOUDFLARE_TURNSTILE_SITE_KEY","0x4AAAAAACtaIZJH7s9rBMZ6","GOOGLE_CLIENT_ID","875989696899-jtsqkhlbdv5jrlsk8631p7ipjg3c6o62.apps.googleusercontent.com","STRIPE_PUBLISHABLE_KEY","pk_live_51N2zvWEpZTTLipIkVEwXrUG9AT0yeOOEYxszarZT1jpsZV58Ly6wlg3SltZpHN26CUalOBmUSY7adQRQiSkCZz2500qSXNkf8Y","API_URL","https://api.val.town",[],"preferencesKeybindings","default","preferencesTheme","light","preferencesFixers","preferencesCopilot","preferencesSelectionAi","preferencesCloseBrackets","preferencesChatPanelState","preferencesDprint","preferencesDenofmt","notificationCount","flagDenols","isBusinessOrgMember","businessOrgHandle","isBusinessOrgAdmin","isHigherTownieTier","navCollapsed","currentOrgId"]

History · index.html