(function () { 'use strict'; const MAP_URL = 'https://safarihq.computersprings.com/wp-content/uploads/2026/09/safarihq-east-africa-map-final.svg'; const destinations = { tanzania: '#country-tanzania', kenya: '#country-kenya', uganda: '#country-uganda', rwanda: '#country-rwanda', zanzibar: '#marker-zanzibar', kilimanjaro: '#marker-kilimanjaro' }; /* * Find the map currently rendered * inside the JetMenu mega menu. */ function getMapContainer() { return document.getElementById('safarihq-map'); } /* * Highlight a destination. */ function activateDestination(name) { const container = getMapContainer(); if (!container) { return; } const svg = container.querySelector('svg'); if (!svg) { return; } /* Remove all previous active states */ svg.querySelectorAll('.is-active').forEach(function (element) { element.classList.remove('is-active'); }); const selector = destinations[name]; if (!selector) { return; } const target = svg.querySelector(selector); if (!target) { console.warn( 'SafariHQ destination not found:', selector ); return; } target.classList.add('is-active'); } /* * Detect which destination is being hovered. */ function getDestinationFromElement(element) { if (!element) { return null; } const names = [ 'tanzania', 'kenya', 'uganda', 'rwanda', 'zanzibar', 'kilimanjaro' ]; let current = element; while ( current && current !== document.body ) { if (current.classList) { for (const name of names) { if ( current.classList.contains( 'destination-' + name ) ) { return name; } } } current = current.parentElement; } return null; } /* * Global hover handler. * * This is deliberately attached to * document because JetMenu creates * its mega content dynamically. */ function setupHoverHandler() { if (window.safariHQMapHoverReady) { return; } window.safariHQMapHoverReady = true; document.addEventListener( 'mouseover', function (event) { const name = getDestinationFromElement( event.target ); if (!name) { return; } activateDestination(name); } ); } /* * Load the SVG into the Elementor * HTML widget. */ function loadMap() { const container = getMapContainer(); if (!container) { return; } /* * Don't load the SVG repeatedly. */ if ( container.dataset.safarihqLoaded === 'true' ) { activateDestination('tanzania'); return; } /* * Prevent multiple simultaneous requests. */ if ( container.dataset.safarihqLoading === 'true' ) { return; } container.dataset.safarihqLoading = 'true'; fetch(MAP_URL) .then(function (response) { if (!response.ok) { throw new Error( 'SafariHQ map could not be loaded.' ); } return response.text(); }) .then(function (svgText) { container.innerHTML = svgText; const svg = container.querySelector('svg'); if (!svg) { throw new Error( 'SafariHQ SVG element was not found.' ); } /* * Let our CSS control the dimensions. */ svg.removeAttribute('width'); svg.removeAttribute('height'); container.dataset.safarihqLoaded = 'true'; container.dataset.safarihqLoading = 'false'; /* * Tanzania is the default state. */ activateDestination('tanzania'); }) .catch(function (error) { container.dataset.safarihqLoading = 'false'; console.error( 'SafariHQ Destination Map:', error ); }); } /* * Main initialization. */ function initializeSafariHQMap() { setupHoverHandler(); loadMap(); } /* * Initial page load. */ if ( document.readyState === 'loading' ) { document.addEventListener( 'DOMContentLoaded', initializeSafariHQMap ); } else { initializeSafariHQMap(); } /* * Watch for JetMenu inserting the * mega-menu content dynamically. */ const observer = new MutationObserver(function () { if ( document.getElementById( 'safarihq-map' ) ) { loadMap(); } }); observer.observe( document.body, { childList: true, subtree: true } ); })();