diff --git a/Sprint-3/todo-list/index.html b/Sprint-3/todo-list/index.html index 4d12c4654..1033fb83f 100644 --- a/Sprint-3/todo-list/index.html +++ b/Sprint-3/todo-list/index.html @@ -15,6 +15,7 @@

My ToDo List

+
@@ -28,6 +29,7 @@

My ToDo List

+ + diff --git a/Sprint-3/todo-list/package.json b/Sprint-3/todo-list/package.json index ce181158a..15eef950e 100644 --- a/Sprint-3/todo-list/package.json +++ b/Sprint-3/todo-list/package.json @@ -6,7 +6,7 @@ "type": "module", "scripts": { "serve": "http-server", - "test": "NODE_OPTIONS=--experimental-vm-modules jest" + "test": "set NODE_OPTIONS=--experimental-vm-modules && jest" }, "repository": { "type": "git", diff --git a/Sprint-3/todo-list/script.mjs b/Sprint-3/todo-list/script.mjs index ba0b2ceae..b576286d3 100644 --- a/Sprint-3/todo-list/script.mjs +++ b/Sprint-3/todo-list/script.mjs @@ -20,13 +20,17 @@ window.addEventListener("load", () => { // append a new task to the todo list. function addNewTodo() { const taskInput = document.getElementById("new-task-input"); + const deadlineInput = document.getElementById("deadline-input"); + const task = taskInput.value.trim(); + const deadline = deadlineInput.value || null; if (task) { - Todos.addTask(todos, task, false); + Todos.addTask(todos, task, false, deadline); render(); } taskInput.value = ""; + deadlineInput.value = ""; } // Note: @@ -62,6 +66,16 @@ function createListItem(todo, index) { li.classList.add("completed"); } + const deadlineEl = li.querySelector(".deadline"); + + if (todo.deadline) { + const date = new Date(todo.deadline); + const formattedDate = date.toLocaleDateString(undefined, { year: 'numeric', month: 'short', day: 'numeric' }); + deadlineEl.textContent = ` (Due: ${formattedDate})`; + } else { + deadlineEl.textContent = ""; + } + li.querySelector('.complete-btn').addEventListener("click", () => { Todos.toggleCompletedOnTask(todos, index); render(); @@ -73,4 +87,10 @@ function createListItem(todo, index) { }); return li; -} \ No newline at end of file +} + +// "Delete Completed Tasks" button +document.querySelector(".delete-completed-btn").addEventListener("click", () => { + Todos.deleteCompletedTasks(todos); + render(); +}); \ No newline at end of file diff --git a/Sprint-3/todo-list/todos.mjs b/Sprint-3/todo-list/todos.mjs index f17ab6a25..40c362e36 100644 --- a/Sprint-3/todo-list/todos.mjs +++ b/Sprint-3/todo-list/todos.mjs @@ -10,8 +10,8 @@ */ // Append a new task to todos[] -export function addTask(todos, task, completed = false) { - todos.push({ task, completed }); +export function addTask(todos, task, completed = false, deadline = null) { + todos.push({ task, completed, deadline }); } // Delete todos[taskIndex] if it exists @@ -26,4 +26,12 @@ export function toggleCompletedOnTask(todos, taskIndex) { if (todos[taskIndex]) { todos[taskIndex].completed = !todos[taskIndex].completed; } +} + +export function deleteCompletedTasks(todos) { + for (let i = todos.length - 1; i >= 0; i--) { + if (todos[i].completed) { + todos.splice(i, 1); + } + } } \ No newline at end of file diff --git a/Sprint-3/todo-list/todos.test.mjs b/Sprint-3/todo-list/todos.test.mjs index bae7ae491..3cc9d4579 100644 --- a/Sprint-3/todo-list/todos.test.mjs +++ b/Sprint-3/todo-list/todos.test.mjs @@ -130,3 +130,36 @@ describe("toggleCompletedOnTask()", () => { }); }); +describe("deleteCompletedTasks()", () => { + + test("Expect all completed tasks to be deleted", () => { + const todos = createMockTodos(); + Todos.deleteCompletedTasks(todos); + expect(todos).toHaveLength(2); + expect(todos[0]).toEqual({ task: "Task 2 description", completed: false }); + expect(todos[1]).toEqual({ task: "Task 4 description", completed: false }); + }); + + test("Expect no change if there are no completed tasks", () => { + const todos = [ + { task: "", completed: false }, + { task: "Task 2 description", completed: false }, + ]; + const todosBeforeDeletion = [ + { task: "Task 1 description", completed: false }, + { task: "Task 2 description", completed: false }, + ]; + Todos.deleteCompletedTasks(todos); + expect(todos).toEqual(todosBeforeDeletion); + }); + + test("Expect all tasks to be deleted if all tasks are completed", () => { + const todos = [ + { task: "Task 1 description", completed: true }, + { task: "Task 2 description", completed: true }, + ]; + Todos.deleteCompletedTasks(todos); + expect(todos).toHaveLength(0); + }); +}); +