diff --git a/script.js b/script.js index c7c6805..048fcff 100644 --- a/script.js +++ b/script.js @@ -6,15 +6,15 @@ * */ - // select elements & assign them to variables - let newTask = document.querySelector('#new-task'); - let form = document.querySelector('form'); - let todoUl = document.querySelector('#items'); - let completeUl = document.querySelector('.complete-list ul'); +// select elements & assign them to variables +let newTask = document.querySelector('#new-task'); +let form = document.querySelector('form'); +let todoUl = document.querySelector('#items'); +let completeUl = document.querySelector('.complete-list ul'); // functions -let createTask = function(task) { +let createTask = function (task) { let listItem = document.createElement('li'); let checkBox = document.createElement('input'); let label = document.createElement('label'); @@ -28,16 +28,22 @@ let createTask = function(task) { return listItem; } -let addTask = function(event) { +let addTask = function (event) { event.preventDefault(); - let listItem = createTask(newTask.value); - todoUl.appendChild(listItem); - newTask.value = ""; - // bind the new list item to the incomplete list - bindInCompleteItems(listItem, completeTask); + + if (newTask.value.trim() !== "") { + let listItem = createTask(newTask.value); + todoUl.appendChild(listItem); + newTask.value = ""; + // bind the new list item to the incomplete list + bindInCompleteItems(listItem, completeTask); + } else { + window.alert("Please write a valid task!"); + } + } -let completeTask = function() { +let completeTask = function () { let listItem = this.parentNode; let deleteBtn = document.createElement('button'); deleteBtn.innerText = 'Delete'; @@ -50,27 +56,27 @@ let completeTask = function() { bindCompleteItems(listItem, deleteTask); } -let deleteTask = function() { +let deleteTask = function () { let listItem = this.parentNode; let ul = listItem.parentNode; ul.removeChild(listItem); } -let bindInCompleteItems = function(taskItem, checkboxClick) { +let bindInCompleteItems = function (taskItem, checkboxClick) { let checkBox = taskItem.querySelector('input[type="checkbox"]'); checkBox.onchange = checkboxClick; } -let bindCompleteItems = function(taskItem, deleteButtonClick) { +let bindCompleteItems = function (taskItem, deleteButtonClick) { let deleteButton = taskItem.querySelector('.delete'); deleteButton.onclick = deleteButtonClick; } -for(let i=0; i< todoUl.children.length; i++ ) { +for (let i = 0; i < todoUl.children.length; i++) { bindInCompleteItems(todoUl.children[i], completeTask); } -for(let i=0; i< completeUl.children.length; i++ ) { +for (let i = 0; i < completeUl.children.length; i++) { bindCompleteItems(completeUl.children[i], deleteTask); }