/* === MEGAMENU TABS === */

var $=jQuery.noConflict();
// Passive event listeners (fix lighthouse warning)
jQuery.event.special.touchstart = {
  setup: function( _, ns, handle ) {
      this.addEventListener("touchstart", handle, { passive: ns.includes("noPreventDefault") });
  }
};
jQuery.event.special.touchmove = {
  setup: function( _, ns, handle ) {
      this.addEventListener("touchmove", handle, { passive: ns.includes("noPreventDefault") });
  }
};

$(document).ready(function(){

        /* === MAIN MENU === */

        $("nav#main-nav").accessibleMegaMenu({
            /* prefix for generated unique id attributes, which are required
            to indicate aria-owns, aria-controls and aria-labelledby */
            uuidPrefix: "accessible-megamenu-main",

            /* css class used to define the megamenu styling */
            menuClass: "nav-menu",

            /* css class for a top-level navigation item in the megamenu */
            topNavItemClass: "nav-item",

            /* css class for a megamenu panel */
            panelClass: "sub-nav",

            /* css class for a group of items within a megamenu panel */
            panelGroupClass: "sub-nav-group",

            /* css class for the hover state */
            hoverClass: "hover",

            /* css class for the focus state */
            focusClass: "focus",

            /* css class for the open state */
            openClass: "open",

            // default open delay when opening menu via mouseover
            openDelay: 100,

            // default close delay when opening menu via mouseover
            closeDelay: 100
        });

        /* === TOP MENU === */

        $("nav#top-nav").accessibleMegaMenu({
            /* prefix for generated unique id attributes, which are required
            to indicate aria-owns, aria-controls and aria-labelledby */
            uuidPrefix: "accessible-megamenu-top",

            /* css class used to define the megamenu styling */
            menuClass: "nav-menu-top",

            /* css class for a top-level navigation item in the megamenu */
            topNavItemClass: "nav-item-top",

            /* css class for a megamenu panel */
            panelClass: "sub-nav-top",

            /* css class for a group of items within a megamenu panel */
            panelGroupClass: "sub-nav-group-top",

            /* css class for the hover state */
            hoverClass: "hover",

            /* css class for the focus state */
            focusClass: "focus",

            /* css class for the open state */
            openClass: "open",

            // default open delay when opening menu via mouseover
            openDelay: 100,

            // default close  delay when opening menu via mouseover
            closeDelay: 100

        });


/* ACCORDION MOBILE */

  $(function() {
    $('.js-accordion').accordion({
      headersSelector: '> .js-accordion__header', // relative to panel
      panelsSelector: '> .js-accordion__panel', // relative to wrapper
      buttonsSelector: '> button.js-accordion__header' // relative to wrapper
    });
  });

  /*STUDENTS LINKS MOBILE */

    var students_links = $("#top-nav-mobile .students-links > a");
    var students_links_sub = $("#top-nav-mobile .students-links .sub-nav-top");
    var staff_links = $("#top-nav-mobile .staff-links > a");
    var staff_links_sub = $("#top-nav-mobile .staff-links .sub-nav-top");

    $(students_links).click(function(){

      $(staff_links).removeClass("open");
      $(staff_links).attr('aria-expanded', 'false');
      $(staff_links_sub).removeClass("open");
      $(staff_links_sub).attr('aria-expanded', 'false');
      $(staff_links_sub).attr('aria-hidden', 'true');


      if ($(this).hasClass('open')) {
        $(students_links).removeClass("open");
        $(students_links).attr('aria-expanded', 'false');
        $(students_links_sub).removeClass("open");
        $(students_links_sub).attr('aria-expanded', 'false');
        $(students_links_sub).attr('aria-hidden', 'true');
      }else{
        $(students_links).addClass("open");
        $(students_links).attr('aria-expanded', 'true');
        $(students_links_sub).addClass("open");
        $(students_links_sub).attr('aria-expanded', 'true');
        $(students_links_sub).attr('aria-hidden', 'false');
      }

    });

    $(staff_links).click(function(){

      $(students_links).removeClass("open");
      $(students_links).attr('aria-expanded', 'false');
      $(students_links_sub).removeClass("open");
      $(students_links_sub).attr('aria-expanded', 'false');
      $(students_links_sub).attr('aria-hidden', 'true');


      if ($(this).hasClass('open')) {
        $(staff_links).removeClass("open");
        $(staff_links).attr('aria-expanded', 'false');
        $(staff_links_sub).removeClass("open");
        $(staff_links_sub).attr('aria-expanded', 'false');
        $(staff_links_sub).attr('aria-hidden', 'true');
      }else{
        $(staff_links).addClass("open");
        $(staff_links).attr('aria-expanded', 'true');
        $(staff_links_sub).addClass("open");
        $(staff_links_sub).attr('aria-expanded', 'true');
        $(staff_links_sub).attr('aria-hidden', 'false');
      }

  });




}); //end of jQuery


/* === VANILLA JS FUNCTIONS === */

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

// FIX SAFARI FOR MEGA MENUS

var isSafari = window.safari !== undefined;
if (isSafari) {


// MAIN NAV
const list_els = document.querySelectorAll("#main-nav .nav-menu > li");

list_els.forEach((el) => {

  el.querySelector("a").addEventListener('click', event => {


      let subNav = el.querySelector(".sub-nav");



      if(!subNav.classList.contains("open")) {
          let open_el = document.querySelector("#main-nav .nav-menu li .sub-nav.open")
          let active_link = document.querySelector("#main-nav .nav-menu li a.open")

          //console.log("open new", event.target);

          subNav.classList.add("open");
          subNav.ariaExpanded= 'true'
          subNav.ariaHidden= 'false'
          event.target.classList.add("open");
          event.target.ariaExpanded= 'true'

          if(open_el && open_el != subNav) {
          //console.log("close other tab main nav", open_el);
          open_el.classList.remove("open");
          open_el.ariaExpanded = 'false'
          open_el.ariaHidden = 'true'

          if(active_link){
            //console.log("close item a", active_link)
            active_link.classList.remove("open");
            active_link.ariaExpanded = 'false'
          }
      }

      } else {
          //console.log("clode open");
          subNav.classList.remove("open");
          subNav.ariaExpanded = 'false'
          subNav.ariaHidden = 'true'
          event.target.classList.remove("open");
          event.target.ariaExpanded = 'false'
      }

      this.addEventListener('mouseout', e => {
      e.stopPropagation();
  }, true)



  });

});


    // FOR HOVER EFFECTS ON SUB_TAB LINKS
    const sub_list_child = document.querySelectorAll('.tabs-menu .tab-item .sub-tab a[role="tab"]');


    //console.log("a role-tab", sub_list_child);

    sub_list_child.forEach(item => {


        item.addEventListener('mouseover', event => {

         	if(!item.classList.contains("hover")) {
            	item.classList.add("hover");
            	item.ariaSelected = 'true';
       		}
    	});

        item.addEventListener('mouseleave', event => {

         	if(item.classList.contains("hover")) {
            	item.classList.remove("hover");
            	item.ariaSelected = 'false';
        	}
    	});


    });


// ON CLICK OUTSIDE THE EVENT TARGET
document.addEventListener('click', event => {

    let open_el_top_nav = document.querySelector("#top-nav .nav-menu-top li .sub-nav-top.open")
    let active_link_top_nav = document.querySelector("#top-nav .nav-menu-top li a.open")
    let open_el = document.querySelector("#main-nav .nav-menu li .sub-nav.open")
    let active_link = document.querySelector("#main-nav .nav-menu li a.open")
    let sub_nav_group_link = document.querySelector(".sub-nav-group .tabs-container .tabs-menu .tab-item a");

    // TOP NAV
    if(open_el_top_nav || active_link_top_nav ) {

		if( !open_el_top_nav.contains(event.target) && event.target != active_link_top_nav ) {
			 //console.log("top");
              open_el_top_nav.classList.remove("open");
			  open_el_top_nav.ariaExpanded = 'false';
			  open_el_top_nav.ariaHidden = 'true';
				active_link_top_nav.classList.remove("open");
			active_link_top_nav.ariaExpanded = 'false';
			active_link_top_nav.ariaHidden = 'true';

		  }
    }



    // MAIN NAV
    if(open_el || active_link) {

    if(event.target != open_el && event.target != active_link && !open_el.contains(event.target) ) {
			 //console.log("click outsite main nav");
          open_el.classList.remove("open");
          open_el.ariaExpanded = 'false';
          open_el.ariaHidden = 'true';


          if(active_link){
            active_link.classList.remove("open");
            active_link.ariaExpanded = 'false'
          }
      }
    }
 });




// TOP NAV
const list_els_top = document.querySelectorAll("#top-nav .nav-menu-top li");

list_els_top.forEach((el) => {

  el.querySelector("a").addEventListener('click', event => {

      let open_el = document.querySelector("#top-nav .nav-menu-top li .sub-nav-top.open")
      let active_link_top_nav = document.querySelector("#top-nav .nav-menu-top li a.open")
      let subNavTop = el.querySelector(".sub-nav-top");

	  let searchButton = el.querySelector("#top-search-button");
	  let searchButton_open = document.querySelector("#top-search-button.open");
	  let searchContainer = el.querySelector("#top-search-container");
	  let searchContainer_open = document.querySelector("#top-search-container.open");

      if(open_el && open_el != subNavTop) {
          open_el.classList.remove("open");
          open_el.ariaExpanded = 'false'
          open_el.ariaHidden = 'true'

          if(active_link_top_nav){
            active_link_top_nav.classList.remove("open");
            active_link_top_nav.ariaExpanded = 'false'
          }
      }

      if(!subNavTop.classList.contains("open")) {
          subNavTop.classList.add("open");
          subNavTop.ariaExpanded= 'true'
          subNavTop.ariaHidden= 'false'
          event.target.classList.add("open");
          event.target.ariaExpanded= 'true'
      } else {
          subNavTop.classList.remove("open");
          subNavTop.ariaExpanded = 'false'
          subNavTop.ariaHidden = 'true'
          event.target.classList.remove("open");
          event.target.ariaExpanded = 'false'
      }

	  /* */

      if(searchContainer_open && searchContainer_open != searchContainer) {
          searchContainer_open.classList.remove("open");
          searchContainer_open.ariaExpanded = 'false'
          searchContainer_open.ariaHidden = 'true'

          if(searchButton_open){
            searchButton_open.classList.remove("open");
            searchButton_open.ariaExpanded = 'false'
          }
      }

      if(searchButton && !searchButton.classList.contains("open")) {
          searchButton.classList.add("open");
          searchButton.ariaExpanded = 'true'
          searchButton.ariaHidden= 'false'
          event.target.classList.add("open");
          event.target.ariaExpanded= 'true'
      } else {
		  if(searchButton){
          searchButton.classList.remove("open");
          searchButton.ariaExpanded = 'false'
          searchButton.ariaHidden = 'true'
          event.target.classList.remove("open");
          event.target.ariaExpanded = 'false'
			  }
      }


      this.addEventListener('mouseout', e => {
      e.stopPropagation();
  }, true)


  });

});




}
//end of safari fix





        /* === Change panels on click === */
    var tabs = document.querySelectorAll('.tabs-menu [role=tab]'); //get all role=tab elements as a variable
    for (i = 0; i < tabs.length; i++) { tabs[i].addEventListener("click", showTabPanel); } //add click event to each tab to run the showTabPanel function
    function showTabPanel(el) { //runs when tab is clicked
      var tabs2 = document.querySelectorAll('.tabs-menu [role=tab]'); //get tabs again as a different variable
      for (i = 0; i < tabs2.length; i++) {tabs2[i].setAttribute('aria-selected','false');} //reset all tabs to aria-selected=false and normal font weight
      el.target.setAttribute('aria-selected', 'true'); //set aria-selected=true for clicked tab
      var tabPanelToOpen = el.target.getAttribute('aria-controls'); //get the aria-controls value of the tab that was clicked
      var tabPanels = document.querySelectorAll('.sub-nav.open .tabs-container [role=tabpanel]'); //get all tabpanels as a variable
      for (i = 0; i < tabPanels.length; i++) {
          tabPanels[i].classList.remove('open'),
          tabPanels[i].style.display = "none";
      } //hide all tabpanels
      document.getElementById(tabPanelToOpen).classList.add('open')
      document.getElementById(tabPanelToOpen).style.display = "block"; //show tabpanel who's tab was clicked
    }





    /* === Hide other accordions on click ===  */
    // grab all the buttons
    let Buttons = document.querySelectorAll("a.parent-tab");

    /*console.log(Buttons);*/
    // loop through the buttons using for..of
    for (let button of Buttons) {

    // listen for a click event
    button.addEventListener('click', (e) => {
      // Store the event target in a const
      var et = e.target;

      // select active class
      var active = document.querySelector(".sub-nav.open .tabs-menu .active");
      /* when a button is clicked, remove the active class
    from the button that has it */
      if (active) {
        active.classList.remove("active");
      }

      // Add active class to the parent clicked element
      et.parentNode.classList.add("active");

      // select all classes with the name content
      let allContent = document.querySelectorAll('.sub-nav.open [role="tablist"] .sub-tab');


      // loop through all content classes
      for (let content of allContent) {

        /* display the content if the value in the data attribute of the button and content are the same */
        if(content.getAttribute('data-id') === button.getAttribute('data-id')) {
        // content.style.display = "block";
        content.setAttribute('aria-selected','true');
        }

        // if it's not equal then hide it.
        else {
          //  content.style.display = "none";
        content.setAttribute('aria-selected','false');
          }
        }
    });
    }



    /* HAMBURGER ICON MOBILE */
      // Set button to click.
      var burgerbutton = document.getElementById( 'menu-toggle' );
      var menuaccordion = document.getElementById( 'menu-accordion');

      // Click the button.
      burgerbutton.onclick = function() {

        // Toggle class "opened". Set also aria-expanded to true or false.
        if ( -1 !== burgerbutton.className.indexOf( 'is-active' ) ) {
          burgerbutton.className = burgerbutton.className.replace( ' is-active', '' );
          burgerbutton.setAttribute( 'aria-expanded', 'false' );
        } else {
          burgerbutton.className += ' is-active';
          burgerbutton.setAttribute( 'aria-expanded', 'true' );
        }

          // Toggle class "opened". Set also aria-expanded to true or false.
          if ( -1 !== menuaccordion.className.indexOf( 'is-active' ) ) {
            menuaccordion.className = menuaccordion.className.replace( ' is-active', '' );
            menuaccordion.setAttribute( 'aria-hidden', 'true' );
          } else {
            menuaccordion.className += ' is-active';
            menuaccordion.setAttribute( 'aria-hidden', 'false' );
          }
      };



    /* REMOVE OUTLINE ON FOCUS WHEN USING MOUSE */
    /*! outline.js v1.2.0 - https://github.com/lindsayevans/outline.js/ */

    (function(d){

      var style_element = d.createElement('STYLE'),
          dom_events = 'addEventListener' in d,
          add_event_listener = function(type, callback){
          // Basic cross-browser event handling
          if(dom_events){
            d.addEventListener(type, callback);
          }else{
            d.attachEvent('on' + type, callback);
          }
        },
          set_css = function(css_text){
          // Handle setting of <style> element contents in IE8
          !!style_element.styleSheet ? style_element.styleSheet.cssText = css_text : style_element.innerHTML = css_text;
        }
      ;

      d.getElementsByTagName('HEAD')[0].appendChild(style_element);

      // Using mousedown instead of mouseover, so that previously focused elements don't lose focus ring on mouse move
      add_event_listener('mousedown', function(){
        set_css(':focus, .focus{outline:0!important}::-moz-focus-inner{border:0!important;}');
      });

      add_event_listener('keydown', function(){
        set_css('');
      });


    })(document);

    if (window.MutationObserver) {
      var searchcontainer = document.getElementById('top-search-container');
      var observer = new MutationObserver(function(mutations) {

        var searchbutton = document.getElementById('top-search-button');


        var masthead = document.getElementById("masthead");
        if(searchcontainer.classList.contains("open")){
          masthead.classList.add("alter-logo");
        }else{
          masthead.classList.remove("alter-logo");
          setTimeout(function() {
            searchbutton.classList.remove("open");
            }, 30);
        }


      });
      observer.observe(searchcontainer, {
        attributes: true,
        attributeFilter: ['aria-expanded', 'class']  }
      );

      searchcontainer.dataset.selectContentVal = 1;
    }




    /* APP ARMOR PLUGIN */
      var element = document.getElementsByClassName('apparmor-alert')[0];
      //var element =  document.getElementById('AppArmorAlertID_7');
      if (typeof(element) != "undefined")
      {
        document.body.classList.add('AppArmor-active-padding');
      }






//end content loaded
});