1 files changed, 48 insertions, 9 deletions
diff --git a/static/scripts/index.js b/static/scripts/index.js
index 65c3c12..b1b006d 100644
--- a/static/scripts/index.js
+++ b/static/scripts/index.js
@@ -1,11 +1,50 @@
-const modal = document.querySelector("dialog");
-const showModalBtn = document.querySelector("#show-modal");
-const closeModalBtn = document.querySelector("#close-modal");
+// const modal = document.querySelector("dialog");
+const showModalBtns = document.querySelectorAll(".show-modal");
+const closeModalBtns = document.querySelectorAll(".close-modal");
+const clipboard = document.querySelector("#copy-ingredients");
 
-showModalBtn.addEventListener("click", () => {
-  modal.showModal();
-});
+if(clipboard) {
+  clipboard.addEventListener("click", () => {
+
+    // Copy data to clipboard
+    const ingredientsContent = document.querySelector("#ingredients").textContent.trim();
+    const contentArr = ingredientsContent.split("\n");
+    const ingredientsString = contentArr.map((el) => {
+       if(el.trim() == "") return;
+       else return el.trim();
+    }).join("\n")
+    navigator.clipboard.writeText(ingredientsString);
+
+    // Show success message momentarily
+    clipboard.parentElement.insertAdjacentHTML("afterend", "<span id='copied-message'> ingredients copied!</span>");
+  
+    setTimeout(() => {
+       document.querySelector("#copied-message").remove(); 
+    }, 2000)
+  })
+}
+
+
+// Open and close modals on /account page
+if(showModalBtns){
+  showModalBtns.forEach((btn) => {
+    btn.addEventListener("click", () => {
+
+      // Open dialog box
+      btn.nextElementSibling.showModal();
+
+    })
+  })
+}
+
+if(closeModalBtns){
+  closeModalBtns.forEach((btn) => {
+    btn.addEventListener("click", () => {
+
+      // Open dialog box
+      btn.parentNode.close();
+
+    })
+  })
+}
 
-closeModalBtn.addEventListener("click", () => {
-  modal.close();
-});