(function ($) {

	"use strict";

	var NavMenuHandler = function( $scope, $ ) {

		var $widgetContainer = $scope.find('.trx-addons-nav-widget-container');

		// we don't need to wait for content dom load since the script is loaded in the footer.
		// $widgetContainer.removeClass('trx-addons-invisible');

		if ( ! elementorFrontend.isEditMode() ) {
			$widgetContainer.css({ visibility: 'inherit', opacity: 'inherit' });
		}

		var settings = $widgetContainer.data('settings');

		if ( ! settings ) {
			return;
		}

		var $menuContainer = $scope.find('.trx-addons-mobile-menu'),
			$menuToggler = $scope.find('.trx-addons-hamburger-toggle'),
			$hamMenuCloser = $scope.find('.trx-addons-mobile-menu-close'),
			$centeredItems = $scope.find('.trx-addons-mega-content-centered'),
			$fullWidthItems = $scope.find('.trx-addons-nav-menu-container').find('li.trx-addons-mega-nav-item,li[data-full-width="true"],li[class*="trx_addons_stretch_"]'),
			disablePageScroll = $scope.hasClass('trx-addons-disable-scroll-yes') ? true : false,
			hoverTimeout,
			mobileMenuTransitionSpeed = trx_addons_apply_filters( 'trx_addons_filter_nav_menu_mobile_transition_speed' , 'normal' );

		jQuery( document ).on( 'action.menu-collapse-items-moved', function( e, action ) {
			$fullWidthItems = $scope.find('.trx-addons-nav-menu-container').find('li.trx-addons-mega-nav-item,li[data-full-width="true"],li[class*="trx_addons_stretch_"]');
		} );

		// Get Element On Page Option
		$scope.find('div[data-mega-content]').each( function( index, elem ) {
			var $currentItem = $(elem),
				targetElement = $currentItem.data('mega-content');
			if ( $(targetElement).length > 0 ) {
				var $targetElement = $(targetElement);
				$targetElement.attr( 'data-menu-id', $scope.data('id') );
				$currentItem.append( $targetElement.clone(true).addClass('trx-addons-cloned-element') );
			}
		} );

		// Remove Element On Page Option If on Frontend
		if ( ! elementorFrontend.isEditMode() ) {
			$('div[data-menu-id="' + $scope.data('id') + '"]').not('.trx-addons-cloned-element').remove();
		}

		/**
		 * Save current device to use it later to determine if the device changed on resize.
		 */
		// window.trxCurrStickyDevice = elementorFrontend.getCurrentDeviceMode();

		// make sure it's removed when the option is disabled.
		if ( elementorFrontend.isEditMode() && ! disablePageScroll ) {
			$('body').removeClass('trx-addons-scroll-disabled');
		}

		$centeredItems.each( function( index, item ) {
			$(item).closest(".trx-addons-nav-menu-item").addClass("trx-addons-mega-item-static");
		} );

		if ( 'slide' === settings.mobileLayout || 'slide' === settings.mainLayout ) {
			$scope.addClass('trx-addons-ver-hamburger-menu');
		}

		// check badges dot/grow effect.
		if ( 'dot' === settings.hoverEffect ) {
			var $badgedItems = $scope.find('.trx-addons-mega-content-container .trx-addons-badge-dot, .trx-addons-sub-menu .trx-addons-badge-dot');
			$badgedItems.each( function( index, $item ) {
				$( $item )
					.mouseenter( function() {
						$( $item ).removeClass('trx-addons-badge-dot');
					} )
					.mouseleave( function() {
						$($item).addClass('trx-addons-badge-dot');
					} );
			} );
		}

		// close mobile menu after clicking.
		if ( settings.closeAfterClick ) {
			$menuContainer.find('.trx-addons-menu-link').on( 'click.trxAfterClick', function () {
				// check if it has children
				var hasChildern = itemHasChildren( this );

				if ( ! hasChildern || jQuery(this).attr('href') !== '#' ) {
					// close mobile menu
					if ( 'slide' === settings.mainLayout || 'slide' === settings.mobileLayout ) {
						// if ($scope.hasClass('trx-addons-nav-slide')) {
						$hamMenuCloser.trigger( 'click' );
					} else {
						$menuToggler.trigger( 'click' );
					}
				}
			} );
		}

		var isMobileMenu = null,
			isDesktopMenu = null;

		checkBreakPoint( settings );

		if ( $scope.hasClass('trx-addons-nav-hor') ) {
			$(window).trigger( 'resize' );
			// Check dimensions after all other handlers are done.
			setTimeout( checkMegaContentWidth, 100 );
		}

		// checkStickyEffect();

		if ( ['hor', 'ver'].includes( settings.mainLayout ) ) {

			if ( 'hover' === settings.submenuEvent ) {

				$scope.find('.trx-addons-nav-menu-item')
					.on( 'focus.trxItemHover', '> a', function(e) {
						$(this).parent().trigger('mouseenter.trxItemHover');
					} )
					.on( 'mouseenter.trxItemHover', function(e) {
						var $this = $(this);
						e.stopPropagation();
						clearTimeout( hoverTimeout );
						$this.siblings().removeClass('trx-addons-item-hovered'); // unset hovered items only for this menu.
						$this.find('.trx-addons-nav-menu-item.trx-addons-item-hovered').removeClass('trx-addons-item-hovered'); // unset hovered items for child submenus.
						$this.addClass('trx-addons-item-hovered');
						if ( $this.hasClass('trx-addons-sub-menu-item') ) {
							$this.parents('.trx-addons-nav-menu-item').addClass('trx-addons-item-hovered');
						}
						initHiddenElements( $this );
					} );

				$scope.on('mouseleave.trxItemHover', function(e) {
					var delay = getComputedStyle( $scope[0] ).getPropertyValue( '--trx-addons-mega-menu-delay' );
					if ( isNaN( delay ) ) {
						delay = 300;
					}
					hoverTimeout = setTimeout( function () {
						$scope.find('.trx-addons-item-hovered').removeClass('trx-addons-item-hovered');
					}, delay);
				} );

				// we need to make sure that trx-addons-item-hover is not removed when hovering over a sub/mega menu.
				$scope.find('.trx-addons-sub-menu, .trx-addons-mega-content-container')
					.on( 'mouseenter.trxItemHover', function(e) {
						var $menuItem = $(this).parents('.trx-addons-nav-menu-item').first();
						clearTimeout( hoverTimeout );
						$menuItem.siblings().removeClass('trx-addons-item-hovered'); // remove it from the menu item in the same widget only
						$menuItem.addClass('trx-addons-item-hovered');
						initHiddenElements( $menuItem );
					} )
					.on( 'mouseleave.trxItemHover', function(e) {
						clearTimeout( hoverTimeout );
						// $(this).parents('.trx-addons-nav-menu-item').first().removeClass('trx-addons-item-hovered');
					} );

			} else { // click

				var triggerSelector = 'item' === settings.submenuTrigger ? ' > .trx-addons-menu-link' : ' > .trx-addons-menu-link .trx-addons-dropdown-icon',
					$trigger = $scope.find('.trx-addons-nav-menu-container .trx-addons-nav-menu-item.menu-item-has-children' + triggerSelector);

				// To prevent events overlapping if the user switched between hover/click while building the menu.
				if ( elementorFrontend.isEditMode() ) {
					$scope.off( 'mouseleave.trxItemHover' );
				}

				$trigger.off( 'click.trxItemClick' ); // to prevent duplications.
				$trigger.on( 'click.trxItemClick', function(e) {
					e.preventDefault();
					e.stopPropagation();
					var $menuItem = $(this).parents('.trx-addons-nav-menu-item').first();
					// remove it from the menu item in the same widget only
					$menuItem.siblings().removeClass('trx-addons-item-hovered').find('.trx-addons-item-hovered').removeClass('trx-addons-item-hovered');
					$menuItem.toggleClass('trx-addons-item-hovered');
					initHiddenElements( $menuItem );
				} );
			}
		}

		// Close the menu when clicking outside of it (on the overlay).
		$(document).on('click', '.trx-addons-nav-slide-overlay', function() {
			$scope.find('.trx-addons-mobile-menu-outer-container, .trx-addons-nav-slide-overlay').removeClass('trx-addons-vertical-toggle-open');
			$('body').removeClass('trx-addons-scroll-disabled');
			$menuToggler.removeClass('trx-addons-toggle-opened'); // show/hide close icon/text.
		} );

		// Close the menu when clicking on the close button.
		$hamMenuCloser
			.on( 'keypress', function (e) {
				if ( e.which === 13 ) { // Enter key
					$(this).trigger( 'click' );
				}
			} )
			.on( 'click', function() {
				$scope.find('.trx-addons-mobile-menu-outer-container, .trx-addons-nav-slide-overlay').removeClass('trx-addons-vertical-toggle-open');
				$('body').removeClass('trx-addons-scroll-disabled');
				$menuToggler.removeClass('trx-addons-toggle-opened');	// show/hide close icon/text.
			} );

		// Toggle the menu when clicking on the hamburger icon.
		$menuToggler
			.on( 'keypress', function (e) {
				if ( e.which === 13 ) { // Enter key
					$(this).trigger( 'click' );
				}
			} )
			.on( 'click', function () {
				if ('slide' === settings.mobileLayout || 'slide' === settings.mainLayout) {
					$scope.find('.trx-addons-mobile-menu-outer-container, .trx-addons-nav-slide-overlay').addClass('trx-addons-vertical-toggle-open');
					if ( disablePageScroll ) {
						$('body').addClass('trx-addons-scroll-disabled');
					}
				} else {
					var $menuParent = $scope.find('.trx-addons-mobile-menu-container');
					if ( $menuContainer.hasClass('trx-addons-active-menu') ) {
						$menuParent.slideUp( mobileMenuTransitionSpeed, function () {
							$menuContainer.removeClass('trx-addons-active-menu');
							$menuParent.show();
						} );
					} else {
						$menuParent.hide();
						$menuContainer.addClass('trx-addons-active-menu');
						$menuParent.slideDown( mobileMenuTransitionSpeed );
					}
				}
				$menuToggler.toggleClass('trx-addons-toggle-opened'); // show/hide close icon/text.
			} );

		$menuContainer
			.find( '.trx-addons-nav-menu-item.menu-item-has-children a[href="#"]'
				+ ',.trx-addons-nav-menu-item.menu-item-has-children a:not([href="#"]) .trx-addons-dropdown-icon'
				+ ',.trx-addons-mega-nav-item a[href="#"]'
				+ ',.trx-addons-mega-nav-item a:not([href="#"]) .trx-addons-dropdown-icon' )
			.on('click', function (e) {
				var $self = $(this).hasClass( 'trx-addons-dropdown-icon' ) ? $(this).closest('a').eq(0) : $(this),
					$parent = $self.parent( '.trx-addons-nav-menu-item' ),
					$submenu = $self.next( '.trx-addons-submenu, .trx-addons-mega-content-container' );
				if ( $self.find(".trx-addons-dropdown-icon").length < 1 ) {
					return;
				}
				e.stopPropagation();
				e.preventDefault();
				var closeSubmenu = function( $item ) {
					var $submenu = $item.find(' > .trx-addons-submenu, > .trx-addons-mega-content-container');
					if ( $submenu.length ) {
						$submenu.slideUp( mobileMenuTransitionSpeed, function () {
							$item.removeClass('trx-addons-active-menu trx-addons-active-menu-closing');
							$submenu.removeAttr('style');
							// close all inner submenus.
							$submenu
								.find('.trx-addons-active-menu').removeClass('trx-addons-active-menu')
								.find('>.trx-addons-submenu, >.trx-addons-mega-content-container').removeAttr('style');
						} );
					}
				};
				//If it was opened, then close it.
				if ( $parent.hasClass('trx-addons-active-menu') ) {
					closeSubmenu( $parent );
				} else {
					// Close any other opened items.
					$parent.parents('.trx-addons-active-menu').addClass('trx-addons-active-menu-fix');
					$menuContainer.find('.trx-addons-active-menu:not(.trx-addons-active-menu-fix)').each( function() {
						var $item = $(this);
						if ( ! $item.parents('.trx-addons-active-menu-closing').length ) {
							closeSubmenu( $item.addClass('trx-addons-active-menu-closing') );
						}
					} );
					$parent.parents('.trx-addons-active-menu-fix').removeClass('trx-addons-active-menu-fix');
					// Then, open this item.
					$submenu.slideDown( mobileMenuTransitionSpeed, function () {
						$parent.addClass('trx-addons-active-menu');
						$submenu.removeAttr('style');
						initHiddenElements( $parent );
					} );
				}
			} );

		$(document).on('click.trxCloseMegaMenu', function (event) {
			var isTabsItem = $(event.target).closest('.trx-addons-tabs-nav-list-item').length,
				isWidgetContainer = $(event.target).closest('.trx-addons-nav-widget-container').length;

			if ( ! isWidgetContainer && ! isTabsItem ) {
				if ( $( $menuContainer ).hasClass('trx-addons-active-menu') ) {
					$menuToggler.trigger( 'click' );
				}
				if ( 'click' === settings.submenuEvent ) {
					$scope.find('.trx-addons-nav-menu-container .trx-addons-item-hovered').removeClass('trx-addons-item-hovered')
				}
			}
		} );

		$(window).on('resize', function () {

			checkBreakPoint( settings );

			if ( $scope.hasClass('trx-addons-nav-hor') ) {
				checkMegaContentWidth();
			}
		} );

		// vertical toggler.
		if ( $scope.hasClass('trx-addons-ver-toggle-yes') && $scope.hasClass('trx-addons-ver-click') ) {
			$scope.find('.trx-addons-ver-toggler').on('click', function() {
				$widgetContainer.toggleClass( 'trx-addons-ver-collapsed', 500 );
			} );
		}

		$widgetContainer.addClass( 'trx-addons-nav-menu-inited' );

		//-------------------------------
		//  Helper Functions
		//-------------------------------

		// Call action.init_hidden_elements to initialize hidden elements.
		function initHiddenElements( $item ) {
			checkMegaContentWidth();
			$(document).trigger( 'action.init_hidden_elements', [ $item ] );
			// setTimeout( function() {
			// }, 400 );
		}

		// Set menu items to full width
		function checkMegaContentWidth() {
			$fullWidthItems.each( function( index, item ) {
				fullWidthContent( $(item).find('>ul') );
			} );
		}

		// Full Width Mega Content.
		function fullWidthContent( $item ) {
			if ( typeof window.trx_addons_stretch_submenu !== 'undefined' ) {
				//window.trx_addons_stretch_submenu( $item );
				window.trx_addons_shift_submenu( $item );
			} else {
				var isContainer = elementorFrontend.config.experimentalFeatures.container,
					$parentSec = $scope.parents('.e-con').last();

				$parentSec = ! isContainer || $parentSec.length < 1 ? $scope.closest('.elementor-top-section') : $parentSec;

				var width = $parentSec.outerWidth(),
					sectionLeft = $parentSec.offset().left - $item.offset().left;

				$($item).removeClass('trx-addons-mega-item-static').find('.trx-addons-mega-content-container, > .trx-addons-sub-menu').css({
					'width': width + 'px',
					'max-width': 'none',
					'left': sectionLeft + 'px',
					'right': 'auto',
					'transform': 'none'
				} );
			}
		}

		function checkBreakPoint( settings ) {

			// Trigger small screen menu.
			if ( settings.breakpoint >= $(window).outerWidth() && ! isMobileMenu ) {
				// remove the vertical toggler.
				$scope.find('.trx-addons-ver-toggler').css('display', 'none');
				$scope.addClass('trx-addons-hamburger-menu');
				$scope.find('.trx-addons-active-menu').removeClass('trx-addons-active-menu');
				// stretchDropdown( $scope.find('.trx-addons-stretch-dropdown .trx-addons-mobile-menu-container') );

				isMobileMenu = true;
				isDesktopMenu = false;

			// Trigger large screen menu.
			} else if ( settings.breakpoint < $(window).outerWidth() && ! isDesktopMenu ) {

				// show the vertical toggler if enabled.
				if ( $scope.hasClass('trx-addons-ver-toggle-yes') ) {
					$scope.find('.trx-addons-ver-toggler').css('display', 'flex');
				}

				$menuToggler.removeClass('trx-addons-toggle-opened');
				$scope.find(".trx-addons-mobile-menu-container .trx-addons-active-menu").removeClass("trx-addons-active-menu");
				$scope.removeClass('trx-addons-hamburger-menu trx-addons-ham-dropdown');
				$scope.find('.trx-addons-vertical-toggle-open').removeClass('trx-addons-vertical-toggle-open');
				$scope.find('.trx-addons-nav-default').removeClass('trx-addons-nav-default');

				isDesktopMenu = true;
				isMobileMenu = false;
			}

			// Stretch dropdown menu.
			if ( $scope.hasClass( 'trx-addons-hamburger-menu' ) || $scope.hasClass( 'trx-addons-nav-dropdown' ) ) {
				stretchDropdown( $scope.find('.trx-addons-stretch-dropdown .trx-addons-mobile-menu-container') );
			}

		}

		// Full Width Option. Shows the mobile menu beneath the widget's parent(section).
		function stretchDropdown( $menu ) {

			if ( ! $menu.length ) {
				return;
			}

			var isContainer = elementorFrontend.config.experimentalFeatures.container,
				$parentSec = $scope.parents('.e-con').last();

			$parentSec = ! isContainer || $parentSec.length < 1 ? $scope.closest('.elementor-top-section') : $parentSec;

			var width = Math.min( trx_addons_window_width(), $($parentSec).outerWidth() ),
				widgetTop = $scope.offset().top,
				parentBottom = $($parentSec).offset().top + $($parentSec).outerHeight(),
				stretchTop = parentBottom - widgetTop,
				stretchLeft = $scope.offset().left - Math.max( 0, $($parentSec).offset().left );
			
			$( $menu ).css({
				width: width + 'px',
				left: '-' + stretchLeft + 'px',
				top: stretchTop + 'px',
			} );
		}

		/**
		 * Check if the item has children.
		 * 
		 * @param {link} $item .trx-addons-menu-link
		 * 
		 * @returns boolean  true if the item has children.
		 */
		function itemHasChildren( $item ) {
			return $( $item ).parent( '.trx-addons-nav-menu-item' ).hasClass( 'menu-item-has-children' );
		}
	};

	$( window ).on( 'elementor/frontend/init', function () {
		elementorFrontend.hooks.addAction('frontend/element_ready/trx_elm_nav_menu.default', NavMenuHandler);
	} );

}( jQuery ) );