From 7f170d4f152f47a3bf4d775ecaad85fa0745c051 Mon Sep 17 00:00:00 2001 From: Jonathan Branan Date: Tue, 3 Sep 2024 15:23:20 -0500 Subject: [PATCH] created todo list --- e.html | 16 +++++++++++++++ e.js | 62 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ 2 files changed, 78 insertions(+) create mode 100644 e.html create mode 100644 e.js diff --git a/e.html b/e.html new file mode 100644 index 0000000..476238d --- /dev/null +++ b/e.html @@ -0,0 +1,16 @@ + + + + + + To-Do List + + +

To-Do List

+

Items

+
+ + + + + \ No newline at end of file diff --git a/e.js b/e.js new file mode 100644 index 0000000..013dc5f --- /dev/null +++ b/e.js @@ -0,0 +1,62 @@ +let items = [] + +const itemsDiv = document.getElementById("items") +const input = document.getElementById("itemInput") +const storageKey = "items" + +document.addEventListener("DOMContentLoaded", loadItems) +function renderItems() { + itemsDiv.innerHTML = null; + + for (const [idx, item] of Object.entries(items)) { + + const container = document.createElement("div") + container.style.marginBottom = "10px" + + const text = document.createElement("p") + text.style.display = "inline" + text.style.marginRight = "10px" + text.textContent = item; + + const button = document.createElement("button") + button.textContent = "Delete" + button.onclick = () => removeItem(idx) + + container.appendChild(text) + container.appendChild(button) + + itemsDiv.appendChild(container) + } +} + +function loadItems() { + const oldItems = localStorage.getItem(storageKey) + if(oldItems) items = JSON.parse(oldItems) + renderItems() +} + +function saveItems() { + const stringItems = JSON.stringify(items) + localStorage.setItem(storageKey, stringItems) + renderItems() +} + +function addItem() { + const value = input.value + if (!value) { + alert("You cannot add an empty item") + return + } + items.push(value) + renderItems() + input.value = "" + saveItems() +} + +function removeItem(idx) { + items.splice(idx, 1) + renderItems() + saveItems() +} + +document.addEventListener("DOMContentLoaded", loadItems) \ No newline at end of file