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

\n );\n};\n\nconst NumberPad = ({ onNumberClick, onSubmit, onClear }) => {\n return (\n

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

\n );\n};\n\nfunction App() {\n const [completedTasks, setCompletedTasks] = useState([]);\n const [timerStates, setTimerStates] = useState(routineTasks.map(task => ({\n isRunning: false,\n isComplete: false,\n })));\n const [parentPassword, setParentPassword] = useState(\"\");\n const [showPasswordPrompt, setShowPasswordPrompt] = useState(false);\n const [currentTaskIndex, setCurrentTaskIndex] = useState(null);\n const [passwordError, setPasswordError] = useState(false);\n\n const shootConfetti = () => {\n const count = 500;\n const defaults = {\n origin: { y: 0.7 },\n shapes: [\"star\"],\n ticks: 300,\n };\n\n function fire(particleRatio, opts) {\n confetti({\n ...defaults,\n ...opts,\n particleCount: Math.floor(count * particleRatio),\n });\n }\n\n fire(0.25, {\n spread: 26,\n startVelocity: 55,\n });\n\n fire(0.2, {\n spread: 60,\n });\n\n fire(0.35, {\n spread: 100,\n decay: 0.91,\n scalar: 0.8,\n });\n\n fire(0.1, {\n spread: 120,\n startVelocity: 25,\n decay: 0.92,\n scalar: 1.2,\n });\n\n fire(0.1, {\n spread: 120,\n startVelocity: 45,\n });\n };\n\n useEffect(() => {\n if (completedTasks.length === routineTasks.length) {\n shootConfetti();\n }\n }, [completedTasks]);\n\n const toggleTask = (index) => {\n const task = routineTasks[index];\n const timerState = timerStates[index];\n\n if (task.timed && !timerState.isComplete) {\n setCurrentTaskIndex(index);\n setShowPasswordPrompt(true);\n return;\n }\n\n if (task.requiresParent) {\n setCurrentTaskIndex(index);\n setShowPasswordPrompt(true);\n return;\n }\n\n setCompletedTasks(prev =>\n prev.includes(index)\n ? prev.filter(taskIndex => taskIndex !== index)\n : [...prev, index]\n );\n };\n\n const handleNumberClick = (number) => {\n setParentPassword(prev => prev + number.toString());\n };\n\n const handlePasswordSubmit = () => {\n if (simpleHash(parentPassword) === PARENT_PASSWORD_HASH) {\n const task = routineTasks[currentTaskIndex];\n if (task.timed) {\n setTimerStates(prev => {\n const newStates = [...prev];\n newStates[currentTaskIndex].isComplete = true;\n newStates[currentTaskIndex].isRunning = false;\n return newStates;\n });\n }\n setCompletedTasks(prev =>\n prev.includes(currentTaskIndex)\n ? prev.filter(taskIndex => taskIndex !== currentTaskIndex)\n : [...prev, currentTaskIndex]\n );\n closePasswordPrompt();\n } else {\n setPasswordError(true);\n }\n };\n\n const handlePasswordClear = () => {\n setParentPassword(\"\");\n };\n\n const closePasswordPrompt = () => {\n setShowPasswordPrompt(false);\n setParentPassword(\"\");\n setPasswordError(false);\n setCurrentTaskIndex(null);\n };\n\n const onTimerComplete = (index) => {\n setTimerStates(prev => {\n const newStates = [...prev];\n newStates[index].isComplete = true;\n newStates[index].isRunning = false;\n return newStates;\n });\n };\n\n const toggleTimer = (index) => {\n setTimerStates(prev => {\n const newStates = [...prev];\n newStates[index].isRunning = !newStates[index].isRunning;\n return newStates;\n });\n };\n\n const resetTasks = () => {\n setCompletedTasks([]);\n setTimerStates(routineTasks.map(task => ({\n isRunning: false,\n isComplete: false,\n })));\n };\n\n return (\n

Kaya's After School Routine

\n toggleTask(index)}\n >\n {completedTasks.includes(index)\n ? ✅\n : (task.requiresParent || (task.timed && !timerStates[index].isComplete))\n ? 🔒\n : (\n \n ⚪\n \n )}\n \n {task.name}\n \n

\n {task.timed && (\n onTimerComplete(index)}\n isRunning={timerStates[index].isRunning}\n toggleTimer={() => toggleTimer(index)}\n />\n )}\n \n ))}\n \n \n Reset All Tasks\n \n\n {showPasswordPrompt && (\n \n

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

Parent Check Required

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

\n \n {passwordError && (\n

\n Incorrect password. Please try again.\n

\n )}\n

\n \n )}\n \n View Source\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;","deleted","label",[98],"permalink","https://www.val.town/x/cpdis/routineTrackerApp/code/main.tsx","extension","actionData","errors"]