/** * HVAC Navigation Enhanced JavaScript * Handles mobile menu toggle and improves accessibility * * @version 2.0.0 * @since 2025-08-21 */ jQuery(document).ready(function($) { 'use strict'; // Cache DOM elements const $hamburger = $('.hvac-hamburger-menu'); const $menu = $('.hvac-trainer-menu'); const $menuItems = $('.hvac-trainer-menu .menu-item-has-children'); const $body = $('body'); // Mobile menu toggle $hamburger.on('click', function(e) { e.preventDefault(); e.stopPropagation(); $(this).toggleClass('active'); $menu.toggleClass('active'); $body.toggleClass('menu-open'); // Update aria attributes for accessibility const isOpen = $menu.hasClass('active'); $(this).attr('aria-expanded', isOpen); $menu.attr('aria-hidden', !isOpen); // Trap focus when menu is open if (isOpen) { $menu.find('a:first').focus(); } }); // Mobile dropdown toggle if (window.innerWidth <= 992) { $menuItems.each(function() { const $item = $(this); const $link = $item.children('a'); // Add click handler to parent link on mobile $link.on('click', function(e) { // If it has children, prevent navigation and toggle menu if ($item.hasClass('menu-item-has-children')) { e.preventDefault(); e.stopPropagation(); // Close other open menus $menuItems.not($item).removeClass('menu-open'); // Toggle this menu $item.toggleClass('menu-open'); // Update aria attributes const isOpen = $item.hasClass('menu-open'); $(this).attr('aria-expanded', isOpen); $item.children('.sub-menu').attr('aria-hidden', !isOpen); } }); }); } // Desktop dropdown enhancement with delay let hoverTimeout; if (window.innerWidth > 992) { $menuItems.on('mouseenter', function() { const $this = $(this); clearTimeout(hoverTimeout); // Close other dropdowns $menuItems.not($this).removeClass('menu-open'); // Open this dropdown with slight delay hoverTimeout = setTimeout(function() { $this.addClass('menu-open'); }, 100); }).on('mouseleave', function() { const $this = $(this); clearTimeout(hoverTimeout); // Close dropdown with delay hoverTimeout = setTimeout(function() { $this.removeClass('menu-open'); }, 300); }); // Keep dropdown open when hovering over submenu $('.hvac-trainer-menu .sub-menu').on('mouseenter', function() { clearTimeout(hoverTimeout); }).on('mouseleave', function() { const $parent = $(this).closest('.menu-item-has-children'); hoverTimeout = setTimeout(function() { $parent.removeClass('menu-open'); }, 300); }); } // Keyboard navigation $menu.on('keydown', 'a', function(e) { const $currentItem = $(this).parent(); let $targetItem; switch(e.keyCode) { case 37: // Left arrow $targetItem = $currentItem.prev('.menu-item'); if ($targetItem.length) { $targetItem.children('a').focus(); e.preventDefault(); } break; case 39: // Right arrow $targetItem = $currentItem.next('.menu-item'); if ($targetItem.length) { $targetItem.children('a').focus(); e.preventDefault(); } break; case 40: // Down arrow if ($currentItem.hasClass('menu-item-has-children')) { $currentItem.addClass('menu-open'); $currentItem.find('.sub-menu a:first').focus(); e.preventDefault(); } break; case 38: // Up arrow if ($currentItem.closest('.sub-menu').length) { const $parentMenu = $currentItem.closest('.sub-menu').parent(); $parentMenu.children('a').focus(); $parentMenu.removeClass('menu-open'); e.preventDefault(); } break; case 27: // Escape if ($currentItem.closest('.sub-menu').length) { const $parentMenu = $currentItem.closest('.sub-menu').parent(); $parentMenu.children('a').focus(); $parentMenu.removeClass('menu-open'); } else if ($menu.hasClass('active')) { $hamburger.click(); } e.preventDefault(); break; case 13: // Enter case 32: // Space if ($currentItem.hasClass('menu-item-has-children') && !$(this).attr('href')) { $currentItem.toggleClass('menu-open'); e.preventDefault(); } break; } }); // Close mobile menu when clicking outside $(document).on('click', function(e) { if (!$(e.target).closest('.hvac-trainer-menu-wrapper').length) { if ($menu.hasClass('active')) { $hamburger.removeClass('active'); $menu.removeClass('active'); $body.removeClass('menu-open'); } } }); // Close mobile menu on escape key $(document).on('keydown', function(e) { if (e.keyCode === 27 && $menu.hasClass('active')) { $hamburger.click(); } }); // Handle window resize let resizeTimer; $(window).on('resize', function() { clearTimeout(resizeTimer); resizeTimer = setTimeout(function() { if (window.innerWidth > 992) { // Reset mobile menu state on desktop $hamburger.removeClass('active'); $menu.removeClass('active'); $body.removeClass('menu-open'); $menuItems.removeClass('menu-open'); } }, 250); }); // Smooth scroll for anchor links $menu.on('click', 'a[href^="#"]', function(e) { const target = $(this.getAttribute('href')); if (target.length) { e.preventDefault(); $('html, body').animate({ scrollTop: target.offset().top - 100 }, 500); // Close mobile menu after clicking if ($menu.hasClass('active')) { $hamburger.click(); } } }); // Add loaded class for CSS animations setTimeout(function() { $('.hvac-trainer-menu-wrapper').addClass('loaded'); }, 100); });