updated plugin GP Premium version 2.2.0

wp-content/plugins/gp-premium/menu-plus/functions/css/offside.css

@@ -16,6 +16,7 @@
     z-index: 9999;
     overflow: auto;
     -webkit-overflow-scrolling: touch; /* enables momentum scrolling in iOS overflow elements */
+	visibility: hidden;
 }
 
 /* Left off-canvas elements default status: out of the page */

wp-content/plugins/gp-premium/menu-plus/functions/generate-menu-plus.php

@@ -800,7 +800,7 @@ if ( ! function_exists( 'generate_menu_plus_enqueue_js' ) ) {
 		$suffix = defined( 'SCRIPT_DEBUG' ) && SCRIPT_DEBUG ? '' : '.min';
 
 		if ( ( 'false' !== $settings['sticky_menu'] ) || ( 'enable' === $settings['mobile_header'] && 'enable' === $settings['mobile_header_sticky'] ) ) {
-			wp_enqueue_script( 'generate-sticky', plugin_dir_url( __FILE__ ) . "js/sticky{$suffix}.js", array( 'jquery' ), GENERATE_MENU_PLUS_VERSION, true );
+			wp_enqueue_script( 'generate-sticky', plugin_dir_url( __FILE__ ) . "js/sticky{$suffix}.js", array( 'jquery-core' ), GENERATE_MENU_PLUS_VERSION, true );
 		}
 
 		if ( 'false' !== $settings['slideout_menu'] ) {
@@ -1145,7 +1145,7 @@ if ( ! function_exists( 'generate_slideout_navigation' ) ) {
 		}
 
 		?>
-		<nav id="generate-slideout-menu" class="main-navigation slideout-navigation<?php echo esc_attr( $overlay ); ?>" <?php echo $microdata; // phpcs:ignore -- No escaping needed. ?> style="display: none;">
+		<nav id="generate-slideout-menu" class="main-navigation slideout-navigation<?php echo esc_attr( $overlay ); ?>" <?php echo $microdata; // phpcs:ignore -- No escaping needed. ?> style="display: none;" aria-hidden>
 			<div class="inside-navigation grid-container grid-parent">
 				<?php
 				do_action( 'generate_inside_slideout_navigation' );
@@ -2289,3 +2289,26 @@ function generate_menu_plus_typography_selectors( $selector ) {
 
 	return $selector;
 }
+
+add_filter( 'generate_parse_attr', 'generate_set_off_canvas_toggle_attributes', 20, 2 );
+/**
+ * Add attributes to our menu-toggle element when using the Off Canvas panel.
+ *
+ * @since 2.2.0
+ * @param array  $attributes The current attributes.
+ * @param string $context The context in which attributes are applied.
+ */
+function generate_set_off_canvas_toggle_attributes( $attributes, $context ) {
+	if ( 'menu-toggle' === $context ) {
+		$settings = wp_parse_args(
+			get_option( 'generate_menu_plus_settings', array() ),
+			generate_menu_plus_get_defaults()
+		);
+
+		if ( 'mobile' === $settings['slideout_menu'] || 'both' === $settings['slideout_menu'] ) {
+			$attributes['aria-controls'] = 'generate-slideout-menu';
+		}
+	}
+
+	return $attributes;
+}

wp-content/plugins/gp-premium/menu-plus/functions/js/offside.js

@@ -505,22 +505,35 @@ var generateOffside = offside( '.slideout-navigation', {
     slidingElementsSelector:'#slideout-container',
     buttonsSelector: '.slideout-mobile .main-navigation .menu-toggle, .slideout-both .main-navigation .menu-toggle, .slideout-both .slideout-toggle, .slideout-desktop .slideout-toggle',
 	slidingSide: offSide.side,
+	beforeOpen: function() {
+		// Turn on visibility so we can transition nicely.
+		document.querySelector( '.slideout-navigation' ).style.visibility = 'visible';
+	},
 	afterOpen: function() {
 		document.documentElement.classList.add( 'slide-opened' );
 		document.body.classList.add( 'slide-opened' );
 
-		// Get the first link so we can focus on it.
-		var slideoutMenu = document.querySelector( 'ul.slideout-menu' );
+		if ( document.body.classList.contains( 'dropdown-hover' ) ) {
+			var dropdownItems = document.querySelector( '.slideout-navigation' ).querySelectorAll( 'li.menu-item-has-children' );
+			for ( var i = 0; i < dropdownItems.length; i++ ) {
+				var spanToggle = dropdownItems[i].querySelector( 'span.dropdown-menu-toggle' );
 
-		if ( slideoutMenu ) {
-			var firstLink = slideoutMenu.firstChild.querySelector( 'a' );
-
-			if ( firstLink ) {
-				setTimeout( function() {
-					firstLink.focus();
-				}, 200 );
+				if ( spanToggle ) {
+					spanToggle.setAttribute( 'tabindex', 0 );
+					spanToggle.setAttribute( 'role', 'button' );
+					spanToggle.setAttribute( 'aria-expanded', true );
+				}
 			}
 		}
+
+		// Focus the first focusable element.
+		var focusable = document.querySelector( '.slideout-navigation' ).querySelectorAll( 'button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])' );
+
+		if ( focusable ) {
+			setTimeout( function() {
+				focusable[0].focus();
+			}, 200 );
+		}
 	},
 	afterClose: function() {
 		var body = document.body,
@@ -540,7 +553,7 @@ var generateOffside = offside( '.slideout-navigation', {
 		}
 
 		if ( body.classList.contains( 'dropdown-hover' ) ) {
-			var dropdownItems = document.querySelector( '.main-navigation:not(.slideout-navigation)' ).querySelectorAll( 'li.menu-item-has-children' );
+			var dropdownItems = document.querySelector( '.main-navigation:not(.slideout-navigation):not(.mobile-menu-control-wrapper)' ).querySelectorAll( 'li.menu-item-has-children' );
 			for ( var i = 0; i < dropdownItems.length; i++ ) {
 				var spanToggle = dropdownItems[i].querySelector( 'span.dropdown-menu-toggle' );
 
@@ -551,6 +564,30 @@ var generateOffside = offside( '.slideout-navigation', {
 				}
 			}
 		}
+
+		// Turn off visibility.
+		setTimeout( function() {
+			document.querySelector( '.slideout-navigation:not(.is-open)' ).style.visibility = '';
+		}, 500 );
+
+		// Focus our slideout toggle.
+		if ( window.document.documentElement.clientWidth <= 768 ) {
+			if ( body.classList.contains( 'slideout-mobile' ) || body.classList.contains( 'slideout-both' ) ) {
+				document.querySelectorAll( '.main-navigation:not(.slideout-navigation)' ).forEach( function( navigation ) {
+					if ( navigation && navigation.style.display !== 'none' ) {
+						navigation.querySelector( '.menu-toggle' ).focus();
+					}
+				} );
+			}
+		} else {
+			if ( body.classList.contains( 'slideout-desktop' ) || body.classList.contains( 'slideout-both' ) ) {
+				document.querySelectorAll( '.main-navigation:not(.slideout-navigation)' ).forEach( function( navigation ) {
+					if ( navigation && navigation.style.display !== 'none' ) {
+						navigation.querySelector( '.slideout-toggle a' ).focus();
+					}
+				} );
+			}
+		}
 	}
 } );
 
@@ -588,20 +625,9 @@ for ( var i = 0; i < slideoutLinks.length; i++ ) {
 document.addEventListener( 'keyup', function( e ) {
 	if ( document.body.classList.contains( 'slide-opened' ) ) {
 		e = e || window.event;
+
 		if ( e.keyCode == 27 ) {
 			generateOffside.close();
-			var body = document.body;
-
-			if ( window.document.documentElement.clientWidth <= 768 ) {
-				if ( body.classList.contains( 'slideout-mobile' ) || body.classList.contains( 'slideout-both' ) ) {
-					document.querySelector( '.main-navigation .menu-toggle' ).focus();
-				}
-			} else {
-				if ( body.classList.contains( 'slideout-desktop' ) || body.classList.contains( 'slideout-both' ) ) {
-					document.querySelector( '.slideout-toggle a' ).focus();
-					document.activeElement.blur();
-				}
-			}
 		}
 	}
 } );