/*
 * Constructing
 --------------------------------------------------------------------------*/

$(document).ready(function() {
	
	initMainmenu();
	initSubmenu();
	initLogoMenu();
	initActivebar();
	hideContent();
});

/*
 * Initialization
 --------------------------------------------------------------------------*/
function initMainmenu() {

	/*
	 * Init main menu
	 */
	var position=true; // toggle for top or bottom position
	var previous_item;
	var current_top;
	var offsetstart=offsetsum=40;
	var offset;
	var delaysum=100;
	var finished=false;
	
	$.each($('.mainmenuitem'), function(i,item){
		
		if (position)
			current_top='22px';
		else
			current_top='42px';
		
		$(this).css('display','block')
				.css('filter', 'alpha(opacity=0)')// IE bug fix
					.animate({opacity: 0},0); 
		
		if (previous_item) 
			offsetsum += parseInt(previous_item) - 5;	
		
		$(this).css('top',current_top)
				.css('left',(offsetstart-20) + 'px')
				.delay(delaysum)
				.data('menuid', (i+1))
				.data('orgLeft', offsetsum )
				.bind('load', function(){
					finished=true;
				})
				
				.bind('mouseover', function() {
						$(this).animate({ 
							left: ($(this).data('orgLeft')-10)+'px',
							fontSize:'18px' },300);
				})
				
				.bind('mouseleave', function() {
						$(this).animate({ 
							left: $(this).data('orgLeft') + 'px',
							fontSize: '16px' },500);
				})
				
				.bind('click', function() {
					
					var page_id = String($(this).children('a').attr('id')).split("-");
						page_id = page_id[1];
						
					

					$('#activebar').data('menuid', $(this).data('menuid'));
					$('#activebar').data('pageid', page_id);
				
					hideSubmenu();
					
					if ($(this).data('menuid')==3 || $(this).data('menuid')==4 || $(this).data('menuid')==6 || $(this).data('menuid')==7|| $(this).data('menuid')==8) {
						showAltmenu('logomenu',$('#activebar').data('menuid'));
						showContent();
					}
					else {	
						$('#activebar').data('menuid', $(this).data('menuid'));
						showAltmenu('submenu', $(this).data('menuid'));
						hideContent();
					}
					
	
					
				})
				
				.animate({left: offsetsum + 'px', opacity: 1.0, filter: 'alpha(opacity=100)'},100,function() {
					if(!$.support.opacity)
						$(this).get(0).style.removeAttribute('filter');
					
				});
				
		position= !position;
		delaysum+=100;
		previous_item = $(this).width();
		
	});	
}




function initSubmenu()
{
	$('.close').bind('click',function() {
		hideSubmenu();
		hideContent();
	});
	
	$.each($('div.holder > ul > li'), function(i,item) {
		$(this)
		.bind('click',function(){
			var page_id = String($(this).children('a').attr('id')).split("-");

			$('#activebar').data('pageid', page_id[1]);
			
			showAltmenu('logomenu', $('#activebar').data('menuid'));
			hideSubmenu();
			showContent();
		});
	});
}

function initLogoMenu()
{
	$.each($('#logomenu > .logoitems > ul > li'), function(i,item) {
		$(this)
		.bind('click',function(){
			var page_id = String($(this).children('a').attr('id')).split("-");

			$('#activebar').data('pageid', page_id[1]);
			
			hideSubmenu();
			showContent();
		});
	});	
}



function hideSubmenu() {
	
	for(i=1;i<6;i++) {
		var target = '.items'+i;
		//console.log(target);
		
		if ( $(target).css('display') == 'block')
		{
			 $(target).animate({
					opacity: 0.0,
					filter: 'alpha(opacity=0)',
					marginLeft: '-100px'
				},500, function(){
					if(!$.support.opacity)
						$(this).get(0).style.removeAttribute('filter');
					
					$(this).css('display', 'none');
				});			
		}
	}	
}




function initActivebar() {

	/*
	 * init activebar
	 */
	$('#activebar').css('display','block')
		.css('filter', 'alpha(opacity=0)')// IE bug fix
		.animate({opacity: 0},0); 
	
	$('div.holder > ul > li > a')
	.bind('mouseenter', function(){
		$('#activebar').stop();
		var offset = $(this).offset();
		$('#activebar').css('left', ((offset.left-60) + 'px'))
						.css('top', ((offset.top-6) + 'px'))
						.css('filter', 'alpha(opacity=70)')// IE bug fix
						.animate({
							opacity: 0.7,
							left: ((offset.left-40) + 'px')}
							,200); 		
	})
	.bind('mouseout', function(){
		$('#activebar').stop();
		var offset = $('#activebar').offset();
		$('#activebar').css('left', ((offset.left-60) + 'px'))
						.css('filter', 'alpha(opacity=0)')// IE bug fix
						.animate({opacity: 0.0},0); 			
	});
}

/*
 * Content - show
 */
function showContent() {
	var menu_id = $('#activebar').data('menuid');
	//console.log(menu_id);
	if (menu_id==3){ // Reserveren
		window.open ("reserveren.php", "AlpHotel" , 'width=800,height=600');
		return;
	}
	else if (menu_id==7) { //Reviews
		window.open ("reviews.php", "AlpHotel" , 'width=800,height=600');
		return;		
	}
	
	var handler = 'ajax.php';
	
	var location = 'menuid='+ menu_id + '&' + 
					'pageid='+ $('#activebar').data('pageid');
	
	var url = handler + '?' + location;
	//alert(url);
	
	
	 $('#content')
	 .css('display','block')
	 .animate({
			opacity: 1.0,
			filter: 'alpha(opacity=100)'
	 },800, function() {
			if(!$.support.opacity)
				$(this).get(0).style.removeAttribute('filter');
	 });
	 
	 var pane = $('#pane'); 
	 
	 pane.jScrollPane({
		verticalDragMinHeight: 34,
		verticalDragMaxHeight: 34,
		horizontalDragMinWidth: 20,
		horizontalDragMaxWidth: 20
	});
	 

	var api = pane.data('jsp');
	api.scrollTo(0,0);	
	
	/*Temp condition*/
	
	
	if (menu_id !== 1) {
		$.ajax({
			  url: url,
			  success: function(data) {
			 	api.getContentPane().html(data);
			 	api.reinitialise();
			  }
		});
	}
	else {
	 	api.getContentPane().html('');
	 	api.reinitialise();		
	}
}


/*
 * Content - hide
 */
function hideContent() {
	 $('#content')
	 .css('display','block')
	 .animate({
			opacity: 0.0,
			filter: 'alpha(opacity=0)'
	 },100, function(){
			if(!$.support.opacity)
				$(this).get(0).style.removeAttribute('filter');
			
		 $(this).css('display','none');
	 });
}


function showAltmenu(type,id) {
	
	var loop; 
	var active; 
	var target; 
	var in_params, out_params;
	var in_duration=out_duration=0;
	
	/*
	 * Submenu settings
	 */
	if (type=='submenu') {
		active = '.items';
		target = active + id;
		loop = $(active).size();
		
		in_duration=500;
		out_duration=200;
		
		in_params = {
			opacity: 1.0,
			marginLeft: '0px'
		};
		
		out_params = {
				opacity: 0.0,
				filter: 'alpha(opacity=0)',
				marginLeft: '-100px'
		};			
	}
	
	/*
	 * Logomenu settings
	 */	
	else if (type=='logomenu') {
		active = '.logoitems';
		target = active + id;
		loop = $(active).size();
		
		in_duration=500;
		out_duration=0;		
		
		in_params = {
			opacity: 1.0
		};
		
		out_params = {
				opacity: 0.0,
				filter: 'alpha(opacity=0)'
		};			
	}
	
	for(var i=1;i<=loop;i++) {
		if (active+i==target) {
			$(target).css('display','block')
				.animate(in_params,in_duration, function() {
					if(!$.support.opacity)
						$(this).get(0).style.removeAttribute('filter');					
					
				}); 
		}
		else {
			if($(active+i).css('display')=='block') {
				$(active+i).animate(out_params,out_duration, function(){
					if(!$.support.opacity)
						$(this).get(0).style.removeAttribute('filter');
					
					$(this).css('display', 'none');
				});	
			}
		}
		
	}// /for
}// /function


