From d159cdb0c5684f11d128579c82884a94095c1080 Mon Sep 17 00:00:00 2001
From: Karan <50290386+Sonawane-Karan26@users.noreply.github.com>
Date: Wed, 24 Nov 2021 21:35:59 +0530
Subject: [PATCH] Project 2

---
 Chapter 15/Project 2 | 65 ++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 65 insertions(+)
 create mode 100644 Chapter 15/Project 2
diff --git a/Chapter 15/Project 2 b/Chapter 15/Project 2
new file mode 100644
index 0000000..11178a2
--- /dev/null
+++ b/Chapter 15/Project 2	
@@ -0,0 +1,65 @@
+<!DOCTYPE html>
+<html>
+<head>
+    <title>JavaScript List Project</title>
+</head>
+<body>
+    <div class="output"></div>
+    <input type="text"><button>add</button>
+    <script>
+        const output = document.querySelector(".output");
+        const myValue = document.querySelector("input");
+        const btn1 = document.querySelector("button");
+        const url = "list.json";
+        btn1.addEventListener("click", addToList);
+        let localData = localStorage.getItem("myList");
+        let myList = [];
+        window.addEventListener("DOMContentLoaded", () => {
+            output.textContent = "Loading......";
+            if (localData) {
+                myList = JSON.parse(localStorage.getItem("myList"));
+                output.innerHTML = "";
+                myList.forEach((el, index) => {
+                    maker(el);
+                });
+            } else {
+                reloader();
+            }
+        });
+
+        function addToList() {
+            if (myValue.value.length > 3) {
+                const myObj = {
+                    "name": myValue.value
+                }
+                myList.push(myObj);
+                maker(myObj);
+                savetoStorage();
+            }
+            myValue.value = "";
+        }
+
+        function savetoStorage() {
+            console.log(myList);
+            localStorage.setItem("myList", JSON.stringify(myList));
+        }
+
+        function reloader() {
+            fetch(url).then(rep => rep.json())
+            .then((data) => {
+                myList = data;
+                myList.forEach((el, index) => {
+                    maker(el);
+                });
+                savetoStorage();
+            })
+        }
+
+        function maker(el) {
+            const div = document.createElement("div");
+            div.innerHTML = `${el.name}`;
+            output.append(div);
+        }
+    </script>
+</body>
+</html>
