[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8},"actionData","errors","root",{"_26":27,"_28":29,"_30":12,"_31":12,"_32":12,"_33":12,"_34":12,"_35":12,"_36":37},"routes/canvas.shared.$sharedTextdocId",{"_9":10,"_11":12},"sharedTextdoc",{"_13":14,"_15":-7,"_16":17,"_18":19,"_20":21,"_22":23,"_24":12,"_25":12},"isAuthenticated",false,"sharedTextdocId","69c41d9b2508819184cd73ea6f815869","versionInt","title","2nd Grade Math Game","type","code/react","content","import React, { useState } from \"react\";\nimport { Card, CardContent } from \"@/components/ui/card\";\nimport { Button } from \"@/components/ui/button\";\nimport { motion } from \"framer-motion\";\n\nfunction getQuestion(level) {\n const max = level === 1 ? 10 : level === 2 ? 20 : 50;\n const a = Math.floor(Math.random() * max);\n const b = Math.floor(Math.random() * max);\n\n const type = Math.floor(Math.random() * 3);\n\n if (type === 0) return { question: `${a} + ${b}`, answer: a + b };\n if (type === 1) return { question: `${a} - ${b}`, answer: a - b };\n\n const smallA = Math.floor(Math.random() * 10);\n const smallB = Math.floor(Math.random() * 10);\n return { question: `${smallA} × ${smallB}`, answer: smallA * smallB };\n}\n\nconst characters = [\n { name: \"Dog\", emoji: \"🐶\", unlock: 0 },\n { name: \"Cat\", emoji: \"🐱\", unlock: 5 },\n { name: \"Robot\", emoji: \"🤖\", unlock: 10 },\n { name: \"Unicorn\", emoji: \"🦄\", unlock: 20 }\n];\n\nexport default function MathGame() {\n const [score, setScore] = useState(0);\n const [streak, setStreak] = useState(0);\n const [level, setLevel] = useState(1);\n const [stars, setStars] = useState(0);\n const [current, setCurrent] = useState(getQuestion(1));\n const [input, setInput] = useState(\"\");\n const [feedback, setFeedback] = useState(\"\");\n const [characterMood, setCharacterMood] = useState(\"idle\");\n const [selectedCharacter, setSelectedCharacter] = useState(characters[0]);\n\n const messages = {\n happy: [\"You're amazing! 🎉\", \"Great job! 😄\", \"Keep going! 🔥\"],\n sad: [\"Try again! 💪\", \"You got this! 🙂\", \"Don't give up! ⭐\"]\n };\n\n const getRandomMessage = (type) => {\n const arr = messages[type];\n return arr[Math.floor(Math.random() * arr.length)];\n };\n\n const checkAnswer = () => {\n if (parseInt(input) === current.answer) {\n const newScore = score + 1;\n const newStreak = streak + 1;\n\n setScore(newScore);\n setStreak(newStreak);\n setStars(stars + 1);\n setCharacterMood(\"happy\");\n setFeedback(getRandomMessage(\"happy\"));\n\n if (newScore % 5 === 0) {\n setLevel(level + 1);\n }\n } else {\n setFeedback(getRandomMessage(\"sad\"));\n setStreak(0);\n setCharacterMood(\"sad\");\n }\n\n setTimeout(() => setCharacterMood(\"idle\"), 1500);\n setCurrent(getQuestion(level));\n setInput(\"\");\n };\n\n return (\n

\n\n {/* Character Selection */}\n

\n {characters.map((char) => (\n setSelectedCharacter(char)}\n >\n {char.emoji}\n \n ))}\n

\n\n {/* Progress Map */}\n

\n {[...Array(10)].map((_, i) => (\n \n ))}\n

\n\n \n \n

Math Adventure 🎲

\n\n {/* Character */}\n \n {selectedCharacter.emoji}\n \n\n

Level: {level}

⭐ Stars: {stars}

🔥 Streak: {streak}

\n\n

{current.question}

\n\n setInput(e.target.value)}\n placeholder=\"Your answer\"\n />\n\n \n\n {feedback && (\n \n {feedback}\n \n )}\n \n \n

\n );\n}\n","access","public","isModerationBlocked","isAnonifyApiKeyDetected","dd",{"_38":39,"_40":41},"disablePrefetch",true,"shouldPrefetchAccount","shouldPrefetchUser","shouldPrefetchSystemHints","promoteCss","disableSSR","stripModulepreloadImports","statsigGateEvaluationsPromise",["P",37],"traceId","6005192967691334862","traceTime",1783530786114]