1/** 2 * File navigation.js. 3 * 4 * Handles toggling the navigation menu for small screens and enables TAB key 5 * navigation support for dropdown menus. 6 */ 7( function() { 8 const siteNavigation = document.getElementById( 'site-navigation' ); 9 10 11 12 // Return early if the navigation don't exist. 13 if ( ! siteNavigation ) { 14 return; 15 } 16 17 const menu = siteNavigation.getElementsByTagName( 'ul' )[ 0 ]; 18 19 if ( ! menu.classList.contains( 'nav-menu' ) ) { 20 menu.classList.add( 'nav-menu' ); 21 } 22 23 // Get all the link elements within the menu. 24 const links = menu.getElementsByTagName( 'a' ); 25 26 // Get all the link elements with children within the menu. 27 const linksWithChildren = menu.querySelectorAll( '.menu-item-has-children > a, .page_item_has_children > a' ); 28 29 // Toggle focus each time a menu link is focused or blurred. 30 for ( const link of links ) { 31 link.addEventListener( 'focus', toggleFocus, true ); 32 link.addEventListener( 'blur', toggleFocus, true ); 33 } 34 35 // Toggle focus each time a menu link with children receive a touch event. 36 for ( const link of linksWithChildren ) { 37 link.addEventListener( 'touchstart', toggleFocus, false ); 38 } 39 40 /** 41 * Sets or removes .focus class on an element. 42 */ 43 function toggleFocus() { 44 if ( event.type === 'focus' || event.type === 'blur' ) { 45 let self = this; 46 // Move up through the ancestors of the current link until we hit .nav-menu. 47 while ( ! self.classList.contains( 'nav-menu' ) ) { 48 // On li elements toggle the class .focus. 49 if ( 'li' === self.tagName.toLowerCase() ) { 50 51 /* if ( self.classList.contains( 'menu-item-has-children' ) ) { 52 self.classList.add( 'active-parent' ); 53 } 54*/ 55 self.classList.toggle( 'focus' ); 56 } 57 self = self.parentNode; 58 } 59 } 60 61 if ( event.type === 'touchstart' ) { 62 const menuItem = this.parentNode; 63 event.preventDefault(); 64 for ( const link of menuItem.parentNode.children ) { 65 if ( menuItem !== link ) { 66 link.classList.remove( 'focus' ); 67 } 68 } 69 menuItem.classList.toggle( 'focus' ); 70 } 71 } 72}() );
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.