// Stel het kleurenschema samen. Dit kleurenschema wordt gebruikt binnen de afzonderlijke secties van de site...
// Nieuwe kleuren voor nieuwe secties kunnen eenvoudig worden toegevoegd.
//

var arSectieInfo = [[ 'introductie', '#DBE5F1', '#75933D', "Klik hier om terug te gaan naar de introductiepagina" ],
					[ 'pedicure', 	 '#EAF1DD', '#75933D', "Alle informatie over de pedicurebehandelingen die door Hoornbloem worden aangeboden" ],
					[ 'manicure',    '#FDE9D9', '#E46D09', "De manicurebehandelingen door Hoornbloem." ],
					[ 'nagelstyling','#F2DDDC', '#953735', "Nagelstyling. Geef uw handen die elegante uitstraling die u verdient!" ],
					[ 'webshop',	 '#E5E0EC', '#604A7B', "In de webshop vindt u allerhande producten om uw handen, uw voeten, uw gezicht en uw lichaam heerlijk te verzorgen" ],
					[ 'informatie',	 '#DBEEF3', '#32849C', "Contactinformatie en een routebeschrijving naar Hoornbloem" ] ];
					
function pageColoring( sectieNr ) {
	var sectie = arSectieInfo[sectieNr][0];
	var bg=arSectieInfo[sectieNr][1];
	var fg=arSectieInfo[sectieNr][2];
	
	// HTML Achtergrond...
	$('html').css('background-color', bg);
	// Header and footer...
	
	$('#imHeader').css( { 'background-image' : 'url(files/header_'+ sectie + '.jpg)'} );
	$('#imFooter').css( { 'background-image' : 'url(files/footer_' + sectie + '.jpg)'} );
	
	$('h2').css( 'color',  fg );
	$('h3').css( 'color', fg);
	$('h3').css( {'text-align': 'left'}, {'font-size': '11px' }, {'font-weight': 'bold' } );
	
	// Current menu item...
	$('.imMenuSubCur').css( 'color',  fg );
	$('.imMenuSubCur').css( 'background-color', bg  );
	
	// Other menu choices	
	$('#imMenuSub ul li a').css('color', fg );
	
	// Hover event on submenu...
	$(function() { $('#imMenuSub ul li a').hover( 
		function(){
			$(this).css( 'color', fg );
			$(this).css( 'background-color',  bg );
		}, 
		function() {
			$(this).css( 'color',  fg );
			$(this).css( 'background-color',  '#FFFFFF' );
		});
	});
}

function menuColoring () {
	// Bring some color in the pop-up menu's, depening on it's section..
	var currentSectieNr=0;
	$('#imMnMn ul:first').children().each( function () {
		$(this).children('ul').children('li').each( function () {
			$(this).children('a').css('color', arSectieInfo[currentSectieNr][2]);
			$(this).children('a').css('background-color', arSectieInfo[currentSectieNr][1]);
		});
	
		$(function() { $('#imMnMn ul li a').hover( 
			function(){
			$(this).css( 'font-weight', 'bold' );
			}, 
			function() {
				if (!$(this).parent('li').hasClass('topLevel') ) {
					$(this).css( 'font-weight', 'normal');			
				}
			});
		});
		currentSectieNr=currentSectieNr+1;
	});
}

$(document).ready( function() {

	var currentSectieNr = 0; 	// array-teller. Geeft huidige sectie aan in arSectieInfo

	$('#imMnMn ul:first').children().each( function () {
		$(this).addClass('topLevel');
		$(this).title = arSectieInfo[currentSectieNr][3];

		// We kunnen bepalen onder welk niveau de pagina zit door 
		// te kijken of de url van de pagina gelijk is aan 
		// de doelurl van de hyperlink.
		if ( document.URL.indexOf( 'index.html')  > 0 ) {
				pageColoring(0);
		}
		else {
			$(this).children('ul').children('li').each( function () {
				if ( document.URL == "http://www.hoornbloem.nl/" 
				  || document.URL == "http://hoornbloem.nl/"
				  || document.URL.indexOf( $(this).children('a').attr('href') ) > 0 ) {
					pageColoring( currentSectieNr);
				}
			});
			currentSectieNr=currentSectieNr+1;
		}
	});
	menuColoring();
});