2019-05-14 21:40:35 +02:00
|
|
|
"use strict"; /* global document, history, location, send, window */
|
2018-07-12 17:21:42 +02:00
|
|
|
|
|
|
|
|
|
|
|
|
2018-10-02 00:11:20 +02:00
|
|
|
document.addEventListener("DOMContentLoaded", () => {
|
2018-07-12 17:21:42 +02:00
|
|
|
scrollToElementOnLoad();
|
2019-07-10 23:48:45 +02:00
|
|
|
initializeSmoothScroll();
|
2018-07-12 17:21:42 +02:00
|
|
|
|
2018-10-02 00:11:20 +02:00
|
|
|
// 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";
|
2018-07-12 17:21:42 +02:00
|
|
|
}
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
|
2019-05-14 21:40:35 +02:00
|
|
|
// Menu toggle for Glossary
|
2018-10-03 18:53:46 +02:00
|
|
|
if (
|
2019-05-14 21:40:35 +02:00
|
|
|
window.innerWidth <= 800 &&
|
|
|
|
window.location.pathname.split("/").pop() === "glossary"
|
|
|
|
) {
|
|
|
|
document.querySelector(".page__header__title").insertAdjacentHTML("afterbegin", "<button id='toggle-menu'>Menu</button>");
|
|
|
|
|
|
|
|
document.getElementById("toggle-menu").addEventListener("click", () => {
|
|
|
|
document.querySelector(".component--glossary-toc").classList.toggle("active");
|
|
|
|
document.querySelector("body").classList.toggle("disable-scrolling");
|
|
|
|
});
|
|
|
|
|
|
|
|
// Handle menu toggle when clicking on commands
|
|
|
|
document.querySelectorAll(".component--glossary-toc a").forEach(keyword => {
|
|
|
|
keyword.addEventListener("click", () => {
|
|
|
|
document.querySelector("body").classList.remove("disable-scrolling");
|
|
|
|
document.querySelector(".component--glossary-toc").classList.remove("active");
|
|
|
|
});
|
|
|
|
});
|
|
|
|
}
|
2018-10-01 17:31:49 +02:00
|
|
|
|
|
|
|
|
|
|
|
|
2019-07-10 23:48:45 +02:00
|
|
|
function initializeSmoothScroll() {
|
|
|
|
// Smooth scroll
|
|
|
|
document.querySelectorAll("a[href^='#']").forEach(anchor => {
|
|
|
|
if (anchor.classList.contains("no-smooth")) // Ignore smooth scroll functionality
|
|
|
|
return;
|
2019-02-05 00:42:52 +01:00
|
|
|
|
2019-07-10 23:48:45 +02:00
|
|
|
anchor.addEventListener("click", event => {
|
|
|
|
event.preventDefault();
|
2018-07-12 17:21:42 +02:00
|
|
|
|
2019-07-10 23:48:45 +02:00
|
|
|
const element = event.target.href.split("#").pop()
|
|
|
|
.toLowerCase();
|
|
|
|
let elementOffset;
|
2018-07-12 17:21:42 +02:00
|
|
|
|
2019-07-10 23:48:45 +02:00
|
|
|
if (document.getElementById(element)) {
|
|
|
|
elementOffset = document.getElementById(element).offsetTop - 150;
|
|
|
|
window.scroll({ top: elementOffset, behavior: "smooth" });
|
|
|
|
history.pushState({}, "", `#${element}`); // Add hash to URL bar
|
|
|
|
}
|
|
|
|
});
|
2018-07-12 17:21:42 +02:00
|
|
|
});
|
2019-07-10 23:48:45 +02:00
|
|
|
}
|
2018-07-12 17:21:42 +02:00
|
|
|
|
2018-10-02 00:11:20 +02:00
|
|
|
// Newsletter
|
2018-10-10 21:04:16 +02:00
|
|
|
document.getElementById("emailAddress").addEventListener("keyup", event => {
|
|
|
|
const key = event.keyCode ? event.keyCode : event.which;
|
|
|
|
|
|
|
|
if (key === 13)
|
|
|
|
document.querySelector("[data-action='subscribe to newsletter']").click();
|
|
|
|
});
|
|
|
|
|
2018-10-02 00:11:20 +02:00
|
|
|
document.querySelector("[data-action='subscribe to newsletter']").onclick = () => {
|
2018-10-10 21:04:16 +02:00
|
|
|
const email = document.getElementById("emailAddress").value.trim();
|
|
|
|
|
|
|
|
if (!validateEmail(email)) {
|
|
|
|
document.getElementById("emailMessage").classList.add("error");
|
|
|
|
document.getElementById("emailMessage").innerHTML = "Your email address is invalid";
|
|
|
|
return;
|
|
|
|
}
|
2018-10-06 22:53:01 +02:00
|
|
|
|
2018-10-10 21:04:16 +02:00
|
|
|
document.getElementById("emailMessage").classList.remove("error");
|
2018-07-27 20:04:05 +02:00
|
|
|
|
2019-02-08 00:06:03 +01:00
|
|
|
send({
|
2018-10-06 22:53:01 +02:00
|
|
|
email: email,
|
|
|
|
message: "subscribe"
|
2019-02-08 00:06:03 +01:00
|
|
|
});
|
2018-10-02 00:11:20 +02:00
|
|
|
};
|
2018-07-27 20:04:05 +02:00
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// H E L P E R S
|
|
|
|
|
2019-07-10 23:48:45 +02:00
|
|
|
function runScriptsInDynamicallyInsertedHTML(element, elementHTML) { // eslint-disable-line no-unused-vars
|
|
|
|
element.innerHTML = elementHTML;
|
|
|
|
|
|
|
|
Array.from(element.querySelectorAll("script")).forEach(oldScript => {
|
|
|
|
const newScript = document.createElement("script");
|
|
|
|
|
|
|
|
Array.from(oldScript.attributes)
|
|
|
|
.forEach(attr => newScript.setAttribute(attr.name, attr.value));
|
|
|
|
|
|
|
|
newScript.appendChild(document.createTextNode(oldScript.innerHTML));
|
|
|
|
oldScript.parentNode.replaceChild(newScript, oldScript);
|
|
|
|
});
|
|
|
|
}
|
|
|
|
|
2018-07-12 17:21:42 +02:00
|
|
|
function scrollToElementOnLoad() {
|
|
|
|
if (window.location.href.includes("#")) {
|
|
|
|
setTimeout(() => { // give page time to breathe
|
2018-10-09 21:15:53 +02:00
|
|
|
const element = window.location.href.split("#").pop()
|
|
|
|
.toLowerCase();
|
2018-07-12 17:21:42 +02:00
|
|
|
let elementOffset;
|
|
|
|
|
|
|
|
if (document.getElementById(element)) {
|
2019-05-14 21:40:35 +02:00
|
|
|
elementOffset = document.getElementById(element).offsetTop - 150;
|
2018-07-12 17:21:42 +02:00
|
|
|
window.scroll({ top: elementOffset, behavior: "smooth" });
|
|
|
|
}
|
|
|
|
}, 150);
|
|
|
|
}
|
|
|
|
}
|
2018-07-27 20:04:05 +02:00
|
|
|
|
|
|
|
function validateEmail(email) {
|
2018-10-02 00:11:20 +02:00
|
|
|
const emailRegex = /^(([^<>()[\].,;:\s@"]+(\.[^<>()[\].,;:\s@"]+)*)|(".+"))@(([^<>()[\].,;:\s@"]+\.)+[^<>()[\\.,;:\s@"]{2,})$/i;
|
2019-02-12 00:47:01 +01:00
|
|
|
return emailRegex.test(String(email)); // eslint-disable-line padding-line-between-statements
|
2018-07-27 20:04:05 +02:00
|
|
|
}
|