Reduce reliance on Zepto
This commit is contained in:
parent
35f589630a
commit
9ec7c62057
3 changed files with 39 additions and 51 deletions
50
app/dist/scripts/api.js
vendored
50
app/dist/scripts/api.js
vendored
|
@ -1,58 +1,42 @@
|
||||||
/* global $, Jets */ "use strict";
|
/* global Jets */ "use strict";
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
/**
|
// Initiate search functionality
|
||||||
* Initiate search functionality
|
|
||||||
*/
|
|
||||||
|
|
||||||
let jets = new Jets({
|
let jets = new Jets({
|
||||||
contentTag: "#toc",
|
contentTag: "#toc",
|
||||||
searchTag: "#input-search"
|
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", () => {
|
document.getElementById("input-search").addEventListener("keyup", () => {
|
||||||
if ($("#input-search").val()) $(".api__toc__search__clear").addClass("active");
|
if (document.getElementById("input-search").value)
|
||||||
else $(".api__toc__search__clear").removeClass("active");
|
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", () => {
|
document.querySelector(".api__toc__search__clear").addEventListener("click", () => {
|
||||||
$("#input-search")[0].value = "";
|
document.getElementById("input-search").value = "";
|
||||||
$(".api__toc__search__clear").removeClass("active");
|
document.querySelector(".api__toc__search__clear").classList.remove("active");
|
||||||
jets.destroy();
|
jets.destroy();
|
||||||
reinitJets();
|
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
|
// H E L P E R
|
||||||
|
|
||||||
/**
|
// Reinitialize search functionality
|
||||||
* Reinitialize search functionality
|
|
||||||
*/
|
|
||||||
|
|
||||||
function reinitJets() {
|
function reinitJets() {
|
||||||
jets = new Jets({
|
jets = new Jets({
|
||||||
|
@ -60,5 +44,5 @@ function reinitJets() {
|
||||||
searchTag: "#input-search"
|
searchTag: "#input-search"
|
||||||
});
|
});
|
||||||
|
|
||||||
$("#input-search").focus();
|
document.getElementById("input-search").focus();
|
||||||
}
|
}
|
||||||
|
|
38
app/dist/scripts/app.js
vendored
38
app/dist/scripts/app.js
vendored
|
@ -1,13 +1,15 @@
|
||||||
/* global $, location, send, window */ "use strict";
|
/* global location, send, window */ "use strict";
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
$(function () {
|
document.addEventListener("DOMContentLoaded", () => {
|
||||||
scrollToElementOnLoad();
|
scrollToElementOnLoad();
|
||||||
|
|
||||||
$("a[href^=http]").each(function () { // Automatically open external links in new tabs
|
// Automatically open external links in new tabs
|
||||||
if (this.href.indexOf(location.hostname) === -1) {
|
document.querySelectorAll("a[href^=http]").forEach(anchor => {
|
||||||
$(this).attr("target", "_blank");
|
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 => {
|
document.querySelectorAll("a[href^='#']").forEach(anchor => {
|
||||||
anchor.addEventListener("click", function (e) {
|
anchor.addEventListener("click", event => {
|
||||||
e.preventDefault();
|
event.preventDefault();
|
||||||
|
|
||||||
const element = this.href.split("#").pop();
|
const element = event.target.href.split("#").pop();
|
||||||
let elementOffset;
|
let elementOffset;
|
||||||
|
|
||||||
if (document.getElementById(element)) {
|
if (document.getElementById(element)) {
|
||||||
elementOffset = document.getElementById(element).offsetTop - 74;
|
elementOffset = document.getElementById(element).offsetTop - 74;
|
||||||
window.scroll({ top: elementOffset, behavior: "smooth" });
|
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
|
// Newsletter
|
||||||
|
document.querySelector("[data-action='subscribe to newsletter']").onclick = () => {
|
||||||
$("[data-action='subscribe to newsletter']").on("click", () => {
|
const email = document.getElementById("emailAddress").value;
|
||||||
const email = $("#emailAddress").val();
|
|
||||||
if (!validateEmail(email)) return;
|
if (!validateEmail(email)) return;
|
||||||
|
|
||||||
send(JSON.stringify({
|
send(JSON.stringify({
|
||||||
"email": email,
|
"email": email,
|
||||||
"message": "subscribe"
|
"message": "subscribe"
|
||||||
}));
|
}));
|
||||||
});
|
};
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
@ -79,6 +83,6 @@ function scrollToElementOnLoad() {
|
||||||
}
|
}
|
||||||
|
|
||||||
function validateEmail(email) {
|
function validateEmail(email) {
|
||||||
const re = /^(([^<>()[\].,;:\s@"]+(\.[^<>()[\].,;:\s@"]+)*)|(".+"))@(([^<>()[\].,;:\s@"]+\.)+[^<>()[\\.,;:\s@"]{2,})$/i;
|
const emailRegex = /^(([^<>()[\].,;:\s@"]+(\.[^<>()[\].,;:\s@"]+)*)|(".+"))@(([^<>()[\].,;:\s@"]+\.)+[^<>()[\\.,;:\s@"]{2,})$/i;
|
||||||
return re.test(String(email));
|
return emailRegex.test(String(email));
|
||||||
}
|
}
|
||||||
|
|
|
@ -96,7 +96,7 @@ module.exports = exports = () => html`
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
$(function () {
|
document.addEventListener("DOMContentLoaded", () => {
|
||||||
send(JSON.stringify({
|
send(JSON.stringify({
|
||||||
"message": "landed on homepage"
|
"message": "landed on homepage"
|
||||||
}));
|
}));
|
||||||
|
|
Loading…
Reference in a new issue