Todo App

My Tasks

Total: 0 tasks Completed: 0

======= // Update stats function updateStats() { const total = tasks.length; const completed = tasks.filter(task => task.completed).length; totalTasksSpan.textContent = `Total: ${total} ${total === 1 ? 'task' : 'tasks'}`; completedTasksSpan.textContent = `Completed: ${completed}`; } // Save tasks to localStorage function saveTasks() { localStorage.setItem('tasks', JSON.stringify(tasks)); } // Load tasks from localStorage function loadTasks() { const storedTasks = localStorage.getItem('tasks'); if (storedTasks) { tasks = JSON.parse(storedTasks); } } // Add task taskForm.addEventListener('submit', function(e) { e.preventDefault(); const text = taskInput.value.trim(); if (text) { tasks.push({ text: text, completed: false, createdAt: new Date().toISOString() }); taskInput.value = ''; renderTasks(); } }); // Toggle task completion taskList.addEventListener('change', function(e) { if (e.target.type === 'checkbox') { const index = parseInt(e.target.dataset.index); tasks[index].completed = e.target.checked; renderTasks(); } }); // Delete task taskList.addEventListener('click', function(e) { if (e.target.closest('.delete-btn')) { const index = parseInt(e.target.closest('.delete-btn').dataset.index); tasks.splice(index, 1); renderTasks(); } }); // Initialize the app loadTasks(); renderTasks(); }); taskForm.addEventListener('submit', function(e) { e.preventDefault(); const text = taskInput.value.trim(); if (text) { tasks.push({ text: text, completed: false, createdAt: new Date() }); taskInput.value = ''; renderTasks(); } }); // Toggle task completion taskList.addEventListener('change', function(e) { if (e.target.type === 'checkbox') { const index = e.target.dataset.index; tasks[index].completed = e.target.checked; renderTasks(); } }); // Delete task taskList.addEventListener('click', function(e) { if (e.target.closest('.delete-btn')) { const index = e.target.closest('.delete-btn').dataset.index; tasks.splice(index, 1); renderTasks(); } }); // Initial render renderTasks(); });