/* 
Simple JQuery menu.
HTML structure to use:

Notes: 

1: each menu MUST have an ID set. It doesn't matter what this ID is as long as it's there.
2: each menu MUST have a class 'menu' set. If the menu doesn't have this, the JS won't make it dynamic

Optional extra classnames:

noaccordion : no accordion functionality
collapsible : menu works like an accordion but can be fully collapsed
expandfirst : first menu item expanded at page load

web: http://www.i-marco.nl/weblog/
*/

function initMenus() {
	$('ul.direct ul').hide();
	$.each($('ul.direct'), function(){
		$('#' + this.id + '.expandfirst ul:first').show();
	});
	$('ul.direct li a').click(
		function() {
			var checkElement = $(this).next();
			var parent = this.parentNode.parentNode.id;

			if($('#' + parent).hasClass('noaccordion')) {
				$(this).next().slideToggle('normal');
				return false;
			}
			if((checkElement.is('ul')) && (checkElement.is(':visible'))) {
				if($('#' + parent).hasClass('collapsible')) {
					$('#' + parent + ' ul:visible').slideUp('normal');
				}
				return false;
			}
			if((checkElement.is('ul')) && (!checkElement.is(':visible'))) {
				$('#' + parent + ' ul:visible').slideUp('normal');
				checkElement.slideDown('normal');
				return false;
			}
		}
	);
}

$(document).ready(function() {
  // - - - - - -
  //	ADDING CURRENT CLASSES
  // - - - - - - 
  var path = location.pathname.slice(1,-1)+location.search;
  path = path.split("/")
  
  var index = (path[0] == "abroad")?1:0;
  $("#nav_"+path[index]).addClass("current");
    
  if (path[0] == 'studyabroad') {$("#nav_abroad").addClass("current");};
  
  if (path[0] == 'abroad') {
  	switch(path[1]){
  		case 'about': $("#nav_aboutcgs").addClass("current");break;
  		case 'predeparture': $("#nav_gettingready").addClass("current");break;
  	  case 'alumni': $("#nav_cominghome").addClass("current");break;
  	}
  };
  
  
  // Lets set the current link if there is any
  var current = $('#subNav a[href='+location.pathname+location.search+']');
  $(current).addClass("current").siblings("a.toggle").addClass("siblingHover");
  if ($(current).is(":only-child")) {$(current).parent().parent().siblings("a").addClass("current-parent")};
  
  
  // - - - - - -
  //	Menu Interaction
  // - - - - - - 
  
  	$('#subNav ul ul li:has(ul li)').prepend("<a class=\"toggle\">toggle</a>")
  	
  	$("#subNav a.toggle,#subNav a[href='#']").click(function(){
	    if ($.browser.msie) {
	      $(this).siblings("ul").toggle()
	    } else {
	      $(this).siblings("ul").slideToggle()
	    }
	    
	    if ($(this).hasClass("toggle")) {
	      $(this).toggleClass("expanded")
	    } else{
	      $(this).siblings(".toggle").toggleClass("expanded")
	    };
	  })
	  
	  $("#subNav a").hover(// add a hover class to the toggle. This is just so things look nicer
	    function() {
	      $(this).siblings("a.toggle").addClass("siblingHover")
	    },
	    function() {
	      if ($(this).not('.current').length != 0) // Is it an active link? If so, don't remove the hover class
	        $(this).siblings("a.toggle").removeClass("siblingHover")
	    }
	  );
	  
	  // If there is a current class in a nested submenu, Open it
	  $("ul:has('a.current')").show()
	                          .siblings('a.toggle').addClass('expanded')
	                          .siblings("a:not(.toggle)").addClass("current-parent").removeClass("current")
	  $('#subNav ul li ul li a.current').siblings('a.toggle').addClass('expanded')
	  
	  // If there is a current class on a parent with children, show the children
	  $("a.current").siblings("ul:has('li')").show();
  
  // If there is only one item, show the submenu
  $("#subNav ul li ul li:only-child").children("ul").show().siblings('a.toggle').addClass('expanded')
  
  initMenus();
  
  $(".destination a").bind('click',function(event){
  	event.preventDefault();
  	var continent = $(this).text()
  	var old = $(".continent:visible")
  	$("#"+continent).fadeIn(500)
  	$(old).fadeOut(1000)
  })
});
