[Summary view] [Print] [Text view]

   1  /**
   2   * Handles toggling the navigation menu for small screens and
   3   * accessibility for submenu items.
   4   */
   5  ( function() {
   6      var nav = document.getElementById( 'site-navigation' ), button, menu;
   7      if ( ! nav ) {
   8          return;
   9      }
  10  
  11      button = nav.getElementsByTagName( 'button' )[0];
  12      menu   = nav.getElementsByTagName( 'ul' )[0];
  13      if ( ! button ) {
  14          return;
  15      }
  16  
  17      // Hide button if menu is missing or empty.
  18      if ( ! menu || ! menu.childNodes.length ) {
  19          button.style.display = 'none';
  20          return;
  21      }
  22  
  23      button.onclick = function() {
  24          if ( -1 === menu.className.indexOf( 'nav-menu' ) ) {
  25              menu.className = 'nav-menu';
  26          }
  27  
  28          if ( -1 !== button.className.indexOf( 'toggled-on' ) ) {
  29              button.className = button.className.replace( ' toggled-on', '' );
  30              menu.className = menu.className.replace( ' toggled-on', '' );
  31          } else {
  32              button.className += ' toggled-on';
  33              menu.className += ' toggled-on';
  34          }
  35      };
  36  } )();
  37  
  38  // Better focus for hidden submenu items for accessibility.
  39  ( function( $ ) {
  40      $( '.main-navigation' ).find( 'a' ).on( 'focus.twentytwelve blur.twentytwelve', function() {
  41          $( this ).parents( '.menu-item, .page_item' ).toggleClass( 'focus' );
  42      } );
  43  
  44    if ( 'ontouchstart' in window ) {
  45      $('body').on( 'touchstart.twentytwelve',  '.menu-item-has-children > a, .page_item_has_children > a', function( e ) {
  46        var el = $( this ).parent( 'li' );
  47  
  48        if ( ! el.hasClass( 'focus' ) ) {
  49          e.preventDefault();
  50          el.toggleClass( 'focus' );
  51          el.siblings( '.focus').removeClass( 'focus' );
  52        }
  53      } );
  54    }
  55  } )( jQuery );