// Scroll anchor - Main.html
function t3sbScrollToAnchor(sectionmenuAnchorOffset, fixedNavbar, navbarHeight, sectionhash=false) {
var hash = window.location.hash;
if (sectionhash) {
hash = sectionhash;
}
if (hash.length) {
var idArr = hash.split('#');
var targetElement = document.getElementById(idArr[1]);
if ( targetElement === null ) {
idArr = hash.split('#c');
targetElement = document.getElementById('tab-'+idArr[1]);
}
if ( targetElement != null ) {
var offsetSize = sectionmenuAnchorOffset;
if ( fixedNavbar ) {
offsetSize += navbarHeight;
}
var scrollTo = Math.round(t3sbOffsetTop(targetElement)-offsetSize);
window.scroll({ top: scrollTo, behavior: 'smooth' });
}
}
}
function t3sbOffsetTop(el) {
var rect = el.getBoundingClientRect(),
scrollTop = window.pageYOffset || document.documentElement.scrollTop;
return rect.top + scrollTop;
}
// Loading spinner - Main.html
function t3sbFadeOutEffect(fadeTarget) {
var fadeEffect = setInterval(function () {
if (!fadeTarget.style.opacity) {
fadeTarget.style.opacity = 1;
}
if (fadeTarget.style.opacity > 0) {
fadeTarget.style.opacity -= 0.1;
} else {
clearInterval(fadeEffect);
}
}, 60);
fadeTarget.classList.add('d-none');
}
// Magnifying glass icon - Main.html
function t3sbMagnifying(img, viewportWidth, navbarBreakpointWidth) {
var zoomOverlay = img.parentElement.parentElement.querySelectorAll('div.zoom-overlay');
if ( zoomOverlay.length ) {
var imgwidth = Math.round(img.getBoundingClientRect().width)+'px',
imgheight = img.clientHeight+'px';
if ( viewportWidth < navbarBreakpointWidth ) {
imgwidth = '100%';
}
zoomOverlay[0].classList.add('card-img-overlay');
if ( imgwidth ) {
zoomOverlay[0].style.maxWidth = imgwidth;
}
if ( imgheight ) {
zoomOverlay[0].style.maxHeight = imgheight;
}
}
}
// Link to top - Main.html
function t3sbScrollToTop() {
document.addEventListener('scroll', t3sbHandleScroll);
}
function t3sbHandleScroll() {
var scrollToTopBtn = document.querySelector('.back-to-top'),
scrollTop = window.pageYOffset || document.documentElement.scrollTop;
if (scrollToTopBtn != null) {
scrollToTopBtn.addEventListener('click', t3sbScrollIt);
if (scrollTop > 100) {
scrollToTopBtn.classList.add('st-block');
scrollToTopBtn.classList.remove('st-none');
} else {
scrollToTopBtn.classList.add('st-none');
scrollToTopBtn.classList.remove('st-block');
}
}
}
function t3sbScrollIt(e) {
e.preventDefault();
window.scroll({ top: 0, behavior: 'smooth' });
}
// Sticky footer - Page/Footer.html
function t3sbStickyFooter(footerExtraHeight) {
const footer = document.getElementById('page-footer');
var footerHeight = footer.offsetHeight -2;
if ( footerExtraHeight > 0 ) {
footerHeight += footerExtraHeight;
}
if ( footer.classList.contains('footer-sticky') ) {
document.body.style.paddingBottom = footerHeight+'px';
}
}
// Section Menu Navbar - Page/Navbar/Navbar.html
function t3sbSectionMenu(fixedNavbar,sectionmenuAnchorOffset,navbarHeight,offcanvas) {
const sectionmenu = document.getElementById('main-navbar');
sectionmenu.querySelectorAll('a.js-scroll-trigger').forEach( link => {
link.addEventListener('click', function(l) {
t3sbScrollToAnchor(sectionmenuAnchorOffset, fixedNavbar, navbarHeight, l.currentTarget.getAttribute('href'));
l.preventDefault();
});
});
if (window.innerWidth < document.body.getAttribute('data-navbar-breakpointwidth')) {
const navLinks = document.querySelectorAll('.nav-item:not(.dropdown)');
const menuToggle = document.getElementById('navbarToggler');
if (offcanvas) {
const bsOffcanvas = new bootstrap.Offcanvas(menuToggle, {toggle: false});
navLinks.forEach((l) => {
l.addEventListener('click', () => { bsOffcanvas.toggle() });
});
} else {
const bsCollapse = new bootstrap.Collapse(menuToggle, {toggle: false});
navLinks.forEach((l) => {
l.addEventListener('click', () => { bsCollapse.toggle() });
});
}
}
}
// Navbar transparent - Navbar/Assets.html
function t3sbTransparentNavbar(colorschemes, gradient) {
if (colorschemes) colorschemes = 'bg-'+colorschemes;
window.onscroll = function(){
var navbar = document.getElementById('main-navbar');
var top = window.pageYOffset || document.documentElement.scrollTop;
if (top > 100) {
navbar.classList.remove('bg-transparent');
navbar.classList.add(colorschemes);
if (gradient) {
navbar.classList.add(gradient);
}
} else {
navbar.classList.add('bg-transparent');
navbar.classList.remove(colorschemes);
if (gradient) {
navbar.classList.remove(gradient);
}
}
};
}
// Shrinking Navbar on scrolling - Navbar/Assets.html
function t3sbShrinkingNavbar(navbar, padding) {
let navShrinkColorschemes = navbar.getAttribute('data-shrinkcolorschemes'),
navShrinkColor = 'navbar-'+navbar.getAttribute('data-shrinkcolor'),
navColorschemes = navbar.getAttribute('data-colorschemes'),
navColor = navbar.getAttribute('data-color'),
gradient = navShrinkColorschemes.split(' ');
if (gradient[1]) {
navShrinkColorschemes = gradient[0];
}
window.addEventListener('scroll', function() {
if (navColor == navShrinkColor) {
if ( t3sbOffsetTop(navbar) > 100) {
navbar.classList.remove('py-'+padding, navColorschemes);
navbar.classList.add('navbar-shrink', navShrinkColorschemes);
} else {
navbar.classList.add('py-'+padding, navColorschemes);
navbar.classList.remove('navbar-shrink', navShrinkColorschemes);
}
} else {
if ( t3sbOffsetTop(navbar) > 100) {
navbar.classList.remove('py-'+padding, navColorschemes, navColor);
navbar.classList.add('navbar-shrink', navShrinkColor, navShrinkColorschemes);
} else {
navbar.classList.add('py-'+padding, navColorschemes, navColor);
navbar.classList.remove('navbar-shrink', navShrinkColor, navShrinkColorschemes);
}
}
});
}
// Extra Row - Navbar/Assets.html
function t3sbExtraRow(vw, bp) {
let extraRow = document.querySelector('.navbar .extra-row');
if (extraRow) {
if ( vw < bp ) {
extraRow.classList.add('flex-row','me-auto','mt-4','mb-0');
extraRow.classList.remove('ms-auto');
} else {
extraRow.classList.remove('flex-row','me-auto','mt-4','mb-0');
extraRow.classList.add('ms-auto');
}
}
}
// Offcanvas - Navbar/Assets.html
function t3sbOffcanvas(vw, bp, utilColorArr) {
var navbarToggler = document.getElementById('navbarToggler');
if ( vw > bp ) {
navbarToggler.classList.remove(utilColorArr[0]);
navbarToggler.classList.remove(utilColorArr[1]);
} else {
navbarToggler.classList.add(utilColorArr[0]);
navbarToggler.classList.add(utilColorArr[1]);
}
let extraRow = document.querySelector('.navbar .extra-row');
if (extraRow) {
if ( vw < bp ) {
extraRow.classList.add('ms-3');
} else {
extraRow.classList.remove('ms-3');
}
}
}
// Searchbox in Navbar - Navbar/Assets.html
function t3sbNavbarSearchbox(vw, bp) {
let form = document.querySelector('.navbar form');
if ( vw < bp ) {
if (form.classList.contains('ms-auto')) {
form.classList.remove('ms-auto');
form.classList.add('xl-ms-auto');
}
form.classList.add('mt-3');
} else {
if (form.classList.contains('xl-ms-auto')) {
form.classList.add('ms-auto');
form.classList.remove('xl-ms-auto');
}
form.classList.remove('mt-3');
}
}
// Color mode - Main.html
/*!
* Color mode toggler for Bootstrap's docs (https://getbootstrap.com/)
* Copyright 2011-2023 The Bootstrap Authors
* Licensed under the Creative Commons Attribution 3.0 Unported License.
*/
function t3sbColorMode() {
const getStoredTheme = () => localStorage.getItem('theme')
const setStoredTheme = theme => localStorage.setItem('theme', theme)
const getPreferredTheme = () => {
const storedTheme = getStoredTheme()
if (storedTheme) {
return storedTheme
}
return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light'
}
const setTheme = theme => {
if (theme === 'auto' && window.matchMedia('(prefers-color-scheme: dark)').matches) {
document.documentElement.setAttribute('data-bs-theme', 'dark')
} else {
document.documentElement.setAttribute('data-bs-theme', theme)
}
}
setTheme(getPreferredTheme())
const showActiveTheme = (theme, focus = false) => {
const themeSwitcher = document.querySelector('#bd-theme')
if (!themeSwitcher) {
return
}
const themeSwitcherText = document.querySelector('#bd-theme-text')
const activeThemeIcon = document.querySelector('.theme-icon-active use')
const btnToActive = document.querySelector(`[data-bs-theme-value="${theme}"]`)
const svgOfActiveBtn = btnToActive.querySelector('svg use').getAttribute('href')
document.querySelectorAll('[data-bs-theme-value]').forEach(element => {
element.classList.remove('active')
element.setAttribute('aria-pressed', 'false')
})
btnToActive.classList.add('active')
btnToActive.setAttribute('aria-pressed', 'true')
activeThemeIcon.setAttribute('href', svgOfActiveBtn)
const themeSwitcherLabel = `${themeSwitcherText.textContent} (${btnToActive.dataset.bsThemeValue})`
themeSwitcher.setAttribute('aria-label', themeSwitcherLabel)
if (focus) {
themeSwitcher.focus()
}
}
window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', () => {
const storedTheme = getStoredTheme()
if (storedTheme !== 'light' && storedTheme !== 'dark') {
setTheme(getPreferredTheme())
}
})
window.addEventListener('DOMContentLoaded', () => {
showActiveTheme(getPreferredTheme())
document.querySelectorAll('[data-bs-theme-value]').forEach(toggle => {
toggle.addEventListener('click', () => {
const theme = toggle.getAttribute('data-bs-theme-value')
setStoredTheme(theme)
setTheme(theme)
showActiveTheme(theme, true)
})
})
})
}