Reduce reliance on Zepto

app/dist/scripts/api.js

@@ -1,58 +1,42 @@
-/* global $, Jets */ "use strict";
+/* global Jets */ "use strict";
 
 
 
-/**
- * Initiate search functionality
- */
+// Initiate search functionality
 
 let jets = new Jets({
   contentTag: "#toc",
   searchTag: "#input-search"
 });
 
-/**
- * Reset search on page load
- */
+// Reset search on page load
 
-$("#input-search")[0].value = "";
+document.getElementById("input-search").value = "";
 
-/**
- * Activate search
- */
+// Activate search
 
-$("#input-search").on("keyup", () => {
-  if ($("#input-search").val()) $(".api__toc__search__clear").addClass("active");
-  else $(".api__toc__search__clear").removeClass("active");
+document.getElementById("input-search").addEventListener("keyup", () => {
+  if (document.getElementById("input-search").value)
+    document.querySelector(".api__toc__search__clear").classList.add("active");
+
+  else
+    document.querySelector(".api__toc__search__clear").classList.remove("active");
 });
 
-/**
- * Cancel search
- */
+// Cancel search
 
-$(".api__toc__search__clear").on("click", () => {
-  $("#input-search")[0].value = "";
-  $(".api__toc__search__clear").removeClass("active");
+document.querySelector(".api__toc__search__clear").addEventListener("click", () => {
+  document.getElementById("input-search").value = "";
+  document.querySelector(".api__toc__search__clear").classList.remove("active");
   jets.destroy();
   reinitJets();
 });
 
-/**
- * Add hash to URL bar when sidebar links are clicked
- */
-
-$(".api__toc__item a").on("click", event => {
-  const hash = event.currentTarget.href.split("#")[1];
-  history.replaceState({}, "", `#${hash}`);
-});
-
 
 
 //  H E L P E R
 
-/**
- * Reinitialize search functionality
- */
+// Reinitialize search functionality
 
 function reinitJets() {
   jets = new Jets({
@@ -60,5 +44,5 @@ function reinitJets() {
     searchTag: "#input-search"
   });
 
-  $("#input-search").focus();
+  document.getElementById("input-search").focus();
 }

app/dist/scripts/app.js

@@ -1,13 +1,15 @@
-/* global $, location, send, window */ "use strict";
+/* global location, send, window */ "use strict";
 
 
 
-$(function () {
+document.addEventListener("DOMContentLoaded", () => {
   scrollToElementOnLoad();
 
-  $("a[href^=http]").each(function () { // Automatically open external links in new tabs
-    if (this.href.indexOf(location.hostname) === -1) {
-      $(this).attr("target", "_blank");
+  // Automatically open external links in new tabs
+  document.querySelectorAll("a[href^=http]").forEach(anchor => {
+    if (anchor.href.indexOf(location.hostname) === -1) {
+      anchor.rel = "noopener noreferrer";
+      anchor.target = "_blank";
     }
   });
 });
@@ -32,33 +34,35 @@ document.querySelector("#close-alert").onclick = function () {
 
 
 
-//  Smooth scroll
-
+// Smooth scroll
 document.querySelectorAll("a[href^='#']").forEach(anchor => {
-  anchor.addEventListener("click", function (e) {
-    e.preventDefault();
+  anchor.addEventListener("click", event => {
+    event.preventDefault();
 
-    const element = this.href.split("#").pop();
+    const element = event.target.href.split("#").pop();
     let elementOffset;
 
     if (document.getElementById(element)) {
       elementOffset = document.getElementById(element).offsetTop - 74;
       window.scroll({ top: elementOffset, behavior: "smooth" });
     }
+
+    // Add hash to URL bar when sidebar links are clicked
+    if (event.target.parentElement.className === "api__toc__item")
+      history.replaceState({}, "", `#${element}`);
   });
 });
 
-//  Newsletter
-
-$("[data-action='subscribe to newsletter']").on("click", () => {
-  const email = $("#emailAddress").val();
+// Newsletter
+document.querySelector("[data-action='subscribe to newsletter']").onclick = () => {
+  const email = document.getElementById("emailAddress").value;
   if (!validateEmail(email)) return;
 
   send(JSON.stringify({
     "email": email,
     "message": "subscribe"
   }));
-});
+};
 
 
 
@@ -79,6 +83,6 @@ function scrollToElementOnLoad() {
 }
 
 function validateEmail(email) {
-  const re = /^(([^<>()[\].,;:\s@"]+(\.[^<>()[\].,;:\s@"]+)*)|(".+"))@(([^<>()[\].,;:\s@"]+\.)+[^<>()[\\.,;:\s@"]{2,})$/i;
-  return re.test(String(email));
+  const emailRegex = /^(([^<>()[\].,;:\s@"]+(\.[^<>()[\].,;:\s@"]+)*)|(".+"))@(([^<>()[\].,;:\s@"]+\.)+[^<>()[\\.,;:\s@"]{2,})$/i;
+  return emailRegex.test(String(email));
 }

app/views/home.js

@@ -96,7 +96,7 @@ module.exports = exports = () => html`
   </div>
 
   <script>
-    $(function () {
+    document.addEventListener("DOMContentLoaded", () => {
       send(JSON.stringify({
         "message": "landed on homepage"
       }));