MerchPeyton2024-08-27T09:51:33-04:00
Merch & Gift Cards
Rep the brand that builds the most badass panels in the industry! Browse our selection of tees, hats, koozies, and more.
Rep the brand that builds the most badass panels in the industry! Browse our selection of tees, hats, koozies, and more. Read More
Fast Shipping
Orders ship from the USA, 99% from our Charleston, SC facility.
Expert Support
Get personalized assistance before and after your purchase from our knowledgeable team.
Easy Returns
With a 60-day return policy, we stand by our products and ensure customer satisfaction.
200+ 5 Star Google Reviews
Trusted by over 40,000 satisfied customers.
const isMobile = {
Android: function () {
return navigator.userAgent.match(/Android/i);
},
BlackBerry: function () {
return navigator.userAgent.match(/BlackBerry/i);
},
iOS: function () {
return navigator.userAgent.match(/iPhone|iPad|iPod/i);
},
Opera: function () {
return navigator.userAgent.match(/Opera Mini/i);
},
Windows: function () {
return navigator.userAgent.match(/IEMobile/i);
},
any: function () {
return (
isMobile.Android() ||
isMobile.BlackBerry() ||
isMobile.iOS() ||
isMobile.Opera() ||
isMobile.Windows());
}
};
document.addEventListener("DOMContentLoaded", function () {
const tocContent = document.querySelector(".post-content");
const tocTitles = tocContent.querySelectorAll(".category-title");
const tabsMenu = document.querySelector('.toc-menu');
const scrollToLinks = tocContent.querySelectorAll(".scroll-to");
tocTitles.forEach(function (heading, i) { // runs a function for all h2 elements inside your rich text element
let str = heading.innerHTML; // adds section titles to slugs
str = str.replace(/\s+/g, '-').replace(/[°&\/\\#,+()$~%.'":;*?{}]/g, "").toLowerCase(); // replaces spaces with hyphens, removes special characters and extra spaces from the headings, and applies lowercase in slugs
heading.setAttribute("id", str); // gives each heading a unique id
const item = document.createElement("a"); // creates an anchor element called "item" for each h2
item.innerHTML = heading.innerHTML // gives each item the text of the corresponding heading
item.setAttribute("class", "toc__item"); // gives each item the correct class
item.setAttribute("href", "#" + str); // gives each item the correct anchor link
document.querySelector("#toc").appendChild(item); // places each item inside the Table of Contents div
});
const observer = new IntersectionObserver((entries) => {
entries.forEach((entry) => {
if (entry.isIntersecting) {
document.querySelectorAll('.toc__item').forEach((link) => {
let id = link.getAttribute('href').replace('#', '');
if (id === entry.target.id) {
link.classList.add('toc__item_active');
setTimeout(() => {
centerActiveItem();
}, "300");
} else {
link.classList.remove('toc__item_active');
}
});
}
});
}, {
threshold: 0.1
});
tocTitles.forEach(section => {
observer.observe(section)
});
const buttons = document.querySelectorAll(".toc__item");
const scrollIntoViewWithOffset = (selector, offset) => {
/*if (isMobile.any()) {
offset = offset * 1.2;
}
console.log(offset);*/
window.scrollTo({
behavior: 'smooth',
top: document.querySelector(selector).getBoundingClientRect().top -
document.body.getBoundingClientRect().top -
offset,
})
}
//TOC menu items
buttons.forEach((button) => {
button.addEventListener('click', function (e) {
e.preventDefault();
e.stopPropagation();
scrollIntoViewWithOffset(e.target.hash, 80);
setTimeout(() => {
centerActiveItem();
}, "300");
});
});
//Other links
scrollToLinks.forEach((button) => {
button.addEventListener('click', function (e) {
e.preventDefault();
e.stopPropagation();
scrollIntoViewWithOffset(e.target.hash, 50);
});
});
const centerActiveItem = () => {
const activeItem = tabsMenu.querySelector(".toc__item_active");
if (activeItem) {
const activeItemBounding = activeItem.getBoundingClientRect();
const viewportWidth = window.innerWidth;
const offset = activeItemBounding.left + activeItemBounding.width / 2 - viewportWidth / 2;
const currentScrollLeft = tabsMenu.scrollLeft;
const targetScrollLeft = currentScrollLeft + offset;
const duration = 300;
const startTime = performance.now();
const animateScroll = (timestamp) => {
const elapsed = timestamp - startTime;
if (elapsed < duration) {
const scrollAmount = offset * (elapsed / duration);
tabsMenu.scrollLeft = currentScrollLeft + scrollAmount;
requestAnimationFrame(animateScroll);
} else {
tabsMenu.scrollLeft = targetScrollLeft;
}
};
requestAnimationFrame(animateScroll);
}
};
// Show / hide read more
const readBtn = document.querySelector('.general-info-read-btn');
const readMoreText = document.querySelector('.general-info-read-more');
const hideBtn = document.querySelector('.general-info-hide-btn');
const gradientText = document.querySelector('.general-info-gradient');
// Function to show the additional text
function showAdditionalText() {
readMoreText.style.display = 'inline';
hideBtn.style.display = 'inline';
gradientText.classList.remove('general-info-gradient');
readBtn.style.display = 'none';
}
// Function to hide the additional text
function hideAdditionalText() {
readMoreText.style.display = 'none';
hideBtn.style.display = 'none';
gradientText.classList.add('general-info-gradient');
readBtn.style.display = 'inline';
}
// Add click event listeners
readBtn.addEventListener('click', showAdditionalText);
hideBtn.addEventListener('click', hideAdditionalText);
});