var jArrCategories		= Array("EnjoyWebservices","EnjoyConsultancy","EnjoyMerchandise","EnjoyEducation","EnjoyEvents");
var jArrCategoXPos		= Array(0,206,412,619,825);
var jArrCateColors		= Array("#eb1c22","#ffc905","#016eb2","#78ab35","#eb8d1a")
var jStrCat		= '';		// string of all categories
var jSelCat		= '';		// string of selected category
var jSelCatID	= '';
var jNonCat		= '';		// string of non-selected category
var jMenuID		= "#SiteMenu";
var jMenuHrID	= '#SiteMenuHR';
var jContentID	= '#SiteContent';
var jLogoID		= "#EnloyLogo";
var jIntroID	= '#SiteIntroContainer';
var jNavID		= "#SiteNavpath";
var jNavTmpID	= "#SiteNavpathTemp";

var jAjaxError	= "<h1>Er is iets foutgegaan.</h1><p>Er is een fout opgetreden bij het laden van de content.</p>";

var jActiveOpacity   = 1.0;        
var	jInactiveOpacity = 0.7;        
var	jFadeTimeOpacity = 300;


// (0) - ONLOAD: INIT JQUERY
// ---------------------------------------------------------------------------------------------
 $(document).ready(function(){ 

	// check if we need to go directly to an page
	if (jCurrentCategory>-1) {								// go to specific page
		jSelCat	  = '#'+jArrCategories[jCurrentCategory];	// set selected ID
		createCategoryString();								// create categorystrings

		$(jSelCat).css("left",jArrCategoXPos[0]);			// set selected to the left
		$(jSelCat).show();									// show it

		gotoCategory();										// show category
	} else { 
		createCategoryString();								// create categorystrings	
		showHome();											// just show our home
	}									
   
   /*shows the loading div every time we have an Ajax call*/    
	$(jContentID).bind("ajaxSend", function(){				
			$(jContentID).css("background-image","url(/images/loading.gif)");	// set loader bg
			setUnSetHomelink('disable');										// disable home
			}).bind("ajaxComplete", function(){   
				$(jContentID).css("background-image","");					//set normal bg
				setUnSetHomelink('enable');									// enable home buttons
			}).bind("ajaxError", function(){   
				$(jContentID).css("background-image","");				//set normal bg
				$(jContentID).html(jAjaxError);							//write error message
				setUnSetHomelink('enable');								// enable home buttons
	});	 
});


// GLOBAL - CREATE A STRING OF ALL SELECTED\NONSELECTED CATEGORYNAMES
// ---------------------------------------------------------------------------------------------
function createCategoryString() {
	jStrCat	= '', jNonCat = '';
	for (var y=0; y<jArrCategories.length; y++) {
		if (jStrCat!='') { jStrCat += ','; }		// create string of all categories
		jStrCat += '#'+jArrCategories[y];

		if ('#'+jArrCategories[y]!=jSelCat) {		// create string of all non-selected categories
			if (jNonCat!='') { jNonCat += ','; }
			jNonCat += '#'+jArrCategories[y];
		} else {
			jSelCatID = y;
		}
	}
}


// GLOBAL - SET\UNSET HOMELINK
// ---------------------------------------------------------------------------------------------
function setUnSetHomelink(jMode) {
	var jStrObj = jLogoID; if (jSelCat!='') { jStrObj += ','+jSelCat; }
	$(jStrObj).unbind();												// clear handlers
	
	if (jMode=='enable') { 
		$(jStrObj).click( function() {	showHome(); });					// OnClick handler	
		$(jSelCat).hover(												// Hover handler for selected category
			function(){ $(this).fadeTo(jFadeTimeOpacity, jInactiveOpacity); }, 
			function(){ $(this).fadeTo(jFadeTimeOpacity, jActiveOpacity); }); 
	}
}


// GLOBAL - OTHER LINKS TO OPEN CATEGORY
// ---------------------------------------------------------------------------------------------
function goLink(jSelected) {
		$(jStrCat).unbind();										// clear handlers
		jSelCat = '#'+jSelected;									// set selected category in global variable
		createCategoryString();										// load categorystrings
		gotoCategory();												// start animation
}


// GLOBAL - SET COLOR OF LINKS TO CATEGORY LINK
// ---------------------------------------------------------------------------------------------
function setLinkColors() {
	$('h1').css("color",jArrCateColors[jSelCatID]);									// H1 content title

	$('a').css("color",'#7f7f7f');													// A all current links to gray
	$('a.MainMenuSelected').css("color",jArrCateColors[jSelCatID]);					// A selected menu item

	$('a').hover( function(){ $(this).css('color',jArrCateColors[jSelCatID]); },	// A mouseover
				  function(){ $(this).css('color','#7f7f7f'); });					// A mouseout

	$('a.MainMenuSelected').hover( function(){ $(this).css('color',jArrCateColors[jSelCatID]); },	// A mouseover
								   function(){ $(this).css('color',jArrCateColors[jSelCatID]); });	// A mouseout
}


// ---------------------------------------------------------------------------------------------
// (1) SHOW HOMESCREEN
// ---------------------------------------------------------------------------------------------
function showHome() {
	jPageType = 50;													// reset pagetype if we got home
	setUnSetHomelink('disable');									// clear handlers for logo and main image
	$("a").unbind();												// clear handlers of all links

	$(jContentID+','+jMenuID).hide().html("");						// hide and clear content and menu
	$(jNonCat+','+jIntroID).show(jFadeTimeOpacity);					// show non-selected categories

	if (jSelCat!=''){												// animate selected categories back to it's original place
		$(jSelCat).animate({"left": jArrCategoXPos[jSelCatID]+"px"}, "slow");
	}

	jSelCat = '';													// Clear selected category variable
	createCategoryString();											// Load categorystring
	$(jStrCat).show().fadeTo(jFadeTimeOpacity, jInactiveOpacity);	// Show all images
	$(jNavID).html(jHomeNav);										// Set navpath to home value
	
	$(jStrCat).hover(												// Hover handler
		function(){ $(this).fadeTo(jFadeTimeOpacity, jActiveOpacity); }, 
		function(){ $(this).fadeTo(jFadeTimeOpacity, jInactiveOpacity); });     

	$(jStrCat).click(function() { goLink(this.id); });				// OnClick handler	
}


// (2) SHOW CATEGORY SCREEN
// ---------------------------------------------------------------------------------------------
function gotoCategory() {
	// FadeOut nonselected
	$(jNonCat).fadeOut("normal");

	// animate clicked item to left, fade out all others
	$(jSelCat).animate({"left": jArrCategoXPos[0]+"px"}, "slow", function() { 
			// after animation has finished
			$(jNonCat).hide();												// hide non-selected category images
			var jIntroURL = $(jMenuID+" .MainMenuSelected").attr("href");	// get URL of INTRO page

			$(jMenuID+" A").each(function () {								// change HREF links to javascript links, so google likes my page
					this.href = 'javascript:loadContent("'+this.href+'");'; 
			});
		
			$(jMenuID+" A").click(function() {								// set click event        
					$(jMenuID+" A.MainMenuSelected").removeClass('MainMenuSelected');         
					$(this).addClass('MainMenuSelected');     
			});

			loadContent( jIntroURL );										// get url and set content after loading
	});

	// do in selected category image
	$(jSelCat).fadeTo(jFadeTimeOpacity, 1);

	// hide home intro text
	$(jIntroID).hide(jFadeTimeOpacity);

	// show menu if not empty
	var jMenuHtml = $(jSelCat+"Menu").html();
	if ((jPageType==41) || (jPageType==70)) { jMenuHtml = ''; }
	if (jMenuHtml.length<5) { $(jMenuID+','+jMenuHrID).hide(); return; }
	$(jMenuID).html(jMenuHtml).show();
	$(jMenuHrID).show();
}


// (3) LOADS EXTERNAL DATA
// ---------------------------------------------------------------------------------------------
function loadContent(jURL) {
	// if we got a direct ID then do not reload the page using ajax
	if (jCurrentCategory>-1) { 
		jCurrentCategory=-1;									// clear value
		$(jContentID).show();									// show content box with already loaded content (better performance)
		setLinkColors();										// set colors
		if ((jPageType==404) || (jPageType==30))  { return; }	// leave if pagetype 30 or 404
		setUnSetHomelink('enable');								// enable home links, not for 404 and type 30 pages
		return;													// exit function so ajax is not loaded
	}

	//protects function again bad data
	if ((jURL=='') || (jURL==undefined)) { return; }

	// clear content
	$(jContentID).html("&nbsp;").show();				// clear contentbox and show it

	// load external data, the _xj.html prevends the website GUI to beshowed
	$(jContentID).load( jURL.replace('.html','_xj.html'), function() { 
			// after ajax had finished
			try { $(jNavID).html( $(jNavTmpID).html() );} catch(excp) { }					// set navPath after download complete
			setLinkColors();																// set colors after download complete
		} );
}