<!-- @tuanphan - Expanding Panels Mobile Click-Through -->
<script>
window.ExpandingPanelsMobileConfig = {
breakpoint: 767,
requireTouch: false,
disableExpandOnMobile: true
};
</script>
<script>
(function () {
const cfg = window.ExpandingPanelsMobileConfig;
if (!cfg) return;
const style = document.createElement('style');
style.textContent = '.wm-ep-mobile .wm-panel{cursor:pointer;}';
document.head.appendChild(style);
const mqWidth = window.matchMedia('(max-width:' + cfg.breakpoint + 'px)');
const mqHover = window.matchMedia('(hover:none)');
function isMobile() {
return mqWidth.matches && (!cfg.requireTouch || mqHover.matches);
}
function blockHover(e) {
if (isMobile() && cfg.disableExpandOnMobile) e.stopPropagation();
}
function getLinkData(panel) {
const anchor = panel.querySelector('a.wm-panel-link') || panel.querySelector('a.wm-button');
if (!anchor) return null;
const href = anchor.getAttribute('href');
if (!href || href === '#') return null;
return {href: href, blank: anchor.getAttribute('target') === '_blank'};
}
function handleClick(e) {
if (!isMobile()) return;
if (e.target.closest('a')) return;
const panel = e.target.closest('.wm-panel');
if (!panel) return;
const data = getLinkData(panel);
if (!data) return;
e.preventDefault();
e.stopPropagation();
if (data.blank) {
window.open(data.href, '_blank', 'noopener');
} else {
window.location.href = data.href;
}
}
function syncState(root) {
const mobile = isMobile();
root.classList.toggle('wm-ep-mobile', mobile);
if (mobile && cfg.disableExpandOnMobile) {
root.querySelectorAll('.wm-panel').forEach(function (panel) {
panel.classList.remove('panel-active');
panel.classList.remove('panel-inactive');
});
}
}
function initContainer(el) {
if (!el.dataset.wmEpMobileDone) {
el.dataset.wmEpMobileDone = 'true';
el.addEventListener('mouseover', blockHover, true);
el.addEventListener('mouseout', blockHover, true);
el.addEventListener('click', handleClick, true);
}
syncState(el);
}
function initAll() {
document.querySelectorAll('[data-wm-plugin="expanding-panels"]').forEach(initContainer);
}
let resizeTimer;
window.addEventListener('resize', function () {
clearTimeout(resizeTimer);
resizeTimer = setTimeout(initAll, 150);
});
initAll();
window.addEventListener('load', initAll);
setTimeout(initAll, 500);
setTimeout(initAll, 1500);
window.addEventListener('mercury:load', initAll);
})();
</script>