<?php
/**
 * Menu template
 *
 * @var \Ves\Megamenu\Block\Menu $block
 */
?>
<?php
if ($menu = $this->getMenu()) {

	$html           = $classes = '';
	$data           = $this->helper("Ves\Megamenu\Helper\Data");
	$mobileTemplate = $menu->getMobileTemplate();
	$mobile_menu 	= false;
	//If active mobile menu alias will replace current desktop menu to mobile menu
	if ($mobileTemplate == 2 && $menu->getMobileMenuAlias() && $this->getMobileDetect()->isMobile()) {
		$mobile_menu_alias = $menu->getMobileMenuAlias();
		$old_menu = $menu;
		$menu = $block->getMenuProfile(0, $mobile_menu_alias);
		if($menu) {
			$mobile_menu = true;
		} else {
			$menu = $old_menu;
		}
	}

	$html = "";
    $menuItems  = $menu->getData('menuItems');
    $structure  = $block->decodeJson($menu->getStructure());
    $categories = [];
    foreach ($menuItems as $item) {
        if (isset($item['link_type']) && $item['link_type'] == 'category_link' && isset($item['category']) && !in_array($item['category'], $categories)) {
            $categories[] = $item['category'];
        }
    }
    $data->setMenuCategories($categories);
    if (is_array($structure)) {
        $i = 1;
        foreach ($structure as $k => $v) {
            $itemData = $data->renderMenuItemData($v, [], $menuItems);
            $html .= $data->drawItem($itemData, 0, 1, true, $i);
            $i++;
        }
    }

	$mobileTemplate = $menu->getMobileTemplate();
	if ($mobileTemplate == 0) {
		$classes = 'ves-offcanvas';
	} else if ($mobileTemplate == 1) {
		$classes = 'ves-maccordion';
	} else if ($mobileTemplate == 2) {
		$classes = 'ves-mcustommenu';
	} else if ($mobileTemplate == 3) {
		$classes = 'ves-mdrilldown';
	}

	$desktopTemplate = $menu->getDesktopTemplate();
	if ($desktopTemplate == 'vertical-left' ||  $desktopTemplate == 'vertical-right') {
		$classes .= ' ves-vertical';
	}
	$classes .= ' ves-d' . $desktopTemplate;

	if ($disableItemBlocks = $menu->getData("disable_iblocks")) {
		$classes .= ' hide-blocks';
	}

    $drilldown_speed = $data->getConfig("general_settings/drilldown_speed");
    $drilldown_speed = $drilldown_speed ? (int)$drilldown_speed : 300;
	$checked = true;
	$html2 = "";

	try{
		$html2          = $data->filter($html);
	} catch (\Exception $e) {
		$checked = false;
	}

	if($checked) {
		$html = $html2;
	}

	$event         = $menu->getEvent();
	$id            = time() . uniqid();
	$blockId       = $menu->getAlias() .'-'. time();
	$disableBellow = (int) $menu->getDisableBellow();
	$navId         = 'nav'  . $id;
	$classes       .= ' ves-megamenu-' . $event . ' ' . $menu->getData("classes") . ' ' . $menu->getAlias();
	$title         = $this->getData("title");
	if ($title) $classes .= ' ' . 'has-title';
	$sticky = $menu->getData('scrolltofixed');
	$design = $menu->getDesign();

	$googleLink = $styles = '';
	if ($design) {
		if (!is_array($design)) {
			$design = unserialize($design);
		}
		if (isset($design['margin_top']) && $design['margin_top']) {
			$styles .= 'margin-top:' . $design['margin_top'] . $design['margin_units'] . ';';
		}
		if (isset($design['margin_right']) && $design['margin_right']) {
			$styles .= 'margin-right:' . $design['margin_right'] . $design['margin_units'] . ';';
		}
		if (isset($design['margin_bottom']) && $design['margin_bottom']) {
			$styles .= 'margin-bottom:' . $design['margin_bottom'] . $design['margin_units'] . ';';
		}
		if (isset($design['margin_left']) && $design['margin_left']) {
			$styles .= 'margin-left:' . $design['margin_left'] . $design['margin_units'] . ';';
		}
		if (isset($design['border_top_width']) && $design['border_top_width']) {
			$styles .= 'border-top-width:' . $design['border_top_width'] . $design['border_units'] . ';';
		}
		if (isset($design['border_right_width']) && $design['border_right_width']) {
			$styles .= 'border-right-width:' . $design['border_right_width'] . $design['border_units'] . ';';
		}
		if (isset($design['border_bottom_width']) && $design['border_bottom_width']) {
			$styles .= 'border-bottom-width:' . $design['border_bottom_width'] . $design['border_units'] . ';';
		}
		if (isset($design['border_left_width']) && $design['border_left_width']) {
			$styles .= 'border-left-width:' . $design['border_left_width'] . $design['border_units'] . ';';
		}
		if (isset($design['padding_top']) && $design['padding_top']) {
			$styles .= 'padding-top:' . $design['padding_top'] . $design['padding_units'] . ';';
		}
		if (isset($design['padding_right']) && $design['padding_right']) {
			$styles .= 'padding-right:' . $design['padding_right'] . $design['padding_units'] . ';';
		}
		if (isset($design['padding_bottom']) && $design['padding_bottom']) {
			$styles .= 'padding-bottom:' . $design['padding_bottom'] . $design['padding_units'] . ';';
		}
		if (isset($design['padding_left']) && $design['padding_left']) {
			$styles .= 'padding-left:' . $design['padding_left'] . $design['padding_units'] . ';';
		}
		if (isset($design['border_style']) && $design['border_style']) {
			$styles .= 'border-style: ' . $design['border_style'] . ';';
		}
		if (isset($design['border_color']) && $design['border_color']) {
			$styles .= 'border-color: ' . $design['border_color'] . ';';
		}
		if (isset($design['border_top_left_radius']) && $design['border_top_left_radius']) {
			$styles .= 'border-top-left-radius: ' . $design['border_top_left_radius'] . $design['radius_units'] . ';';
		}
		if (isset($design['border_top_right_radius']) && $design['border_top_right_radius']) {
			$styles .= 'border-top-right-radius: ' . $design['border_top_right_radius'] . $design['radius_units'] . ';';
		}
		if (isset($design['border_bottom_right_radius']) && $design['border_bottom_right_radius']) {
			$styles .= 'border-bottom-right-radius: ' . $design['border_bottom_right_radius'] . $design['radius_units'] . ';';
		}
		if (isset($design['border_bottom_left_radius']) && $design['border_bottom_left_radius']) {
			$styles .= 'border-bottom-left-radius: ' . $design['border_bottom_left_radius'] . $design['radius_units'] . ';';
		}
		if (isset($design['background']) && $design['background']) {
			$styles .= 'background-color: ' . $design['background'] . ';';
		}
		if (isset($design['boxshadow_color']) && $design['boxshadow_color']) {
			$boxshadowUnits = $design['boxshadow_units'];
			$styles .= 'box-shadow: ' . ($design['boxshadow_x']?'inset':'') . ' ' . $design['boxshadow_x'] . $boxshadowUnits . ' ' . $design['boxshadow_y'] . $boxshadowUnits . ' ' . $design['boxshadow_blur'] . $boxshadowUnits . ' ' . $design['boxshadow_spread'] . $boxshadowUnits . ' ' . $design['boxshadow_color'] . ';';
		}
		if (isset($design['font_group']) && $design['font_group'] == 'google') {
			$amp = ',';
			$charSubset = '';
			if ($subsets = $design['font_char_subset']){
				$charSubset = "{$amp}subset={$subsets}";
			}
			$fontWeight = '';
			$weight = $design['font_weight'];
			if ($weight){
				$fontWeight = ':' . $weight;
			}
			$googleLink = 'https://fonts.googleapis.com/css?family='.str_replace(' ', '+', $design['font_google']) . $fontWeight . $charSubset;
			if (isset($design['font_google']) && $design['font_google'] && $design['font_google']) {
				$styles .= 'font-family: ' . $design['font_google'] . ';';
			}
		} else if (isset($design['font_group']) && $design['font_group'] != 'custom') {
			$styles .= 'font-family: ' . $design['font_group'] . ';';
		} else if (isset($design['font_custom']) && $design['font_custom'] && $design['font_group'] == 'custom') {
			$styles .= 'font-family: ' . $design['font_custom'] . ';';
		}
		if (isset($design['font_size']) && $design['font_size']) {
			$styles .= 'font-size: ' . $design['font_size'] . ';';
		}
		if (isset($design['font_weight']) && $design['font_weight']) {
			$styles .= 'font-weight: ' . $design['font_weight'] . ';';
		}
	}

	//if ($styles) {
	//	$styles = 'style="' . $styles . '"';
	//}
    $show_menu_block_title = (int)$this->getConfig("show_menu_block_title");
	$custom_css_class = $this->getConfig("custom_class");
	if($custom_css_class){
		$classes .=" ".$custom_css_class;
	}
	?>
	<div id="<?= $blockId ?>" class="block ves-megamenu top-navigation <?= $classes ?>">
		<?php if ($title && $show_menu_block_title) : ?>
		<div class="block-title"><strong><span><?= __($title); ?></span></strong></div>
		<?php endif; ?>
		<?php if($mobileTemplate == 0 || $mobileTemplate == 2) : ?>
		<div class="navbar ves-navbar">
			<span class="ves-navtoggle ves-navtoggle<?= $blockId ?>">
				<span><?= __('Toggle Nav'); ?></span>
			</span>
		</div>
		<?php endif; ?>
		<div class="navigation navitaion<?= $id ?>">
			<nav class="navigation" data-action="navigation">
				<ul id="<?= $navId ?>" class="<?= $navId ?>"  <?php if ($disableBellow > 0) : ?>data-disable-bellow="<?= $disableBellow ?>"<?php endif; ?> data-mage-init='{"menu":{"responsive":false, "expanded":false, "position":{"my":"left top","at":"left bottom"}}}' data-toggle-mobile-nav="false">
					<?= $html; ?>
				</ul>
				<?= /* @escapeNotVerified */ $block->getChildHtml() ?>
			</nav>
		</div>
	</div>
	<script defer>
		require(['jquery'
			<?php if($menu->getData('scrolltofixed')) : ?>,'scrolltofixed'<?php endif; ?>
			<?php if ($mobileTemplate == 3 || ($desktopTemplate=='drill')) : ?>,'jquery.drilldown'<?php endif; ?>
			], function($) {
				// $('.price-box.price-final_price', $("#<?= $navId ?>")).each(function(){
				// 	$(this).removeClass('price-box').addClass('price-box1');
				// 	$(this).attr('data-role','priceBox1');
				// })
				$('.price-box', $("#<?= $navId ?>")).each(function(){
					$(this).removeClass('price-box').addClass('price-box1');
					$(this).attr('data-role','priceBox1');
				})
				<?php if ($googleLink) : ?>
					var ss  = document.createElement("link");
					ss.type = "text/css";
					ss.rel  = "stylesheet";
					ss.href = "<?= $googleLink ?>";
					document.getElementsByTagName("head")[0].appendChild(ss);
					<?php endif; ?>

					jQuery(document).ready(function($) {
						jQuery('#<?= $navId ?> p').each(function() {
							var $this = $(this);
							if ($this.html().replace(/\s|&nbsp;/g, '').length == 0)
							$this.remove();
						});


						<?php if ($event == 'hover' && $desktopTemplate != 'accordion' && $desktopTemplate != 'drill') { ?>
							$("#<?= $navId ?> .nav-item").hover(function() {
								$(this).addClass('current');
								var id = $(this).data("dynamic-id");
								if (id) {
									$(this).parents(".dynamic-items").find("li").removeClass("dynamic-active");
									$(this).addClass("dynamic-active");
									$("#<?= $navId ?> ."+id).parent().find(".dynamic-item").removeClass("dynamic-active");
									$("#<?= $navId ?> ."+id).addClass("dynamic-active");
								}

								if ($(this).data('hovericon')) {
									$(this).children('.nav-anchor').find('.item-icon').attr('src', $(this).data('hovericon'));
								}
								if ($(this).data('caret') && $(this).data('hovercaret')) {
									$(this).children('.nav-anchor').find('.ves-caret').removeClass($(this).data('caret')).addClass($(this).data('hovercaret'));
								}

								var child_anchor = $(this).children('.nav-anchor');
								$(child_anchor).css({
									"background-color": $(child_anchor).data("hover-bgcolor"),
									"color": $(child_anchor).data("hover-color")
								});
								<?php if ($desktopTemplate == 'horizontal') { ?>
									if ($(this).hasClass('level0')) {
										var mParentTop = $('#<?= $blockId ?> .navigation').offset().top;
										var mParentHeight = $(this).parent().height();
										var mTop =  $(this).height();
										var mHeight = $(this).height();
										var mParent = $(this).parent();
										if (mHeight < mParentHeight) {
											mTop = $(this).offset().top - mParent.offset().top + mHeight;
										}
										$(this).children('.submenu').css({top:mTop});
									}
									<?php } ?>
								}, function() {
									var id = $(this).attr('id');
									if ($(this).data('iconsrc')) {
										$(this).children('.nav-anchor').find('.item-icon').attr('src', $(this).data('iconsrc'));
									}
									if ($(this).data('caret')) {
										$(this).children('.nav-anchor').find('.ves-caret').removeClass($(this).data('hovercaret')).addClass($(this).data('caret'));
									}
									$(this).removeClass('current');
									var child_anchor = $(this).children('.nav-anchor');
									var link_bgcolor = $(child_anchor).data("bgcolor");
									var link_color = $(child_anchor).data("color");
									if(!link_bgcolor|| typeof(link_bgcolor) == 'undefined') {
										link_bgcolor = 'inherit';
									}
									if(!link_color || typeof(link_color) == "undefined") {
										link_color = 'none';
									}

									$(child_anchor).css({
										"background-color": link_bgcolor,
										"color": link_color
									});
								});
							<?php } ?>

							<?php if ($event == 'click') { ?>
								if($("#<?= $navId ?> .nav-item").length > 0) {
									$(document).mouseup(function(e) {
									    var container = $("#<?= $navId ?> .nav-item.level0.current");
									    var container1 = $("#<?= $navId ?> .nav-item.level1.current");
									    var container2 = $("#<?= $navId ?> .nav-item.level2.current");
									    var container3 = $("#<?= $navId ?> .nav-item.level3.current");
									    // if the target of the click isn't the container nor a descendant of the container
									    if (!container.is(e.target) && container.has(e.target).length === 0)
									    {
									        $(container).removeClass('current');
									        $(container).find(".nav-anchor").removeClass("actived");
									        if ($(container).data('caret')) {
												$(container).children('.nav-anchor').find('.ves-caret').removeClass($(container).data('hovercaret')).addClass($(container).data('caret'));
											}
											if($(container).find(".nav-item.current").length > 0){
												$(container).find(".nav-item.current").removeClass("current");
											}
									        return;
									    }
									    if (!container1.is(e.target) && container1.has(e.target).length === 0)
									    {
									        $(container1).removeClass('current');
									        $(container1).find(".nav-anchor").removeClass("actived");
									        if($(container1).find(".nav-item.current").length > 0){
												$(container1).find(".nav-item.current").removeClass("current");
											}
									        return;
									    }
									    if (!container2.is(e.target) && container2.has(e.target).length === 0)
									    {
									        $(container2).removeClass('current');
									        $(container2).find(".nav-anchor").removeClass("actived");
									        if($(container2).find(".nav-item.current").length > 0){
												$(container2).find(".nav-item.current").removeClass("current");
											}
									        return;
									    }
									    if (!container3.is(e.target) && container3.has(e.target).length === 0)
									    {
									        $(container3).removeClass('current');
									        $(container3).find(".nav-anchor").removeClass("actived");
									        if($(container3).find(".nav-item.current").length > 0){
												$(container3).find(".nav-item.current").removeClass("current");
											}
									        return;
									    }
									});
									$("#<?= $navId ?> .nav-item > .nav-anchor").click(function(e) {
										if($(this).hasClass("actived")) {
											if ($(window).width() < 768) {
												return true;
											}
											var obj = $(this).parents(".nav-item").eq(0);
											if ($(obj).children('.submenu').length > 0 && !$(obj).hasClass("subgroup")) {
												e.preventDefault();
												$(this).removeClass("actived");
												if($(obj).hasClass('current')) {
													$(obj).removeClass('current');
												}
												if ($(obj).data('caret')) {
													$(obj).children('.nav-anchor').find('.ves-caret').removeClass($(obj).data('hovercaret')).addClass($(obj).data('caret'));
												}

												var container = $("#<?= $navId ?> .nav-item.level0.current");
											    var container1 = $("#<?= $navId ?> .nav-item.level1.current");
											    var container2 = $("#<?= $navId ?> .nav-item.level2.current");
											    var container3 = $("#<?= $navId ?> .nav-item.level3.current");
											    // if the target of the click isn't the container nor a descendant of the container

											    if (!container.is(e.target) && container.has(e.target).length === 0)
											    {
											        $(container).removeClass('current');
											        return false;
											    }
											    if (!container1.is(e.target) && container1.has(e.target).length === 0)
											    {
											        $(container1).removeClass('current');
											        return false;
											    }
											    if (!container2.is(e.target) && container2.has(e.target).length === 0)
											    {
											        $(container2).removeClass('current');
											        return false;
											    }
											    if (!container3.is(e.target) && container3.has(e.target).length === 0)
											    {
											        $(container3).removeClass('current');
											        return false;
											    }
												return false;
											}
										} else {
											var obj = $(this).parents(".nav-item").eq(0);
											if ($(obj).children('.submenu').length > 0 && !$(obj).hasClass("subgroup")) {
												if ($(obj).hasClass('level0')) {
													$('#<?= $navId ?> > .nav-item').removeClass('current');
												}
												if($(obj).hasClass('current')) {
													$(obj).removeClass('current');
												} else {
													$(obj).addClass('current');
													$(this).addClass("actived");
												}

												if ($(obj).data('hovericon')) {
													$(obj).children('.nav-anchor').find('.item-icon').attr('src', $(obj).data('hovericon'));
												}
												if ($(obj).data('caret') && $(obj).data('hovercaret')) {
													$(obj).children('.nav-anchor').find('.ves-caret').removeClass($(obj).data('caret')).addClass($(obj).data('hovercaret'));
												}

												return false;
											}
										}
									});

									$("#<?= $navId ?> .nav-item").hover(function() {
										var id = $(this).data("dynamic-id");
										if (id) {
											$(this).addClass('current');
											$(this).parents(".dynamic-items").find("li").removeClass("dynamic-active");
											$(this).addClass("dynamic-active");
											$("#<?= $navId ?> ."+id).parent().find(".dynamic-item").removeClass("dynamic-active");
											$("#<?= $navId ?> ."+id).addClass("dynamic-active");

											if ($(this).data('hovericon')) {
												$(this).children('.nav-anchor').find('.item-icon').attr('src', $(this).data('hovericon'));
											}
											if ($(this).data('caret') && $(this).data('hovercaret')) {
												$(this).children('.nav-anchor').find('.ves-caret').removeClass($(this).data('caret')).addClass($(this).data('hovercaret'));
											}

											var child_anchor = $(this).children('.nav-anchor');
											$(child_anchor).css({
												"background-color": $(child_anchor).data("hover-bgcolor"),
												"color": $(child_anchor).data("hover-color")
											});

											<?php if ($desktopTemplate == 'horizontal') { ?>
											if ($(this).hasClass('level0')) {
												var mParentTop = $('#<?= $blockId ?> .navigation').offset().top;
												var mParentHeight = $(this).parent().height();
												var mTop =  $(this).height();
												var mHeight = $(this).height();
												var mParent = $(this).parent();
												if (mHeight < mParentHeight) {
													mTop = $(this).offset().top - mParent.offset().top + mHeight;
												}
												$(this).children('.submenu').css({top:mTop});
											}
											<?php } ?>
										}
									}, function() {
										var id = $(this).data("dynamic-id");
										if(id) {
											if ($(this).data('iconsrc')) {
												$(this).children('.nav-anchor').find('.item-icon').attr('src', $(this).data('iconsrc'));
											}
											if ($(this).data('caret')) {
												$(this).children('.nav-anchor').find('.ves-caret').removeClass($(this).data('hovercaret')).addClass($(this).data('caret'));
											}
											$(this).removeClass('current');
											var child_anchor = $(this).children('.nav-anchor');
											var link_bgcolor = $(child_anchor).data("bgcolor");
											var link_color = $(child_anchor).data("color");
											if(!link_bgcolor|| typeof(link_bgcolor) == 'undefined') {
												link_bgcolor = 'inherit';
											}

											$(child_anchor).css({
												"background-color": link_bgcolor,
												"color": link_color
											});
										}
									});
								}

								<?php } ?>

								/** ACCORDION */
								<?php if ($desktopTemplate == 'accordion') { ?>
									$('#<?= $navId ?> .ves-caret').on('click', function(e) {
										e.preventDefault();
										var parent = $(this).parents(".nav-item").eq(0);
										var subMenu = $(parent).children(".submenu");
										if (!$(this).hasClass('item-active')) {
											if ($(parent).data('caret') && $(parent).data('hovercaret')) {
												$(this).removeClass($(parent).data('caret')).addClass($(parent).data('hovercaret'));
											}
												//parent.addClass('current');
												$(this).addClass('item-active');
												subMenu.stop().slideToggle();
												setTimeout(function(){
													subMenu.css({'height':''});
												}, 200);
											} else {
												subMenu.stop().slideToggle();
												//parent.removeClass('current');
												$(this).removeClass('item-active');
												$(this).removeClass($(parent).data('hovercaret')).addClass($(parent).data('caret'));
											}
											return false;
										});
									<?php } ?>

									/* OPENER */
									$('#<?= $navId ?> .opener').on('click', function(e) {
										e.preventDefault();
										$("#<?= $navId ?> .nav-item").removeClass("item-active");
										var parent = $(this).parents(".nav-item").eq(0);
										$(this).toggleClass('item-active');
										var subMenu = $(parent).find(".submenu").eq(0);
										subMenu.stop().slideToggle();
										subMenu.css({'height':''});
										return false;
									});

									/* TOGGLE */
									$("#<?= $blockId ?> .ves-navtoggle<?= $blockId ?>").click(function() {
										$('html').removeClass('nav-before-open nav-open');
										$('.ves-overlay<?= $blockId ?>').show();
										$("#<?= $blockId ?>").append('<div class="ves-overlay ves-overlay<?= $blockId ?>"></div>');
										$('#<?= $navId ?>').css("left", "0px");
										if ($('html').hasClass('ves-navopen')) {
											$('html').removeClass('ves-navopen');
											setTimeout(function () {
												$('html').removeClass('ves-nav-before-open');
											}, 300);
										}	 else {
											$('html').addClass('ves-nav-before-open');
											setTimeout(function () {
												$('html').addClass('ves-navopen');
											}, 42);
										}
									});

									/* OFF-CANVAS */
									$(document).on("click", ".ves-overlay<?= $blockId ?>", function(){
										$('#<?= $navId ?>').css("left","");
										$('html').removeClass('ves-navopen');
										setTimeout(function () {
											$('html').removeClass('ves-nav-before-open');
										}, 300);
										$(this).remove();
										return false;
									});

									/* STICKY MENY */
									<?php if($menu->getData('scrolltofixed')){ ?>
										$('.section-items.nav-sections-items').scrollToFixed({
											zIndex: 999
										});
									<?php } ?>

									var mobileDrill, desktopDrill;
									/* WINDOW RESIZE */
									$(window).on("resize", function() {
										if ($(window).width() < 768) {
											$("#<?= $blockId ?>").addClass("nav-mobile").removeClass('nav-desktop');
													/** DRILLDOWN MOBILE MENU */
													<?php if ($desktopTemplate=='drill') { ?>
														$('#<?= $blockId ?> .drill-opener').hide();
														$('#<?= $blockId ?>').css('width', '');
														if (typeof(desktopDrill) === 'object') {
															$('#<?= $blockId ?>').drilldown('reset');
														}
													<?php } ?>

													<?php if ($mobileTemplate == 3) { ?>
														$('#<?= $blockId ?> .drill-opener').show();
														mobileDrill = $('#<?= $blockId ?>').drilldown({
															selector: '.drill-opener',
															cssClass: {
																container: 'navitaion<?= $id ?>',
																root: '<?= $navId ?>',
																sub: 'submenu',
																back: 'drilldown-back'
															},
															speed: <?= (int)$drilldown_speed; ?>
														});
													<?php } ?>
													$('#<?= $blockId ?> .opener').removeClass('item-active');
												} else {
													$("#<?= $blockId ?> .submenu").css({'display':''});
													$("#<?= $blockId ?>").removeClass("nav-mobile").addClass('nav-desktop');

													/** DRILLDOWN MOBILE MENU */
													<?php if ($mobileTemplate == 3) { ?>
														$('#<?= $blockId ?> .drill-opener').hide();
														$('#<?= $blockId ?>').css('width', '');
														if (typeof(mobileDrill) === 'object') {
															$('#<?= $blockId ?>').drilldown('reset');
														}

														$('#<?= $blockId ?>').find('.submenu').each(function() {
															var subWidth = $(this).data('width');
															if (!subWidth) {
																subWidth = '100%';
															}
															$(this).css('width', subWidth);
														});
													<?php } ?>

													<?php if ($desktopTemplate=='drill') { ?>
														$('#<?= $blockId ?> .drill-opener').show();
														$('#<?= $blockId ?>').drilldown({
															selector: '.drill-opener',
															cssClass: {
																container: 'navitaion<?= $id ?>',
																root: '<?= $navId ?>',
																sub: 'submenu',
																back: 'drilldown-back'
															},
															speed: <?= (int)$drilldown_speed; ?>
														});
													<?php } ?>


													}

					// TABLET
					$("#<?= $navId ?> .nav-item.level0 > a.nav-anchor").click(function() {
						if ($(window).width() >= 768 && $(window).width() < 1024) {
							var parent = $(this).parent();
							if ($(parent).children('.submenu').length == 1) {
								//console.log("\n 1.Init click menu item.");
								if($(this).hasClass("actived")){
									$(this).removeClass("actived");
									$(parent).removeClass('current');
									//console.log("\n 2.remove current class of menu item.");
									return false;
								}
								$("#<?= $navId ?> .level0").removeClass('current');
								var mParent = $('#<?= $blockId ?> .navigation').offset().top;
								var mHeight = $(parent).offset().top;
								var mTop    = (mHeight - mParent) + $(parent).height();
								$(parent).children('.submenu').css({top:mTop});

								$(parent).addClass('current');
								$(this).addClass("actived");
								//console.log("\n 3.Clicked on top menu, add current class.");
								if ($(parent).hasClass('submenu-alignleft') || $(parent).hasClass('submenu-alignright')){
									if (($(parent).offset().left + $(parent).children('.submenu').width()) > $(window).width()) {
										$(parent).children('.submenu').css('max-width','100%');
										$(parent).css('position','static');
									}
								}
								return false;
							}
						}
					});
					$("#<?= $navId ?> .nav-item").click(function() {
						if ($(window).width() >= 768 && $(window).width() < 1024) {

						} else {
							$("#<?= $navId ?>").find('.submenu').css('max-width','');
							$("#<?= $navId ?>").find('.submenu-alignleft').css('position','relative');
						}
					});
				}).resize();
				var toggle_nav = $("#<?= $navId ?>").attr("data-toggle-mobile-nav");
				if(toggle_nav == true || toggle_nav == 'true' || toggle_nav==1){
					if(!$('html').hasClass('megamenu-init-toggle')) {
						$('html').addClass('megamenu-init-toggle');
						$(document).on("click", ".action.nav-toggle", function () {
							if ($('html').hasClass('nav-open')) {
								$('html').removeClass('nav-open');
								setTimeout(function () {
									$('html').removeClass('nav-before-open');
								}, 300);
							} else {
								$('html').addClass('nav-before-open');
								setTimeout(function () {
									$('html').addClass('nav-open');
								}, 42);
							}
						});
					}
				}
	});
});
</script>
<?php if ($styles): ?>
<style>
#<?= $block->escapeHtmlAttr($blockId) ?> {
    <?= $styles; ?>
}
<?= $menu->getCustomCss(); ?>
</style>
<?php endif; ?>
<?php } ?>
