$(document).ready(function(){
	
	$(function() {
		$('a[href^=http]').click( function() {
			window.open(this.href);
			return false;
		});
	});
	
	$('ul#buttonMenu li').click(function(){
		//eerst kijken of deze knop een submenu heeft
		if($('ul', this).size() == 1){
			//dan kijken of er al een submenu is dat ingeklapt moet worden.
			var closingSub = $('li.subContainer ul').attr('id');
			var clickedEl = $(this);
			var thisHTML = $('ul', this).attr('id');
			if($('li.subContainer').size() == 1){
				$('li.subContainer ul').hide("normal").queue(
					function(){$('li.subContainer').remove().queue(function(){menuUitklappen(clickedEl, closingSub, thisHTML)})}
				);
			} else {menuUitklappen(clickedEl, closingSub, thisHTML)}
		}
	});
	
});

	function menuUitklappen(elem, closingSub, thisHTML){
		//nu andere submenu uitklappen, NIET als het hetzelfde submenu betreft dat net ingeklapt is.
		if(thisHTML != closingSub){
			var clickedIndex = parseInt($(elem).index());
			//als menuknop links staat
			if(clickedIndex % 2 == 0){
				var subContainer = $('<li class="subContainer"></li>');
				subContainer.insertAfter($('ul#buttonMenu > li').eq(clickedIndex+1));
				$('ul', elem).clone().appendTo(subContainer).show("normal");
			//als menuknop rechts staat
			} else {
				var subContainer = $('<li class="subContainer"></li>');
				subContainer.css("background-position", "top right");
				subContainer.insertAfter($('ul#buttonMenu > li').eq(clickedIndex));
				$('ul', elem).clone().appendTo(subContainer).show("normal");
			}
		}
	}