Bugfix of not being able to navigate after changing page

.gitignore

@@ -1,2 +1,3 @@
 .vscode
-node_modules
+node_modules
+config

public/assets/js/barba.js

@@ -1,6 +1,8 @@
 const transition = document.querySelector(".transition-container");
 
+// --- BarbaJS Configurations --- //
 barba.init({
+    debug: true,
     preventRunning: true,
     transitions: [{
         sync: true,
@@ -11,13 +13,40 @@ barba.init({
             await delay(1300);
             done();
         },
-
-        async enter(data) {
-            enterAnimation();
-        }
       }]
 })
 
+barba.hooks.after(() => {
+    const mobileNavToggler = document.querySelector(".mobile-nav-toggler");
+    const pageWrapper = document.querySelector(".page-wrapper");
+    const navigation = document.querySelector(".navigation");
+    const navLinks = document.querySelectorAll(".navigation li");
+
+    mobileNavToggler.addEventListener("click", () => {
+        mobileNavToggler.classList.toggle("mobile-nav-active");
+
+        if (navigation.style.display == '' || navigation.style.display == 'none') {
+            navigation.style.touchAction = 'none';
+            fadeIn(navigation, 2000);
+
+
+            navLinks.forEach((link, index) => {
+                index == 0 ? link.style.animation = `slideLinksIn 0.5s` : link.style.animation = `slideLinksIn ${0.5 + (index / 5)}s`;
+            })
+        } else { 
+            navLinks.forEach((link, index) => {
+                index == 0 ? link.style.animation = `slideLinksOut 0.5s` : link.style.animation = `slideLinksOut ${0.5 + (index / 5)}s`;
+            })
+
+            fadeOut(navigation);
+            navigation.style.touchAction = 'auto';
+        }
+
+        pageWrapper.classList.toggle("blurred");
+    });
+}) 
+
+// --- Custom Code --- //
 function delay(n) {
     n = n || 2000;
     return new Promise((done) => {
@@ -27,10 +56,6 @@ function delay(n) {
     })
 }
 
-function enterAnimation() {
-
-}
-
 function leaveAnimation() {
     let tl = anime.timeline({
         easing: 'easeInCubic'

routes/routes.js

@@ -1,12 +1,53 @@
 const express = require("express");
+const nodemailer = require("nodemailer");
+const bodyParser = require("body-parser");
+const secrets = require("../config/secrets.json");
+
 const router = express.Router();
 
 router.use(express.static('public'));
+router.use(bodyParser.urlencoded({ extended: true }))
 
 router.get("/", (req, res) => res.render("index.ejs"));
 
 router.get("/about", (req, res) => {
     res.render("about.ejs");
 })
 
+router.post("/contact", (req, res) => {
+    async function main() {
+        let transporter = nodemailer.createTransport({
+            host: 'smtp.googlemail.com',
+            port: 465,
+            secure: true,
+            auth: {
+                user: secrets.NODEMAILER_TRANSPORT_USER,
+                pass: secrets.NODEMAILER_TRANSPORT_PASSWORD
+            }
+        });
+
+        // send mail with defined transport object
+        let info = await transporter.sendMail({
+            from: req.body.email,
+            to: secrets.NODEMAILER_TRANSPORT_USER, // list of receivers
+            subject: req.body.topic, // Subject line
+            text: req.body.content, // plain text body
+            html: 
+            `
+            <h1>(Nodemailer) New Contact Request
+            <p><strong>From:</strong> ${req.body.email}</p>
+            <p><strong>Name:</strong> ${req.body.name}</h3>
+            <p><strong>Subject:</strong> ${req.body.topic}</p>
+            <p><strong>Message:</strong> ${req.body.content}</p>
+            ` // html body
+        });
+
+        console.log('Message sent: %s', info.messageId);
+        console.log('Preview URL: %s', nodemailer.getTestMessageUrl(info));
+    }
+
+    main().catch(console.error);
+    res.redirect("/");
+});
+
 module.exports = router;

views/index.ejs

@@ -201,7 +201,7 @@
     <script defer src="/assets/js/all.min.js"></script>
 
     <script src="/assets/js/cookies.js"></script>
-    <script src="/assets/js/mobile-navigation.js"></script>
+    <script type="module" src="/assets/js/mobile-navigation.js"></script>
     <script src="/assets/js/animations.js"></script>
     <script src="/assets/js/typewriter.js"></script>
     <script src="/assets/js/barba.js"></script>