functions.js 1.6 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950
  1. /* global screenReaderText */
  2. /**
  3. * Theme functions file
  4. *
  5. * Contains handlers for navigation and widget area.
  6. */
  7. ( function( $ ) {
  8. $( 'html' ).removeClass( 'no-js' );
  9. // Add dropdown toggle that display child menu items.
  10. $( '.main-navigation .page_item_has_children > a, .main-navigation .menu-item-has-children > a' ).append( '<button class="dropdown-toggle" aria-expanded="false">' + screenReaderText.expand + '</button>' );
  11. $( '.dropdown-toggle' ).click( function( e ) {
  12. var _this = $( this );
  13. e.preventDefault();
  14. _this.toggleClass( 'toggle-on' );
  15. _this.parent().next( '.children, .sub-menu' ).toggleClass( 'toggled-on' );
  16. _this.attr( 'aria-expanded', _this.attr( 'aria-expanded' ) === 'false' ? 'true' : 'false' );
  17. _this.html( _this.html() === screenReaderText.expand ? screenReaderText.collapse : screenReaderText.expand );
  18. } );
  19. // Enable menu toggle for small screens.
  20. ( function() {
  21. var secondary = $( '#secondary' ), button, menu, widgets, social;
  22. if ( ! secondary ) {
  23. return;
  24. }
  25. button = $( '.site-branding' ).find( '.secondary-toggle' );
  26. if ( ! button ) {
  27. return;
  28. }
  29. // Hide button if there is no widgets and menu is missing or empty.
  30. menu = secondary.find( '.nav-menu' );
  31. widgets = secondary.find( '#widget-area' );
  32. social = secondary.find( '#social-navigation' );
  33. if ( ! widgets.length && ! social.length && ( ! menu || ! menu.children().length ) ) {
  34. button.hide();
  35. return;
  36. }
  37. button.on( 'click.twentyfifteen', function() {
  38. secondary.toggleClass( 'toggled-on' );
  39. secondary.trigger( 'resize' );
  40. $( this ).toggleClass( 'toggled-on' );
  41. } );
  42. } )();
  43. } )( jQuery );