<?php
/**
 * Template part for displaying the hamburger / off-canvas menu.
 *
 * @package Eronex
 * @since 0.0.1
 */

if ( ! defined( 'ABSPATH' ) ) {
	exit;
}

$home_url   = home_url( '/' );
$layout     = eronex_option( 'eronex_hamburger_style', '1' );
$logo       = eronex_option( 'eronex_hamburger_logo', '' );
$typo       = eronex_option( 'eronex_hamburger_menu_font_family', 'primary' );
$menu_class = 'eronex-hamburger-menu';
$menu_class .= 'primary' === $typo ? ' eronex-main-font' : ' eronex-alt-font';

?>
<div class="eronex-hamburger-wrapper eronex-hamburger-layout-<?php echo esc_attr( $layout ); ?>" aria-hidden="true" inert>
	<div class="eronex-hamburger-overlay"></div>
	<div class="eronex-hamburger-menu-wrapper" id="eronex-hamburger-menu" role="dialog" aria-modal="true" aria-label="<?php echo esc_attr__( 'Menu', 'eronex' ); ?>">
		<button class="eronex-hamburger-close-btn" type="button" aria-label="<?php echo esc_attr__( 'Close menu', 'eronex' ); ?>">
			<i class="hi hi-x-mark" aria-hidden="true"></i>
		</button>
		<?php if ( ! empty( $logo ) ) { ?>
		<div class="eronex-hamburger-header">
			<a rel="home" href="<?php echo esc_url( $home_url ); ?>">
				<img class="eronex-hamburger-logo" src="<?php echo esc_url( $logo ); ?>" alt="<?php echo esc_attr( get_bloginfo( 'name' ) ); ?>"/>
			</a>
		</div>
		<?php } ?>
		<div class="eronex-hamburger-body">
			<?php
			wp_nav_menu(
				array(
					'theme_location'  => 'hamburger',
					'container'       => 'nav',
					'container_class' => 'eronex-hamburger-nav',
					'container_id'    => 'eronex-hamburger-nav',
					'menu_class'      => $menu_class,
					'fallback_cb'     => 'eronex_nav_menu_fallback',
					'items_wrap'      => '<ul id="%1$s" class="%2$s">%3$s</ul>',
					'echo'            => true,
					'walker'          => new Eronex_Walker_Nav_Menu(),
				)
			);
			?>
		</div>
	</div>
</div>
