VCM Logo

Victorious Christian

Montessori

VCM Logo

School News

Stay informed with the latest news and updates from VCM

Latest News

No News Available

There are currently no news articles available. Please check back later for the latest school news and updates.

Stay Updated

Never miss important school news and announcements

return; } console.log(' Menu elements found'); // Ensure hamburger button is clickable hamburgerBtn.style.pointerEvents = 'auto'; hamburgerBtn.style.zIndex = '1000'; hamburgerBtn.style.position = 'relative'; // State management let isAnimating = false; let currentOpenDropdown = null; /** * Open menu with staggered animations */ function openMenu() { if (isAnimating || !isMobile()) { console.log(' Cannot open menu:', { isAnimating, isMobile: isMobile() }); return; } isAnimating = true; console.log(' Opening menu'); // Add active classes hamburgerBtn.classList.add('active', 'menu-open'); menuOverlay.classList.add('active'); slideMenu.classList.add('active'); body.classList.add('menu-open'); // Allow animations to complete setTimeout(() => { isAnimating = false; }, 600); } /** * Close menu and cleanup */ function closeMenu() { if (isAnimating) return; isAnimating = true; console.log(' Closing menu'); // Remove active classes hamburgerBtn.classList.remove('active', 'menu-open'); menuOverlay.classList.remove('active'); slideMenu.classList.remove('active'); body.classList.remove('menu-open'); // Close all dropdowns closeAllDropdowns(); // Allow animations to complete setTimeout(() => { isAnimating = false; }, 400); } /** * Toggle menu state */ function toggleMenu() { if (!isMobile()) return; const isActive = slideMenu.classList.contains('active'); if (isActive) { closeMenu(); } else { openMenu(); } } /** * Close all open dropdowns */ function closeAllDropdowns() { const dropdowns = document.querySelectorAll('.menu-dropdown'); dropdowns.forEach(dropdown => { dropdown.classList.remove('active'); }); currentOpenDropdown = null; } // ===== EVENT LISTENERS ===== /** * Hamburger button click */ hamburgerBtn.addEventListener('click', function(e) { e.preventDefault(); e.stopPropagation(); console.log(' Hamburger clicked'); toggleMenu(); }); // Add additional event listeners for better mobile compatibility hamburgerBtn.addEventListener('touchstart', function(e) { e.preventDefault(); }, { passive: false }); hamburgerBtn.addEventListener('touchend', function(e) { e.preventDefault(); e.stopPropagation(); if (isMobile()) { toggleMenu(); } }, { passive: false }); /** * Close button click */ if (closeBtn) { closeBtn.addEventListener('click', function(e) { e.preventDefault(); e.stopPropagation(); closeMenu(); }); } /** * Overlay click to close */ menuOverlay.addEventListener('click', function(e) { if (e.target === menuOverlay) { closeMenu(); } }); /** * Dropdown functionality */ const dropdownBtns = document.querySelectorAll('.menu-dropdown-btn'); dropdownBtns.forEach(btn => { btn.addEventListener('click', function(e) { e.preventDefault(); e.stopPropagation(); const dropdown = this.closest('.menu-dropdown'); const isCurrentlyActive = dropdown.classList.contains('active'); // Close all other dropdowns first if (!isCurrentlyActive) { closeAllDropdowns(); } // Toggle current dropdown dropdown.classList.toggle('active'); // Update current open dropdown reference if (dropdown.classList.contains('active')) { currentOpenDropdown = dropdown; } else { currentOpenDropdown = null; } }); }); /** * Keyboard navigation */ document.addEventListener('keydown', function(e) { const isActive = slideMenu.classList.contains('active'); if (e.key === 'Escape' && isActive) { closeMenu(); } }); /** * Responsive behavior - clean up on desktop */ let resizeTimeout; const handleResponsiveResize = () => { clearTimeout(resizeTimeout); resizeTimeout = setTimeout(() => { const currentWidth = window.innerWidth; if (currentWidth >= 768) { // Desktop mode - clean up mobile menu state const isActive = slideMenu.classList.contains('active'); if (isActive) { closeMenu(); } // Ensure complete cleanup for desktop body.classList.remove('menu-open'); hamburgerBtn.classList.remove('active', 'menu-open'); menuOverlay.classList.remove('active'); slideMenu.classList.remove('active'); closeAllDropdowns(); } }, 150); }; // Resize handling window.addEventListener('resize', handleResponsiveResize, { passive: true }); /** * Menu item clicks - close menu after navigation */ const menuLinks = document.querySelectorAll('.menu-item[href], .sub-menu-item[href]'); menuLinks.forEach(link => { link.addEventListener('click', function() { // Close menu with delay setTimeout(() => { closeMenu(); }, 150); }); }); /** * Prevent menu from closing when clicking inside */ slideMenu.addEventListener('click', function(e) { e.stopPropagation(); }); console.log(' Inline Mobile Menu setup complete (no scroll animations)'); });