Daily Math Challenge

\n {loading ?

: problem\n ? (\n

\n \n

Answer format examples:

\n Functions: sin(x), cos(x), tan(x)\n
\n Inverse functions: arcsin(x) or sin^{-1}(x)\n
\n Fractions: \\frac{1}{2} or 1/2\n
\n Constants: don't forget +C for indefinite integrals\n
\n Powers: x^2, e^x\n

\n )\n :

Failed to load problem. Please refresh the page.

}\n

\n );\n}\n\nfunction normalizeAnswer(answer) {\n // Remove all spaces and convert to lowercase\n answer = answer.replace(/\\s+/g, \"\").toLowerCase();\n\n // Standardize trig function notations\n answer = answer.replace(/arcsin/g, \"sin^{-1}\");\n answer = answer.replace(/arccos/g, \"cos^{-1}\");\n answer = answer.replace(/arctan/g, \"tan^{-1}\");\n\n // Standardize inverse trig notations\n answer = answer.replace(/sin\\^-1/g, \"sin^{-1}\");\n answer = answer.replace(/cos\\^-1/g, \"cos^{-1}\");\n answer = answer.replace(/tan\\^-1/g, \"tan^{-1}\");\n\n // Standardize fractions\n answer = answer.replace(/\\\\frac{(\\d+)}{(\\d+)}/g, \"$1/$2\");\n\n // Remove LaTeX delimiters and unnecessary braces\n answer = answer.replace(/[\\${}]/g, \"\");\n\n // Standardize the constant of integration\n answer = answer.replace(/[+-]\\s*c\\s*$/, \"+c\");\n\n // Standardize common mathematical constants\n answer = answer.replace(/\\\\pi/g, \"pi\");\n answer = answer.replace(/\\\\infty/g, \"infinity\");\n\n return answer;\n}\n\nfunction client() {\n createRoot(document.getElementById(\"root\")).render();\n}\n\nif (typeof document !== \"undefined\") {\n client();\n}\n\nexport default async function server(request) {\n const { OpenAI } = await import(\"https://esm.town/v/std/openai\");\n const { blob } = await import(\"https://esm.town/v/std/blob\");\n const url = new URL(request.url);\n\n if (url.pathname === \"/problem\") {\n const openai = new OpenAI();\n const completion = await openai.chat.completions.create({\n model: \"gpt-4\",\n messages: [\n {\n role: \"system\",\n content:\n \"You are a math teacher creating challenging problems for high school calculus and above. Use LaTeX notation for mathematical equations, enclosed in double dollar signs ($$) for display equations and single dollar signs ($) for inline equations. For answers, use proper LaTeX notation and include +C for indefinite integrals.\",\n },\n {\n role: \"user\",\n content:\n \"Generate a challenging math problem with its solution and a brief explanation of the underlying concept. Use LaTeX notation for equations.\",\n },\n ],\n functions: [\n {\n name: \"generate_math_problem\",\n description: \"Generate a math problem with question, answer, and concept explanation\",\n parameters: {\n type: \"object\",\n properties: {\n question: {\n type: \"string\",\n description: \"The math problem question with LaTeX equations\",\n },\n answer: {\n type: \"string\",\n description: \"The correct answer to the math problem with LaTeX equations\",\n },\n concept: {\n type: \"string\",\n description: \"A brief explanation of the underlying mathematical concept with LaTeX equations\",\n },\n },\n required: [\"question\", \"answer\", \"concept\"],\n },\n },\n ],\n function_call: { name: \"generate_math_problem\" },\n });\n\n const functionCall = completion.choices[0].message.function_call;\n if (!functionCall || functionCall.name !== \"generate_math_problem\") {\n return new Response(\"Failed to generate problem\", { status: 500 });\n }\n\n let problem;\n try {\n problem = JSON.parse(functionCall.arguments);\n } catch (error) {\n console.error(\"Failed to parse function call arguments:\", error);\n console.log(\"Raw arguments:\", functionCall.arguments);\n return new Response(\"Failed to generate problem\", { status: 500 });\n }\n\n const problemId = Date.now().toString();\n await blob.setJSON(`problem_${problemId}`, problem);\n\n return new Response(\n JSON.stringify({ id: problemId, question: problem.question }),\n { headers: { \"Content-Type\": \"application/json\" } },\n );\n }\n\n if (url.pathname === \"/check\" && request.method === \"POST\") {\n const { answer, problemId } = await request.json();\n const problem = await blob.getJSON(`problem_${problemId}`);\n\n const normalizedUserAnswer = normalizeAnswer(answer);\n const normalizedCorrectAnswer = normalizeAnswer(problem.answer);\n\n console.log(\"User answer (normalized):\", normalizedUserAnswer);\n console.log(\"Correct answer (normalized):\", normalizedCorrectAnswer);\n\n const isCorrect = normalizedUserAnswer === normalizedCorrectAnswer;\n\n return new Response(\n JSON.stringify({\n correct: isCorrect,\n concept: problem.concept,\n correctAnswer: problem.answer,\n }),\n { headers: { \"Content-Type\": \"application/json\" } },\n );\n }\n\n return new Response(\n `\n \n \n Daily Math Challenge\n \n \n \n \n

\n \n \n \n \n `,\n { headers: { \"Content-Type\": \"text/html\" } },\n );\n}\n\nconst css = `\nbody {\n font-family: Arial, sans-serif;\n line-height: 1.6;\n margin: 0;\n padding: 0;\n background-color: #f4f4f4;\n}\n\n.container {\n width: 80%;\n margin: auto;\n overflow: hidden;\n padding: 20px;\n background-color: white;\n border-radius: 5px;\n box-shadow: 0 0 10px rgba(0,0,0,0.1);\n}\n\nh1 {\n color: #333;\n text-align: center;\n margin-bottom: 2rem;\n}\n\n.problem {\n margin: 2rem 0;\n text-align: center;\n}\n\n.hints {\n background-color: #f8f9fa;\n border-left: 4px solid #6c757d;\n padding: 1rem;\n margin: 1rem 0;\n font-size: 0.9rem;\n}\n\n.hints code {\n background-color: #e9ecef;\n padding: 0.2rem 0.4rem;\n border-radius: 3px;\n font-family: monospace;\n}\n\n.hints ul {\n margin: 0.5rem 0;\n padding-left: 1.5rem;\n}\n\n.input-field {\n width: 100%;\n padding: 10px;\n margin-bottom: 10px;\n border: 2px solid #ddd;\n border-radius: 4px;\n font-size: 1rem;\n font-family: monospace;\n}\n\n.input-field:focus {\n border-color: #2196F3;\n outline: none;\n}\n\nbutton {\n display: inline-block;\n background: #2196F3;\n color: #fff;\n padding: 10px 20px;\n border: none;\n border-radius: 4px;\n cursor: pointer;\n font-size: 1rem;\n transition: background-color 0.3s ease;\n}\n\nbutton:hover {\n background: #1976D2;\n}\n\nbutton:disabled {\n background: #ccc;\n cursor: not-allowed;\n}\n\n.feedback {\n margin-top: 20px;\n padding: 15px;\n background-color: #e7f3fe;\n border-left: 6px solid #2196F3;\n}\n\n.next-button {\n margin-top: 20px;\n width: 100%;\n}\n\n.katex {\n font-size: 1.1em;\n}\n\n.katex-display {\n margin: 1.5rem 0;\n overflow-x: auto;\n overflow-y: hidden;\n}\n`;","deleted","label",[99],"permalink","https://www.val.town/x/charmaine/mathOfTheDay/code/accomplishedOrangePenguin","extension","actionData","errors"]