2/3 Field Green / 1/3 Clover Green Archives

const tabUrls = {
landscape: ‘/products/landscape/’,
petsystems: ‘/products/pet-systems/’,
puttinggreens: ‘/products/putting-greens/’,
playgroundturf: ‘/products/playground-turf/’,
installaccessories: ‘/products/install-accessories/’,
tigerturfproducts: ‘/products/tigerturf-products/’,
everlastproducts: ‘/products/everlast-products/’,
emeraldartificialgreenery: ‘/products/emerald-artificial-greenery/’
};

const tabKeys = Object.keys(tabUrls);
let panelsCache;
let navTabsCache;

const getTabKey = (tabLink) => {
const heading = tabLink.querySelector(‘.fusion-tab-heading’);
const text = (heading ? heading.textContent : ”).toLowerCase().replace(/[^a-z0-9]/g, ”);
return tabKeys.includes(text) ? text : null;
};

const setMaxHeight = () => {
panelsCache = panelsCache || document.querySelectorAll(‘.tab-pane’);
let maxHeight = 0;

panelsCache.forEach(panel => {
const wasActive = panel.classList.contains(‘active’);
panel.classList.add(‘active’, ‘in’);
panel.style.cssText = ‘position:absolute;visibility:hidden;min-height:auto’;

maxHeight = Math.max(maxHeight, panel.scrollHeight);

panel.style.cssText = ”;
if (!wasActive) panel.classList.remove(‘active’, ‘in’);
});

document.documentElement.style.setProperty(‘–js-nav-content-max-ht’, `${maxHeight}px`);
};

const handleTabHover = (e) => {
let tabLink = e.target;
if (!tabLink.id?.startsWith(‘fusion-tab-‘)) {
if (tabLink.parentElement?.id?.startsWith(‘fusion-tab-‘)) {
tabLink = tabLink.parentElement;
} else return;
}

// Cache DOM queries for better performance on frequent hover events
navTabsCache = navTabsCache || document.querySelectorAll(‘.nav-tabs li’);
panelsCache = panelsCache || document.querySelectorAll(‘.tab-pane’);

navTabsCache.forEach(li => li.classList.remove(‘active’));

let li = tabLink;
while (li && li.tagName !== ‘LI’) li = li.parentElement;
if (li) li.classList.add(‘active’);

const key = getTabKey(tabLink);
const tabIndex = key ? tabKeys.indexOf(key) : -1;
if (tabIndex >= 0) {
panelsCache.forEach(panel => panel.classList.remove(‘active’, ‘in’));
panelsCache[tabIndex]?.classList.add(‘active’, ‘in’);
}
};

document.addEventListener(‘DOMContentLoaded’, () => {
fixTabHrefs();
setTimeout(setMaxHeight, 1000);
document.addEventListener(‘mouseenter’, handleTabHover, true);
document.addEventListener(‘click’, e => {
if (e.target.closest(‘[id^=”fusion-tab-“]’)) e.stopImmediatePropagation();
}, true);
});

window.TabMapper = { tabUrls };