Replaced highlight.js with some server side rendering and improved css transfer by allowing compression in header.

includes/footer.html

@@ -2,7 +2,6 @@
 <!-- Close section -->
 </div></div>
 
-<!-- Footer -->
 <!-- Footer -->
 <footer class="text-center">
     <div class="footer-above">
@@ -54,56 +53,7 @@
     </div>
 </footer>
 
-<!--<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>-->
-
-<script>
-    var e = document.querySelector(".navbar-toggler");
-    var t = document.querySelector(".navbar-collapse");
-    var a = e.getAttribute("aria-expanded");
-
-    function getMaxHeight(t)
-    {
-        // Source: http://n12v.com/css-transition-to-from-auto/
-        var prevHeight = t.style.height;
-        t.style.height = 'auto';
-        var maxHeight = getComputedStyle(t).height;
-        t.style.height = prevHeight;
-        t.offsetHeight; // force repaint
-        return maxHeight;
-    }
-
-    e.onclick = function()
-    {
-        if (a == "false")
-        {
-            t.classList.remove('collapse');
-            e.setAttribute('aria-expanded', true);
-            t.style.height = getMaxHeight(t);
-        }
-        else
-        {
-            t.classList.remove("collapse");
-            t.classList.remove("in");
-            e.setAttribute("aria-expanded", false);
-            t.style.height = getComputedStyle(t).height;
-            t.offsetHeight,t.style.height="0px";
-
-            t.classList.remove('collapsing');
-            t.classList.add('collapse');
-
-            // Check whether the element is unhidden
-            if (t.style.height !== '0px') {
-                t.classList.add('in');
-                t.style.height = 'auto';
-            }
-        }
-        a = e.getAttribute("aria-expanded");
-    }
-</script>
-
-<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/8.9.1/highlight.min.js"></script>
-<script>hljs.initHighlightingOnLoad();</script>
-
+<script src="/js/navBar.min.js" async></script>
 
 </body>
 

includes/header.html

@@ -27,7 +27,8 @@
 <div class="navbar navbar-expand-lg navbar-dark fixed-top bg-primary" id="mainNav">
     <div class="container">
         <a class="navbar-brand" href="#">Jrtechs</a>
-        <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
+        <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent"
+                aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
             <span class="navbar-toggler-icon"></span>
         </button>
 

includes/includes.js

@@ -54,7 +54,7 @@ module.exports =
             utils.include("./" + path).then(function(content)
             {
                 var eTag = crypto.createHash('md5').update(content).digest('hex');
-                result.writeHead(200, {'Content-Type': 'text/css', 'Cache-Control': 'public, max-age=2678400', 'ETag': '"' + eTag + '"'});
+                result.writeHead(200, {'Content-Type': 'text/css', 'Cache-Control': 'public, max-age=2678400', 'ETag': '"' + eTag + '"', 'Vary': 'Accept-Encoding'});
                 result.write(content);
                 result.end();
                 cache.put(path, content);
@@ -66,7 +66,7 @@ module.exports =
         else
         {
             var eTag = crypto.createHash('md5').update(css).digest('hex');
-            result.writeHead(200, {'Content-Type': 'text/css', 'Cache-Control': 'public, max-age=2678400', 'ETag': '"' + eTag + '"'});
+            result.writeHead(200, {'Content-Type': 'text/css', 'Cache-Control': 'public, max-age=2678400', 'ETag': '"' + eTag + '"', 'Vary': 'Accept-Encoding'});
             result.write(css);
             result.end();
         }

js/js.js

@@ -0,0 +1,35 @@
+const utils = require('../utils/utils.js');
+const crypto = require('crypto');
+
+module.exports=
+    {
+        /**Sends the user an image from the specified fileName.
+         *
+         * @param result
+         * @param fileName
+         */
+        main: function(result, fileName, cache)
+        {
+            //result.contentType = 'image/png';
+
+            var js = cache.get(fileName);
+            if(js == null)
+            {
+                utils.include("." + fileName).then(function(content)
+                {
+                    var eTag = crypto.createHash('md5').update(content).digest('hex');
+                    result.writeHead(200, {'Content-Type': 'application/javascript', 'Cache-Control': 'public, max-age=2678400', 'ETag': '"' + eTag + '"'});
+                    result.write(content);
+                    result.end();
+                    cache.put(content);
+                });
+            }
+            else
+            {
+                var eTag = crypto.createHash('md5').update(js).digest('hex');
+                result.writeHead(200, {'Content-Type': 'application/javascript', 'Cache-Control': 'public, max-age=2678400', 'ETag': '"' + eTag + '"'});
+                result.write(js);
+                result.end();
+            }
+        }
+    };

js/navBar.js

@@ -0,0 +1,16 @@
+const e = document.querySelector(".navbar-toggler");
+const t = document.querySelector(".navbar-collapse");
+
+e.onclick = function()
+{
+    if (e.getAttribute("aria-expanded") == "false")
+    {
+        t.classList.remove('collapse');
+        e.setAttribute('aria-expanded', true);
+    }
+    else
+    {
+        e.setAttribute("aria-expanded", false);
+        t.classList.add('collapse');
+    }
+}

js/navBar.min.js

@@ -0,0 +1 @@
+var e=document.querySelector(".navbar-toggler"),t=document.querySelector(".navbar-collapse");e.onclick=function(){"false"==e.getAttribute("aria-expanded")?(t.classList.remove("collapse"),e.setAttribute("aria-expanded",!0)):(e.setAttribute("aria-expanded",!1),t.classList.add("collapse"))};

posts/singlePost.js

@@ -79,6 +79,7 @@ module.exports=
                    }
 
                    html = html.split("<img").join("<img style=\"width: 100%; height:10%\" ");
+                   html = html.split("<code>").join("<code class='hljs cpp'>");
 
                    html += "      <div class=\"\">\n" +
                        "          <p class='text-center'><button class=\"btn btn-secondary btn-lg " +
@@ -142,6 +143,7 @@ module.exports=
                     html += md.render(markDown);
 
                     html = html.split("<img").join("<img style=\"max-width: 100%;\" ");
+                    html = html.split("<code>").join("<code class='hljs cpp'>");
                     html += "</div></div></div><br><br>";
 
                     resolve(html);

server.js

@@ -48,6 +48,10 @@ app.use(function(request, res)
         {
             includes.sendCSS(res, filename, cache)
         }
+        else if(filename.includes("/js/") || filename.includes(".js"))
+        {
+            require("./js/js.js").main(res, filename, cache);
+        }
         else if(filename.includes("/downloads/"))
         {
             require("./downloads/downloads.js").main(res, filename, request);