after josephfeedback I tried to refactor and fix the storing function but havent finished

master
franklin004 2 years ago
parent aeb794cc85
commit dce48c619a

BIN
src/.DS_Store vendored

Binary file not shown.

@ -28,7 +28,7 @@ form?.addEventListener("submit", (e) => {
tasks.push(newTask); //하나아이템 type then push, then it's uploaded(stored). <-wrote it after line 13 tasks.push(newTask); //하나아이템 type then push, then it's uploaded(stored). <-wrote it after line 13
addListItem(newTask); 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) { function addListItem(task: Task) {
@ -62,11 +62,12 @@ function addListItem(task: Task) {
}); });
editbtn.addEventListener("click", function () { editbtn.addEventListener("click", function () {
label?.focus(); label?.focus();
changeTask(item); changeTask(item); //joseph 24th Oct 2022
}); });
} }
function saveTasks() { function saveTasks() {
const taskJSON = localStorage.getItem("TASKS") || "[]"; //hmm... 24 Oct
localStorage.setItem("TASKS", JSON.stringify(tasks)); 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 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) { function changeTask(item: any) {
var changer = document.createElement("input"); var changer = document.createElement("input"); //joseph created another input field next to the item (,which is clicked and to be modified.)
changer.className = "changer"; //I wanted to directly modify the item in the listed label, without making anothe input next to it.
var text = item.firstChild.innerHTML; changer.className = "changer";
changer.value = text.replace('<input type="checkbox">',""); var writtenLabel = item.firstChild.innerHTML;
item.append(changer); changer.value = writtenLabel.replace('<input type="checkbox">', "");
var button = document.createElement("button"); item.append(changer);
button.innerHTML = "X" var button = document.createElement("button");
item.append(button); button.innerHTML = "modify";
button.addEventListener("click", function (){ item.append(button);
item.firstChild.innerHTML = '<input type="checkbox">'+ changer.value; button.addEventListener("click", function () {
changer.remove(); item.firstChild.innerHTML = '<input type="checkbox">' + changer.value;
button.remove(); 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

Loading…
Cancel
Save