frontend updates

frontend/js/general.js

@@ -0,0 +1,15 @@
+function qS(selector) {
+    if(!selector) { 
+        console.error("No selector is defined!")
+        return
+    }
+    return document.querySelector(selector)
+}
+
+function qSA(selector) {
+    if(!selector) { 
+        console.error("No selector is defined!")
+        return
+    }
+    return document.querySelectorAll(selector)
+}

frontend/js/modal.js

@@ -0,0 +1,16 @@
+// close on button
+const close = qSA(".md-close")
+close.forEach(one => {
+    one.addEventListener("click", (el) => {
+        const active = qS(".md-active")
+        active.classList.remove("md-active")
+    })
+})
+
+// close on backdrop
+window.onclick = function(event) {
+    const active = qS(".md-active")
+    if (event.target == active) {
+        active.classList.remove("md-active")
+    }
+} 

frontend/js/nav.js

@@ -0,0 +1,21 @@
+function show_modal(selector, modal_selector = null) {
+	try {
+		if(modal_selector === null) {
+			modal_selector = selector
+		}
+	
+		const btn = qS(selector)
+		const md = qS(modal_selector)
+		btn.addEventListener("click", (el) => {
+		    md.classList.add("md-active")
+		})
+	} catch (error) {
+		console.error(error)
+	}
+}
+
+show_modal(".nav-add", "#md-add-tree")
+show_modal(".nav-user", "#md-user-tree")
+show_modal("#nav-login", "#md-login")
+show_modal("#nav-signup", "#md-signup")
+