1/** 2 * File navigation.js. 3 * 4 * Handles toggling the navigation menu for small screens and 5 * supports for dropdown menus. 6 */ 7( function( $ ) { 8 //var body, masthead, menuToggle, siteNavigation, socialNavigation, siteHeaderMenu, resizeTimer; 9 var masthead, menuToggle, siteNavigation, siteHeaderMenu; 10 11 function initMainNavigation( container ) { 12 13 // Add dropdown toggle that displays child menu items. 14 var dropdownToggle = $( '<button />', { 15 'class': 'dropdown-toggle', 16 'aria-expanded': false 17 } ).append( $( '<span />', { 18 'class': 'screen-reader-text', 19 //text: screenReaderText.expand 20 } ) ); 21 22 container.find( '.menu-item-has-children > a' ).after( dropdownToggle ); 23 24 // Toggle buttons and submenu items with active children menu items. 25 container.find( '.current-menu-ancestor > button' ).addClass( 'toggled-on' ); 26 container.find( '.current-menu-ancestor > .sub-menu' ).addClass( 'toggled-on' ); 27 28 // Add menu items with submenus to aria-haspopup="true". 29 container.find( '.menu-item-has-children' ).attr( 'aria-haspopup', 'true' ); 30 31 container.find( '.dropdown-toggle' ).click( function( e ) { 32 var _this = $( this ), 33 screenReaderSpan = _this.find( '.screen-reader-text' ); 34 35 e.preventDefault(); 36 _this.toggleClass( 'toggled-on' ); 37 _this.next( '.children, .sub-menu' ).toggleClass( 'toggled-on' ); 38 39 // jscs:disable 40 _this.attr( 'aria-expanded', _this.attr( 'aria-expanded' ) === 'false' ? 'true' : 'false' ); 41 // jscs:enable 42 //screenReaderSpan.text( screenReaderSpan.text() === screenReaderText.expand ? screenReaderText.collapse : screenReaderText.expand ); 43 } ); 44 } 45 initMainNavigation( $( '.main-navigation' ) ); 46 47 masthead = $( '#masthead' ); 48 menuToggle = masthead.find( '#menu-toggle' ); 49 siteHeaderMenu = masthead.find( '#site-header-menu' ); 50 siteNavigation = masthead.find( '#site-navigation' ); 51 52 // Enable menuToggle. 53 ( function() { 54 55 // Return early if menuToggle is missing. 56 if ( ! menuToggle.length ) { 57 return; 58 } 59 60 // Add an initial values for the attribute. 61 menuToggle.add( siteNavigation ).attr( 'aria-expanded', 'false' ); 62 63 menuToggle.on( 'click.imagery', function() { 64 $( this ).add( siteHeaderMenu ).toggleClass( 'toggled-on' ); 65 66 // jscs:disable 67 $( this ).add( siteNavigation ).attr( 'aria-expanded', $( this ).add( siteNavigation ).attr( 'aria-expanded' ) === 'false' ? 'true' : 'false' ); 68 // jscs:enable 69 } ); 70 } )(); 71 72 // Fix sub-menus for touch devices and better focus for hidden submenu items for accessibility. 73 ( function() { 74 if ( ! siteNavigation.length || ! siteNavigation.children().length ) { 75 return; 76 } 77 78 // Toggle `focus` class to allow submenu access on tablets. 79 function toggleFocusClassTouchScreen() { 80 if ( window.innerWidth >= 910 ) { 81 $( document.body ).on( 'touchstart.imagery', function( e ) { 82 if ( ! $( e.target ).closest( '.main-navigation li' ).length ) { 83 $( '.main-navigation li' ).removeClass( 'focus' ); 84 } 85 } ); 86 siteNavigation.find( '.menu-item-has-children > a' ).on( 'touchstart.imagery', function( e ) { 87 var el = $( this ).parent( 'li' ); 88 89 if ( ! el.hasClass( 'focus' ) ) { 90 e.preventDefault(); 91 el.toggleClass( 'focus' ); 92 el.siblings( '.focus' ).removeClass( 'focus' ); 93 } 94 } ); 95 } else { 96 siteNavigation.find( '.menu-item-has-children > a' ).unbind( 'touchstart.imagery' ); 97 } 98 } 99 100 if ( 'ontouchstart' in window ) { 101 $( window ).on( 'resize.imagery', toggleFocusClassTouchScreen ); 102 toggleFocusClassTouchScreen(); 103 } 104 105 siteNavigation.find( 'a' ).on( 'focus.imagery blur.imagery', function() { 106 $( this ).parents( '.menu-item' ).toggleClass( 'focus' ); 107 } ); 108 } )(); 109 110 // Add the default ARIA attributes for the menu toggle and the navigations. 111 function onResizeARIA() { 112 if ( window.innerWidth < 910 ) { 113 if ( menuToggle.hasClass( 'toggled-on' ) ) { 114 menuToggle.attr( 'aria-expanded', 'true' ); 115 } else { 116 menuToggle.attr( 'aria-expanded', 'false' ); 117 } 118 119 if ( siteHeaderMenu.hasClass( 'toggled-on' ) ) { 120 siteNavigation.attr( 'aria-expanded', 'true' ); 121 } else { 122 siteNavigation.attr( 'aria-expanded', 'false' ); 123 } 124 125 menuToggle.attr( 'aria-controls', 'site-navigation' ); 126 } else { 127 menuToggle.removeAttr( 'aria-expanded' ); 128 siteNavigation.removeAttr( 'aria-expanded' ); 129 menuToggle.removeAttr( 'aria-controls' ); 130 } 131 } 132})(jQuery); // end jQuery
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.