$(document).ready(function() 
{
	
	
/*	$("a.group").fancybox({
		'transitionIn'	:	'fade',
		'transitionOut'	:	'fade',
		'speedIn'		:	600, 
		'speedOut'		:	200, 
		'width'			:   1042,
		'scrolling'		: 	'auto',
		'overlayShow'	:	true,
		'centerOnScroll' :  false
	});*/

	
	$('#pinkButton').click(function(){
		window.location = "/block1/plan-van-aanpak.html";
	});
	
	$('#yellowButton').click(function(){
		window.location = "/block1/huisstijl-review.html";
	});
	
	$('#orangeButton').click(function(){
		window.location = "/block1/ontwikkeling-basis-huisstijl.html";
		
	});
	
	$('#grayButton').click(function(){
		window.location = "/block1/online-hulpmodules.html";
		
	});
	
	$('#redButton').click(function(){
		window.location = "/block1/inventarisatie-middelen.html";
		
	});
	
	$('#blueButton').click(function(){
		window.location = "/block1/huisstijl-organisatie.html";
		
	});
	
    //---- GLOBAL FUNCTIONS ----//
    //initiate the FLIR images
    FLIR.init({path: '/tools/facelift/' });
    
    //various title
	$("#phases h2").each( function() { FLIR.replace(this, new FLIRStyle({ cFont:'univers_bold'})); } );
	//$("h1.title, #main-menu li strong, #phases h2, span.strong").each( function() { FLIR.replace(this, new FLIRStyle({ cFont:'univers_bold'})); } );
    //$("#main-menu li span").each( function() { FLIR.replace(this, new FLIRStyle({ cFont:'univers_light'})); } );
	
	$('#page.intro .footer-balloon').delay(1500).fadeIn(1500);
	
	$('#page.intro span#closeInfoBalloon').click(function()
	{
		$('#page.intro .footer-balloon').fadeOut(500);
	});
	
	$('.show-over-kenmerk').hover
	(
        function () 
        {   
			$('div.footer-balloon.over-kenmerk').fadeIn(500);   
        }, 
        function () 
        {
			$('div.footer-balloon.over-kenmerk').fadeOut(500);  	
        }
	);
	
	$('.show-over-osage').hover
	(
        function () 
        {   
			$('div.footer-balloon.over-osage').fadeIn(500);   
        }, 
        function () 
        {
			$('div.footer-balloon.over-osage').fadeOut(500);  	
        }
	);
	
    //expand button on index page
	$(".lees-meer").click(function() 
	{
		$("#intro").animate(
		{ 
    		height: $("#intro").height() + 160
		}, 
		500, 
		'linear',
		function() 
		{
      		$(".text-2").toggle();
			$(".lees-meer").css('display', 'none');
  		});
	});
	
	if($('#questions .scroll-pane').length > 0)
	{
		//$('#questions .scroll-pane').jScrollPane();
	}
	
	/* sub menu (timeline/word balloons) functions */
	$("#sub-menu li.expand").hover
	(
        function () 
        {   
			$(this).addClass('hover');	
			$(this).siblings().removeClass('hover');
        	showSubmenuItem($(this));    
        }, 
        function () 
        {
			if($(this).hasClass('expand'))
			{
				$(this).removeClass('hover');		
			}
        }
	);
		
	$("#sub-menu li.expand").click(function ()
	{
		expandSubmenu($(this));
	});
	
	$("#documents .toggle-question").click(function ()
    {
		$('#questions-quickflip-wrapper.quickflip-wrapper').quickFlipper({},1); 
    });
	
	
	$("#questions .show-question").click(function ()
    {
	    $(this).toggle();
	    $("#questions .toggle-question").parent('li').toggle();
    });
	
	$("#questions li .toggle-content").click(openContent);
	$("#main-menu li.selected a").click(closeContent);
	
	
	/* flipping function for the document mail links */
	if($('#documents.quickflip-wrapper').length > 0)
	{
		$('#documents.quickflip-wrapper').quickFlip();	
	}
	
	$('#documents .front li').click(function() 
	{
    	$('#documents.quickflip-wrapper').quickFlipper({},$(this).attr("rel"));
	});
	
	$("#documents a.closeForm").click(function()
   	{
		$('#documents.quickflip-wrapper').quickFlipper({},0);   
   	});
	
	
	if($('#questions-quickflip-wrapper.quickflip-wrapper').length > 0)
	{
		$('#questions-quickflip-wrapper.quickflip-wrapper').quickFlip();	
	}
	
	$("#questions a.closeForm").click(function()
   	{
		$('#questions-quickflip-wrapper.quickflip-wrapper').quickFlipper({},0);   
   	});
	
	$('.docRequestForm, .askaquestionForm').children('input:text[name=naam]').focus(function() 
	{
		//alert($(this).val());
  		if($(this).val() == 'Voor- + achternaam')
		{
			$(this).val('');	
		}
	});
	
	$(".askaquestionForm .button").click(function()
	{
		if($(this).parent('form').children('input:text[name=naam]').val() == 'Voor- + achternaam')
		{
			$(this).parent('form').children('input:text[name=naam]').val('');		
		}
		
		//$("#docRequestForm1").validate(
		$(this).parent('form').validate(
		{
			errorClass: "invalid",
			messages: 
			{
     			email: "",
				vraag: "",
				naam: ""
			}
		});
		
		if($(this).parent('form').valid())
		{
			$.ajax(
			{
				type: 'POST',
				url: 'askaquestion.php',
				data: (
				{
					name: $(this).parent('form').children('input:text[name=naam]').val(),
					email : $(this).parent('form').children('input.email').val(),
					question: $(this).parent('form').children('textarea').val(),
					bedrijf: $(this).parent('form').children('input:text[name=bedrijf]').val()
				}),
				success: handleAskaQuestion
			});
			
		}
	});
	
	$(".docRequestForm .button").click(function()
	{
		if($(this).parent('form').children('input:text[name=naam]').val() == 'Voor- + achternaam')
		{
			$(this).parent('form').children('input:text[name=naam]').val('');		
		}
		
		//$("#docRequestForm1").validate(
		$(this).parent('form').validate(
		{
			errorClass: "invalid",
			messages: 
			{
     			naam: "",
				email: ""
			}
		});
		
		if($(this).parent('form').valid())
		{
			$.ajax(
			{
				type: 'POST',
				url: 'requestdoc.php',
				data: (
				{
					docType : $(this).parent('form').children('input.docType').val(),
					email : $(this).parent('form').children('input.email').val(),
					naam: $(this).parent('form').children('input:text[name=naam]').val(),
					bedrijf: $(this).parent('form').children('input:text[name=bedrijf]').val(),
					gender: $(this).parent('form').children('input:radio[name=gender]:checked').val()
					
				}),
				success: handleDocRequest
			});
			
		}
	});




	$('#contact-menu #contact').click(function()
	{
		$('.contact-menu-balloon.contact').fadeIn(500);
		$('.contact-menu-balloon.disclaimer').fadeOut(500);	
		
	});
	
	$('#contact-menu #disclaimer').click(function()
	{
		$('.contact-menu-balloon.disclaimer').fadeIn(500);
		$('.contact-menu-balloon.contact').fadeOut(500);			
	});
	
	$('.contact-menu-balloon span.closeInfoBalloon').click(function()
	{
		$(this).parent('.contact-menu-balloon').fadeOut(500);
	});

											 
});

function handleAskaQuestion(data)
{
	//alert(data);	
	$('#questions .quickflip-wrapper').quickFlipper({},2);
	$('#questions #postQuestionFeedback div span').html(data); 
}

function handleDocRequest(data)
{
	//alert(data);	
	$('#documents.quickflip-wrapper').quickFlipper({},4);
	$('#documents #requestDocFeedback div span').html(data); 
}

function openContent(event)
{	
	$("#questions .scroll-pane").css("border", "0");
	
	$("#questions .ask-a-question").toggle();
	var img = $(event.target).parent().find('img');

	$(event.target).parent().addClass('selected');
	$("#questions").addClass('opened');
	$("#questions div.list").addClass('content-open');
	
	//$("#documents").animate({opacity: 0.0}, 250);
	$("#documents").toggle();
	
	
	
	

	
	
	
	$("#description").animate
	(
		{opacity: 0.0},
		250,  
		function()
		{
			
			
			//only move the center item to the left when both the left and right items are done fading out
			$("#questions").animate
			(
				{left: 0}, 
				500, 
				function()
				{
					//$('#questions .scroll-pane li').width(281);
					//$('#questions .scroll-pane').jScrollPaneRemove();
																									
					$("#questions div.list").animate({height: '80%', width: 312}, 500);
					$("#questions div.list").css('border-left','none');
					$("#questions .scroll-pane").animate({width: 312}, 500, function()
					{
						//$('#questions .scroll-pane').jScrollPane();
					});
					$("#"+$(event.target).attr("rel")).animate({opacity: 'toggle'}, 250); 	
					
				}
			)
		}
	);
	
	//height is animated at the same time as the fadeout of the left and right items
	//$("#content").animate({ height: 274}, 250);
	//unbind the openContent function from the click event, and bind the showContent click event
	$("#questions li a.toggle-content").unbind('click');
	$("#questions li a.toggle-content").bind('click',showContent);
	
}

function closeContent(event)
{
	//only perform the animations and actions if the content had previously been opened.
	if($("#questions").hasClass('opened'))
	{
		$("#questions ul li").removeClass('selected');
		$("#questions div.list").removeClass('content-open');
		$("#questions div.list").css('border-left','1px solid #FFF');
		//remove the scrollpane from the left menu
		//$('#questions .scroll-pane').jScrollPaneRemove();
		$("#questions div.list").animate({height: '90%', width: 413}, 500);
		//hide any and all shown content
		$("#questions .content").css('display', 'none');
		
		//start the closing animation
		//$("#questions div.list").animate({height: 160}, 500);
		$("#questions .scroll-pane").animate
		(
		 	
			{}, 
			500, 
			function()
			{
				//$('#questions li').width(325);
				//$('#questions .scroll-pane').jScrollPane();
				$("#description").animate({ opacity: 1.0}, 500 );
				$("#questions").animate
				(
					{left: 330, width:390}, 
					500, 
					function()
					{
						$("#content").animate({ height: 195}, 250);
						
						//$("#documents").animate({ opacity: 1.0}, 500 );
						$("#documents").toggle();
						$("#questions").removeClass('opened');
						
						$("#questions div.list").animate({width: 414}, 500);
						$("#questions .scroll-pane").animate({width: 414}, 500, function()
						{
							//$('#questions .scroll-pane').jScrollPane();
						});
						$("#questions").removeClass('opened');
						//$("#questions").css('border-left','1px solid #FFF');
						//$("#questions").css('border-right','1px solid #FFF');
						//$("#questions .scroll-pane").css("width", "398px");
						//$('#questions .scroll-pane').css('border-left','1px solid #FFFFFF');
						//$('#questions .scroll-pane').css('border-right','1px solid #FFFFFF');
					}
				);
			}
		);
		
		
		
		
		//unbind the showContent function from the click event, and bind the openContent click event
		$("#questions li a.toggle-content").unbind('click');
		$("#questions li a.toggle-content").bind('click',openContent);	
		
		$("#questions .ask-a-question").toggle();
		//$('#ask-a-question').toggle();
		refreshMenu();
	}
}

function showContent(event)
{
	//$("#questions .content").jScrollPane();
	//jScrollPaneRemove();
	$("#questions .content").css('display', 'none');
	$("#questions ul li").removeClass('selected');
	$("#questions #"+$(event.target).attr("rel")).css('display', 'block');
	$(event.target).parent().addClass('selected');
	
	
}

function expandSubmenu(element)
{
	$(element).addClass('hover');
	
	$("#sub-menu li.expand").unbind('click');
	
	//set the child items of the current item to visible
	$(element).children("ul").css("visibility", "visible");
	$(element).children("ul").css("display", "block");
	
	$(element).children().find("li").css("visibility", "visible");
	$(element).children().find("li").css("display", "block");
	
	//set the child items of the current item's siblings to visible 
	$(element).siblings(".expand").children("ul").css("visibility", "visible");
	$(element).siblings(".expand").children("ul").css("display", "block");	
	
	$(element).addClass('collapse');
	$(element).siblings(".expand").addClass('collapse');
	
	$(element).removeClass('expand');
	$(element).siblings(".expand").removeClass('expand');
	
	
	$("#sub-menu li.collapse").click(function ()
	{
		collapseSubmenu($(this));
	});
}

function collapseSubmenu(element)
{
	//alert('collapseSubmenu');
	$("#sub-menu li.collapse").unbind('click');
	$(element).removeClass('hover');
	
	//set the child items of the current item to visible
	$(element).children("ul").css("visibility", "hidden");
	$(element).children("ul").css("display", "none");
	
	$(element).children().find("li").css("visibility", "hidden");
	$(element).children().find("li").css("display", "none");
	
	//set the child items of the current item's siblings to visible 
	$(element).siblings(".collapse").children("ul").css("visibility", "hidden");
	$(element).siblings(".collapse").children("ul").css("display", "none");
	
	$(element).addClass('expand');
	$(element).siblings(".collapse").addClass('expand');
	
	$(element).removeClass('collapse');
	$(element).siblings(".collapse").removeClass('collapse');
	
	$("#sub-menu li.expand").click(function ()
	{
		expandSubmenu($(this));
	});
}

function showSubmenuItem(element)
{	
	if($(element).children().find("li").css("display") == 'none')
	{	 
		$(element).children().find("li").css("visibility", "visible");
		$(element).children().find("li").css("display", "block");	
		
		$(element).siblings().find("li").css("visibility", "hidden");
		$(element).siblings().find("li").css("display", "none");
		
		$(element).siblings().find("li").removeClass('hover');
	}
}

$(function(){

	$('.foxing').each(function(){
		
		
		$(this).mouseenter(function(){
			$(this).css('background','#D1E8F4');
			$(this).css('color','#000');
		});
		
		$(this).mouseleave(function(){
			$(this).css('background','none');
			$(this).css('color','#FFF')
		});
	});
})



function refreshMenu(){
	
	
	$('#questions li').each(function(){
	
			var img = $(this).find('img');
			if(img.attr('src') == "/images/arrow_blue_white.jpg" || img.attr('src') == "/images/arrow_blue.jpg"){
				img.attr('src','images/arrow_blue_white.jpg');
			}else if(img.attr('src') == "/images/arrow_purple_white.jpg"){
				img.attr('src','images/arrow_purple.jpg');
			}else  if(img.attr('src') == "/images/arrow_green_white.jpg"){
				img.attr('src','images/arrow_green.jpg');
			}
	});
	
}