diff --git a/src/.DS_Store b/src/.DS_Store index da24fbd..69aa8dd 100644 Binary files a/src/.DS_Store and b/src/.DS_Store differ diff --git a/src/index.ts b/src/index.ts index ef72098..33af214 100644 --- a/src/index.ts +++ b/src/index.ts @@ -28,7 +28,7 @@ form?.addEventListener("submit", (e) => { tasks.push(newTask); //하나아이템 type then push, then it's uploaded(stored). <-wrote it after line 13 addListItem(newTask); - input.value = ""; //clear the input type part, as you already made one to do item + input.value = ""; //clear the input type part, as you already made one to-do-item }); function addListItem(task: Task) { @@ -62,11 +62,12 @@ function addListItem(task: Task) { }); editbtn.addEventListener("click", function () { label?.focus(); - changeTask(item); + changeTask(item); //joseph 24th Oct 2022 }); } function saveTasks() { + const taskJSON = localStorage.getItem("TASKS") || "[]"; //hmm... 24 Oct localStorage.setItem("TASKS", JSON.stringify(tasks)); } @@ -76,19 +77,31 @@ function loadTasks(): Task[] { return JSON.parse(taskJSON); // if it's not null, return to the taskJSON. As : Task[] is written after func loadTasks(), it will specifically parse the array. Without it, it will parse anything } -function changeTask(item) { - var changer = document.createElement("input"); - changer.className = "changer"; - var text = item.firstChild.innerHTML; - changer.value = text.replace('',""); - item.append(changer); - var button = document.createElement("button"); - button.innerHTML = "X" - item.append(button); - button.addEventListener("click", function (){ - item.firstChild.innerHTML = ''+ changer.value; - changer.remove(); - button.remove(); - - }); +function changeTask(item: any) { + var changer = document.createElement("input"); //joseph created another input field next to the item (,which is clicked and to be modified.) + //I wanted to directly modify the item in the listed label, without making anothe input next to it. + changer.className = "changer"; + var writtenLabel = item.firstChild.innerHTML; + changer.value = writtenLabel.replace('', ""); + item.append(changer); + var button = document.createElement("button"); + button.innerHTML = "modify"; + item.append(button); + button.addEventListener("click", function () { + item.firstChild.innerHTML = '' + changer.value; + changer.remove(); + button.remove(); + }); //joseph 24th Oct 2022 + console.log(item.firstChild); + console.log(item); } + +// function deleteTask(item: any) { +// const deletebtn = document.createElement("button"); +// deletebtn.classList.add("deletebtn"); + +// item.append(deletebtn); +// deletebtn.addEventListener("click", function () { +// item.parentNode?.removeChild(item); +// }); +//} Wanting to refactor, I attempted to separate the deleteTask function here but failed. 24 Oct