\n {`${minutos}:${segundos.toString().padStart(2, \"0\")}`}\n \n

\n );\n};\n\nconst TecladoNumerico = ({ alHacerClicEnNumero, alEnviar, alLimpiar }) => {\n return (\n

\n {[1, 2, 3, 4, 5, 6, 7, 8, 9].map((num) => (\n alHacerClicEnNumero(num)}\n className=\"bg-gray-300 hover:bg-gray-400 rounded p-2 text-xl\"\n >\n {num}\n \n ))}\n \n \n \n

\n );\n};\n\nfunction App() {\n const [tareasCompletadas, setTareasCompletadas] = useState([]);\n const [estadosTemporizador, setEstadosTemporizador] = useState(tareasRutinarias.map(tarea => ({\n estaEnMarcha: false,\n estaCompleta: false,\n })));\n const [contrasenapadre, setContrasenaPadre] = useState(\"\");\n const [mostrarPromptContrasena, setMostrarPromptContrasena] = useState(false);\n const [indiceTareaActual, setIndiceTareaActual] = useState(null);\n const [errorContrasena, setErrorContrasena] = useState(false);\n\n const lanzarConfeti = () => {\n const cantidad = 500;\n const configuracionPredeterminada = {\n origin: { y: 0.7 },\n shapes: [\"star\"],\n ticks: 300,\n };\n\n function disparar(proporcionParticulas, opciones) {\n confetti({\n ...configuracionPredeterminada,\n ...opciones,\n particleCount: Math.floor(cantidad * proporcionParticulas),\n });\n }\n\n disparar(0.25, {\n spread: 26,\n startVelocity: 55,\n });\n\n disparar(0.2, {\n spread: 60,\n });\n\n disparar(0.35, {\n spread: 100,\n decay: 0.91,\n scalar: 0.8,\n });\n\n disparar(0.1, {\n spread: 120,\n startVelocity: 25,\n decay: 0.92,\n scalar: 1.2,\n });\n\n disparar(0.1, {\n spread: 120,\n startVelocity: 45,\n });\n };\n\n useEffect(() => {\n if (tareasCompletadas.length === tareasRutinarias.length) {\n lanzarConfeti();\n }\n }, [tareasCompletadas]);\n\n const alternarTarea = (indice) => {\n const tarea = tareasRutinarias[indice];\n const estadoTemporizador = estadosTemporizador[indice];\n\n if (tarea.cronometrado && !estadoTemporizador.estaCompleta) {\n setIndiceTareaActual(indice);\n setMostrarPromptContrasena(true);\n return;\n }\n\n if (tarea.requierePadre) {\n setIndiceTareaActual(indice);\n setMostrarPromptContrasena(true);\n return;\n }\n\n setTareasCompletadas(prev =>\n prev.includes(indice)\n ? prev.filter(indiceTarea => indiceTarea !== indice)\n : [...prev, indice]\n );\n };\n\n const manejarClicEnNumero = (numero) => {\n setContrasenaPadre(prev => prev + numero.toString());\n };\n\n const manejarEnvioContrasena = () => {\n if (hashSimple(contrasenapadre) === HASH_CONTRASENA_PADRE) {\n const tarea = tareasRutinarias[indiceTareaActual];\n if (tarea.cronometrado) {\n setEstadosTemporizador(prev => {\n const nuevosEstados = [...prev];\n nuevosEstados[indiceTareaActual].estaCompleta = true;\n nuevosEstados[indiceTareaActual].estaEnMarcha = false;\n return nuevosEstados;\n });\n }\n setTareasCompletadas(prev =>\n prev.includes(indiceTareaActual)\n ? prev.filter(indiceTarea => indiceTarea !== indiceTareaActual)\n : [...prev, indiceTareaActual]\n );\n cerrarPromptContrasena();\n } else {\n setErrorContrasena(true);\n }\n };\n\n const manejarLimpiarContrasena = () => {\n setContrasenaPadre(\"\");\n };\n\n const cerrarPromptContrasena = () => {\n setMostrarPromptContrasena(false);\n setContrasenaPadre(\"\");\n setErrorContrasena(false);\n setIndiceTareaActual(null);\n };\n\n const alCompletarTemporizador = (indice) => {\n setEstadosTemporizador(prev => {\n const nuevosEstados = [...prev];\n nuevosEstados[indice].estaCompleta = true;\n nuevosEstados[indice].estaEnMarcha = false;\n return nuevosEstados;\n });\n };\n\n const alternarTemporizador = (indice) => {\n setEstadosTemporizador(prev => {\n const nuevosEstados = [...prev];\n nuevosEstados[indice].estaEnMarcha = !nuevosEstados[indice].estaEnMarcha;\n return nuevosEstados;\n });\n };\n\n const reiniciarTareas = () => {\n setTareasCompletadas([]);\n setEstadosTemporizador(tareasRutinarias.map(tarea => ({\n estaEnMarcha: false,\n estaCompleta: false,\n })));\n };\n\n return (\n

Kaya's After School Routine

\n alternarTarea(indice)}\n >\n {tareasCompletadas.includes(indice)\n ? ✅\n : (tarea.requierePadre || (tarea.cronometrado && !estadosTemporizador[indice].estaCompleta))\n ? 🔒\n : (\n \n ⚪\n \n )}\n \n {taskIcons[tarea.nombre]}\n \n

\n {tarea.cronometrado && (\n alCompletarTemporizador(indice)}\n estaEnMarcha={estadosTemporizador[indice].estaEnMarcha}\n alternarTemporizador={() => alternarTemporizador(indice)}\n />\n )}\n \n ))}\n \n \n 🔄\n \n\n {mostrarPromptContrasena && (\n \n

e.stopPropagation()}>\n \n ✕\n \n

👨‍👩‍👧 Parent Verification Required

\n {contrasenapadre.replace(/./g, \"•\") || \"\\u00A0\"}\n

\n \n {errorContrasena && (\n

\n ❌ Incorrect password. Please try again.\n

\n )}\n

\n \n )}\n \n View source code\n \n \n );\n}\n\nfunction client() {\n createRoot(document.getElementById(\"root\")).render();\n}\nif (typeof document !== \"undefined\") { client(); }\n\nasync function server(request: Request): Promise {\n return new Response(\n `\n \n \n Kaya's After School Routine\n \n \n \n \n \n

\n \n \n \n \n `,\n {\n headers: {\n \"content-type\": \"text/html\",\n },\n },\n );\n}\n\nconst css = `\n body {\n font-family: system-ui, sans-serif;\n background-color: #f0f0f0;\n }\n`;\n\nexport default server;","label",[65],"55f107bc-2759-11f0-86ff-569c3dd06744",["D",1728747832359],"# Routine Tracker\n\nThis is a little React component to make our 7yo's after school routine self-serve so she can be a bit more independent after school.\n\nTo change the items in the list, modify the `routineTasks` array of objects:\n\n```javascript\n[\n {name: \"item\", timed: false},\n {name: \"item 2\", timed: true, duration: 2 * 60 }\n {name: \"item 3\", timed: false, requiresParent: true}\n]\n```\n\nYou can set the parent password on this line:\n\n```javascript\nconst PARENT_PASSWORD_HASH = simpleHash(\"1234\");\n```\n\n# Todos\n\n- Make the parent password modal touch friendly\n- Track dates/times of list completions\n- Show a tracker of how many completions this week",[76],"pulls","branches","forks","envVars",{"_72":20,"_195":20},"connections",{"_72":20,"_194":20},"unfilledCount","emptyCount",{"_29":183,"_13":76,"_63":75,"_39":-5,"_31":32,"_176":36,"_177":94,"_33":202,"_35":20,"_66":49,"_179":185,"_68":24,"_181":-5,"_199":203,"_140":204},{"_29":175,"_13":65,"_63":64,"_39":-5,"_31":32,"_176":85,"_177":94,"_33":198,"_35":73,"_66":67,"_179":180,"_68":24,"_181":-5,"_199":200,"_140":201},["D",1728748110475],"children",[],[65],["D",1728747832359],[],[76],["D",1746192509564],{"_11":12,"_139":71},{"_11":12,"_135":-5,"_70":71,"_25":69,"_136":137,"_138":24},{"_35":85,"_13":16,"_29":32,"_124":90,"_125":126,"_127":20,"_128":96,"_129":130,"_131":132,"_133":14,"_134":12},"ctx",{"_47":-5,"_161":242,"_243":244,"_245":246,"_247":24,"_248":24,"_249":24,"_250":94,"_251":-5,"_252":-7,"_253":-7,"_254":20,"_255":24,"_256":24,"_257":-5,"_258":24,"_259":24,"_260":24,"_261":-5},"ENV",{"_213":214,"_215":216,"_217":16,"_218":219,"_220":221,"_222":223,"_224":225,"_226":227,"_228":229,"_230":231,"_232":233,"_234":235,"_236":237,"_238":239,"_240":241},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","RENDER_GIT_COMMIT","e87eb04e707cf64e7e532c8e8ec395f209e17f15","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