/**
 * File primary-navigation.js.
 *
 * Required to open and close the mobile navigation.
 */

/**
 * Toggle an attribute's value
 *
 * @since 8rise Theme 1.0
 *
 * @param {Element} el - The element.
 * @param {boolean} withListeners - Whether we want to add/remove listeners or not.
 */
 function eightriseToggleAriaExpanded( el, withListeners ) {
	if ( 'true' !== el.getAttribute( 'aria-expanded' ) ) {
		el.setAttribute( 'aria-expanded', 'true' );
		if ( withListeners ) {
			document.addEventListener( 'click', eightriseCollapseMenuOnClickOutside );
		}
	} else {
		el.setAttribute( 'aria-expanded', 'false' );
		if ( withListeners ) {
			document.removeEventListener( 'click', eightriseCollapseMenuOnClickOutside );
		}
	}
}

function eightriseCollapseMenuOnClickOutside( event ) {
	if ( ! document.getElementById( 'pagemenu' ).contains( event.target ) ) {
		document.getElementById( 'pagemenu' ).querySelectorAll( '.sub-menu-toggle' ).forEach( function( button ) {
			button.setAttribute( 'aria-expanded', 'false' );
		} );
	}
}

/**
 * Handle clicks on submenu toggles.
 *
 * @since 8rise Theme 1.0
 *
 * @param {Element} el - The element.
 */
 function eightriseExpandSubMenu( el ) { // jshint ignore:line
	// Close other expanded items.
	el.closest( 'li' ).querySelectorAll( '.sub-menu-toggle' ).forEach( function( button ) {
		if ( button !== el ) {
			button.setAttribute( 'aria-expanded', 'false' );
		}
	} );

	// Toggle aria-expanded on the button.
	eightriseToggleAriaExpanded( el, true );

	// On tab-away collapse the menu.
	el.parentNode.querySelectorAll( 'ul > li:last-child > a' ).forEach( function( linkEl ) {
		linkEl.addEventListener( 'blur', function( event ) {
			if ( ! el.parentNode.contains( event.relatedTarget ) ) {
				el.setAttribute( 'aria-expanded', 'false' );
			}
		} );
	} );
}

( function() {
	/**
	 * Menu Toggle Behaviors
	 *
	 * @since 8rise Theme 1.0
	 *
	 * @param {string} id - The ID.
	 */
	var navMenu = function( id ) {
		var wrapper = document.body, // this is the element to which a CSS class is added when a mobile nav menu is open
			mobileButton = document.getElementById( 'menumobilebtn' ),
			navMenuEl = document.getElementById( 'pagemenu' );
			navMenuElAlt = document.getElementById( 'onepagemenu' );

		if (navMenuElAlt) {
			navMenuEl = navMenuElAlt;
		}

		// If there's no nav menu, none of this is necessary.
		if ( !navMenuEl ) {
			return;
		}

		if ( mobileButton ) {
			mobileButton.onclick = function() {
				wrapper.classList.toggle( id + '-navigation-open' );
				wrapper.classList.toggle( 'lock-scrolling' );				
		 		document.getElementById( 'menu' ).classList.toggle( 'active' );
		 		document.getElementById( 'logo' ).classList.toggle( 'active' );
		 		//document.getElementById( 'socialiconcontainer' ).classList.remove( 'active' );
				eightriseToggleAriaExpanded( mobileButton );
				mobileButton.focus();
			};
		}

		/**
		 * Trap keyboard navigation in the menu modal.
		 * Adapted from Twenty Twenty.
		 *
		 * @since 8rise Theme 1.0
		 */
		document.addEventListener( 'keydown', function( event ) {
			var modal, elements, selectors, lastEl, firstEl, activeEl, tabKey, shiftKey, escKey;
			if ( ! wrapper.classList.contains( id + '-navigation-open' ) ) {
				return;
			}
			modal = document.querySelector( '#menu .menucenter' );
			selectors = 'a, li';
			elements = modal.querySelectorAll( selectors );
			elements = Array.prototype.slice.call( elements );
			tabKey = event.keyCode === 9;
			shiftKey = event.shiftKey;
			escKey = event.keyCode === 27;
			activeEl = document.activeElement; // eslint-disable-line @wordpress/no-global-active-element
			lastEl = elements[ elements.length - 1 ];
			firstEl = elements[0];

			if ( escKey ) {
				event.preventDefault();
				wrapper.classList.remove( id + '-navigation-open', 'lock-scrolling' );
				eightriseToggleAriaExpanded( mobileButton );
				mobileButton.focus();
			}

			if ( ! shiftKey && tabKey && lastEl === activeEl ) {
				event.preventDefault();
				firstEl.focus();
			}

			if ( shiftKey && tabKey && firstEl === activeEl ) {
				event.preventDefault();
				lastEl.focus();
			}

			// If there are no elements in the menu, don't move the focus
			if ( tabKey && firstEl === lastEl ) {
				event.preventDefault();
			}
		} );

		/**
		 * Close menu and scroll to anchor when an anchor link is clicked.
		 * Adapted from Twenty Twenty.
		 *
		 * @since 8rise Theme 1.0
		 */
		document.addEventListener( 'click', function( event ) {
			// If target onclick is <a> with # within the href attribute
			if ( event.target.hash && event.target.hash.includes( '#' ) && !event.target.hash.includes( '#mobilemenu' )) {
				wrapper.classList.remove( id + '-navigation-open', 'lock-scrolling' );
				eightriseToggleAriaExpanded( mobileButton );
				// Wait 550 and scroll to the anchor.
				setTimeout(function () {
					var anchor = document.getElementById(event.target.hash.slice(1));
					anchor.scrollIntoView();
				}, 550);
			}
		} );

		navMenuEl.querySelectorAll( '.menu-item-has-children' ).forEach( function( li ) {
			li.addEventListener( 'mouseenter', function() {
				var subMenuEl = this.querySelector( '.sub-menu-toggle' );
				if (subMenuEl) {
					subMenuEl.setAttribute( 'aria-expanded', 'true' );
				}
			} );
			li.addEventListener( 'mouseleave', function() {
				var subMenuEl = this.querySelector( '.sub-menu-toggle' );
				if (subMenuEl) {				
					subMenuEl.setAttribute( 'aria-expanded', 'false' );
				}				
			} );
		} );
	};

	window.addEventListener( 'load', function() {
		new navMenu( 'primary' );
	} );
}() );


/**
 * More button if too much tabs and subtab scroll if too small
 *
 * @since 8rise Theme 1.0
 *
 */

// function eightriseAddMoreBtn( event ) {

// 	var windowsHeight = window.innerHeight,
// 	windowsWidth = window.innerWidth,
// 	subMenuMaxHeight = 0,
// 	MoreMaxHeight = 0,
// 	OuterMenuStyle = window.getComputedStyle(OuterMenu),
// 	menuTrueWidth = 0,
// 	lastMenuTab,
// 	newMoreBtn = document.createElement("li"),
// 	newMoreSubMenu ='<a href="#" class="oppositecolortxt1">More</a>' +
// 	'<button class="sub-menu-toggle" aria-expanded="false" onClick="eightriseExpandSubMenu(this)">' +
// 	'<span class="icon-minus dashicons dashicons-arrow-down oppositecolortxt1"></span>' +
// 	'<span class="icon-plus dashicons dashicons-arrow-up oppositecolortxt1"></span>' +
// 	'<span class="screen-reader-text">Open menu</span>' +
// 	'</button>' +
// 	'<ul class="sub-menu"></ul>';
	
// 	newMoreBtn.setAttribute("id", "moreBtn");
// 	newMoreBtn.setAttribute("class", "menurow");
// 	newMoreBtn.innerHTML = newMoreSubMenu;
// 	lastMenuTab = undefined;

// 	var CurrentMoreBtn = document.getElementById("moreBtn");

// 	if (window.innerWidth <= 800) {
// 		if (CurrentMoreBtn) {
// 			var CurrentMoreBtnChild = CurrentMoreBtn.querySelector(".sub-menu");
// 			OuterMenu.querySelectorAll("#moreBtn > .sub-menu > .menurow").forEach( function ( menuTab ) {
// 				menuContainer.appendChild(menuTab);
// 			} );
// 			CurrentMoreBtn.remove();
// 		}

// 		menuContainer.style.display="block";
// 		mobileMenuMaxHeight = menuContainer.scrollHeight;
// 		menuContainer.style.display="";

// 		if (windowsHeight - 120 < mobileMenuMaxHeight) {
// 			menuContainer.style.height = windowsHeight - 120 + "px";
// 			if (!menuContainer.classList.contains("scrollable")) {
// 				menuContainer.classList.toggle( 'scrollable' );
// 			}
// 		} else {
// 			if (menuContainer.classList.contains("scrollable")) {
// 				menuContainer.classList.toggle( 'scrollable' );
// 			}
// 			menuContainer.style.height="auto";
// 		}

// 		return;
// 	} else {
// 		if (menuContainer.classList.contains("scrollable")) {
// 			menuContainer.classList.toggle( 'scrollable' );
// 		}
// 		menuContainer.style.height="";
// 	}

// 	if (CurrentMoreBtn) {
// 		var CurrentMoreBtnChild = CurrentMoreBtn.querySelector(".sub-menu");
// 		CurrentMoreBtn.addEventListener( 'mouseenter', function() {
// 			this.querySelector( '.sub-menu-toggle' ).setAttribute( 'aria-expanded', 'true' );
// 		} );
// 		CurrentMoreBtn.addEventListener( 'mouseleave', function() {
// 			this.querySelector( '.sub-menu-toggle' ).setAttribute( 'aria-expanded', 'false' );
// 		} );
// 	}

// 	var menuElements = OuterMenu.querySelectorAll("#pagemenu > .menurow");
//     var menuElementsLenght = menuElements.length;
// 	var menuElementIndex = 0;
	
// 	menuElements.forEach( function( menuTab ) {

// 		menuTrueWidth = menuTrueWidth + parseInt(window.getComputedStyle(menuTab).width);
// 		menuElementIndex += 1;

// 		if ( parseInt(OuterMenuStyle.width) < menuTrueWidth + 100 ) {
// 			if (!CurrentMoreBtn) {
// 				menuContainer.appendChild(newMoreBtn);
// 				CurrentMoreBtn = newMoreBtn;
// 				CurrentMoreBtnChild = newMoreBtn.querySelector(".sub-menu");
// 				newMoreBtn.addEventListener( 'mouseenter', function() {
// 					this.querySelector( '.sub-menu-toggle' ).setAttribute( 'aria-expanded', 'true' );
// 				} );
// 				newMoreBtn.addEventListener( 'mouseleave', function() {
// 					this.querySelector( '.sub-menu-toggle' ).setAttribute( 'aria-expanded', 'false' );
// 				} );
// 			}

// 			if (event === "resize") {
// 				if (menuTab.getAttribute('id') === "moreBtn") {

// 				} else {
// 					var subMenuEl = menuTab.getElementsByTagName('ul')[0];
// 					if (subMenuEl && subMenuEl.classList.contains("scrollable")) {
// 						subMenuEl.classList.toggle( 'scrollable' );
// 					}
// 					if (!lastMenuTab){
// 						CurrentMoreBtnChild.insertBefore(menuTab, CurrentMoreBtnChild.firstElementChild);
// 						lastMenuTab = menuTab;
// 					} else {
// 						CurrentMoreBtnChild.insertBefore(menuTab, lastMenuTab.nextSibling);
// 						lastMenuTab = menuTab;
// 					}
// 				}
// 			} else {	
// 				CurrentMoreBtnChild.appendChild(menuTab);	
// 			}	
			 
// 		} else {
// 			if (menuElementIndex >= menuElementsLenght) {
// 				if (CurrentMoreBtnChild) {
// 					if ( CurrentMoreBtnChild.children.length >= 1) {
// 						var moreBtnElements = OuterMenu.querySelectorAll("#moreBtn > .sub-menu > .menurow");
// 						var moreBtnElementsLenght = moreBtnElements.length;
// 						var moreBtnElementIndex = 0;
// 						OuterMenu.querySelectorAll("#moreBtn > .sub-menu > .menurow").forEach( function ( subTab ) {
// 							moreBtnElementIndex += 1;
// 							CurrentMoreBtnChild.style.display="block";
// 							var subTabA = subTab.getElementsByTagName('a')[0];
// 							subTabA.style.display="inline-block";
// 							subTabWidth = subTabA.offsetWidth;
// 							subTabA.style.display="";
// 							CurrentMoreBtnChild.style.display="";
// 							if((subTabWidth + menuTrueWidth + 100) < parseInt(OuterMenuStyle.width)) {
// 								menuContainer.insertBefore(subTab, menuContainer.lastChild);
// 								menuTrueWidth = menuTrueWidth + subTabWidth;
// 								if(moreBtnElementIndex >= moreBtnElementsLenght) {
// 									CurrentMoreBtn.remove();
// 								}
// 							}
// 						} );
// 					} else if ( CurrentMoreBtnChild.children.length <= 0) {
// 						CurrentMoreBtn.remove();
// 					}	
// 				}
// 			}
// 		}

// 	} );

// 	OuterMenu.querySelectorAll("#pagemenu > .menurow").forEach( function( menuTab ) {

// 		var subMenuEl = menuTab.getElementsByTagName('ul')[0];

// 		if (subMenuEl) {

// 			subMenuEl.style.display="block";
// 			subMenuMaxHeight = subMenuEl.scrollHeight;
// 			subMenuEl.style.display="";

// 			if (windowsHeight - 120 < subMenuMaxHeight) {
// 				subMenuEl.style.height = windowsHeight - 120 + "px";
// 				if (!subMenuEl.classList.contains("scrollable")) {
// 					subMenuEl.classList.toggle( 'scrollable' );
// 				}
// 			} else {
// 				if (subMenuEl.classList.contains("scrollable")) {
// 					subMenuEl.classList.toggle( 'scrollable' );
// 				}
// 				subMenuEl.style.height="auto";
// 			}

// 		}

// 	} );	

// }

// var timeOutFunctionId,
// OuterMenu = document.getElementById("menu"),
// menuContainer = document.getElementById("pagemenu");

// window.addEventListener('resize', function(event) {

// 	if(OuterMenu && menuContainer){
// 		clearTimeout(timeOutFunctionId);
// 		timeOutFunctionId = setTimeout(function(){ eightriseAddMoreBtn("resize"); }, 1000);
// 	}

// }, true);

// document.addEventListener("DOMContentLoaded", function(event) {

// 	if(OuterMenu && menuContainer){
// 		eightriseAddMoreBtn("load");
// 	}

// }, true);

/**
 * Mobile menu if to much tabs and subtab scroll if too small
 *
 * @since 8rise Theme 1.0
 *
 */

 function eightriseAddMoreBtn( event ) {

	var windowsHeight = window.innerHeight,
	windowsWidth = window.innerWidth,
	subMenuMaxHeight = 0,
	MoreMaxHeight = 0,
	OuterMenuStyle = window.getComputedStyle(OuterMenu),
	menuTrueWidth = 0,
	lastMenuTab = undefined

	if (window.innerWidth <= 800) {

		menuContainer.style.display="block";
		mobileMenuMaxHeight = menuContainer.scrollHeight;
		menuContainer.style.display="";

		header.classList.add("mobileOn");

		if (windowsHeight - 120 < mobileMenuMaxHeight) {
			menuContainer.style.height = windowsHeight - 120 + "px";
			if (!menuContainer.classList.contains("scrollable")) {
				menuContainer.classList.toggle( 'scrollable' );
			}
		} else {
			if (menuContainer.classList.contains("scrollable")) {
				menuContainer.classList.toggle( 'scrollable' );
			}
			menuContainer.style.height="auto";
		}

		return;

	} else {

		if (menuContainer.classList.contains("scrollable")) {
			menuContainer.classList.toggle( 'scrollable' );
		}
		menuContainer.style.height="";

		var menuElements = OuterMenu.querySelectorAll("#pagemenu > .menurow");
		var menuElementsLenght = menuElements.length;
		var menuElementIndex = 0;
		
		menuElements.forEach( function( menuTab ) {
	
			menuContainer.style.display="";
	
			menuTrueWidth = menuTrueWidth + parseInt(window.getComputedStyle(menuTab).width);
			menuElementIndex += 1;
	
			var subMenuEl = menuTab.getElementsByTagName('ul')[0];
	
			if ( parseInt(OuterMenuStyle.width) < menuTrueWidth + 100 ) {
	
				if (event === "resize") {
	
					if (subMenuEl && subMenuEl.classList.contains("scrollable")) {
						subMenuEl.classList.toggle( 'scrollable' );
					}
					if (!lastMenuTab){
						lastMenuTab = menuTab;
					} else {
						lastMenuTab = menuTab;
					}
	
				} else {	
	
				}	
	
				header.classList.add("mobileOn");
	
			} else {
				
			}
	
			if (subMenuEl) {
	
				subMenuEl.style.display="block";
				subMenuMaxHeight = subMenuEl.scrollHeight;
				subMenuEl.style.display="";
	
				if (windowsHeight - 120 < subMenuMaxHeight) {
					subMenuEl.style.height = windowsHeight - 120 + "px";
					if (!subMenuEl.classList.contains("scrollable")) {
						subMenuEl.classList.toggle( 'scrollable' );
					}
				} else {
					if (subMenuEl.classList.contains("scrollable")) {
						subMenuEl.classList.toggle( 'scrollable' );
					}
					subMenuEl.style.height="auto";
				}
	
			}
	
		} );

	}

}

var timeOutFunctionId,
header = document.getElementById("header"),
OuterMenu = document.getElementById("menu"),
menuContainer = document.getElementById("pagemenu");

window.addEventListener('resize', function(event) {

	if(OuterMenu && menuContainer){
		header.classList.remove("mobileOn");
		eightriseAddMoreBtn("resize");
		//clearTimeout(timeOutFunctionId);
		//timeOutFunctionId = setTimeout(function(){ eightriseAddMoreBtn("resize"); }, 100);
	}

}, true);

document.addEventListener("DOMContentLoaded", function(event) {

	if(OuterMenu && menuContainer){
		eightriseAddMoreBtn("load");
	}

}, true);