replaceFonts();

/**
 *	These function require the DOM to be loaded
 *
 */
window.addEvent('load', function() {
	showHide();
	
	Shadowbox.init();	
	
	stopEvent();	
	
	// show first image	
	if (document.getElementById('image_1') != null)
		toggle_visibility('image_1');
	
});


/** 
 *	Activate cufon
 *
 */
function replaceFonts() {
	// Compacta
	Cufon.replace('h1, .menu_item a',{
		fontFamily:'Compacta BT',
		hover: true
	});
	// Futura
	Cufon.replace('.top_menu_item a',{
		fontFamily:'Futura',
		hover: true
	});
	
}

/** 
 *	Toggle Visibility
 *
 */
function toggle_visibility(id) {

	var e = document.getElementById(id);
	$$('.hidden').setStyle('display', 'none');
	e.style.display = 'block';
}

/** 
 *	Stop Default events
 *
 */
function stopEvent() {
	$$('.media_thumb_link').each( function(e) {		
		e.addEvent('click', function(event) {
			event.stop();	
		});
	});
}

/**
 *	function showHide
 */ 
function showHide() {
	
	if ( !$chk( $('voorstelling_items') ) )
		return false;	
		
	// Voorstelling
	//..................................	
	
	// enumerate
	var i = 1;	

	// add classes to main layers
	$('voorstelling_items').getElements('.content').each( function(e) {
		
		e.addClass('item_' + i);
		e.hide();
		if (i == 1)
			e.show();		
		i++;
	});
	
	// enumerate
	var i = 1;
	
	// each control
	$$('.menu_item').each( function(e) {
		
		// set unique class
		e.addClass('menu_' + i);		

		//click
		e.addEvent('click', function(event) {
		
			// prevent default
			event.stop();	
			
			// get the number
			var nr = e.get('class').replace('menu_item', '').replace('menu_', '').replace('first', '').replace('last', '').toInt();
			
			// hide all content divs 
			$$('#voorstelling_items .content').hide();
			
			// show
			$$('.item_' +nr).show();
			
		});
		i++;
	});
	
	// Pers
	//..................................
	
	// enumerate
	var i = 1;	
	
	// add clases to pers layers
	$('pers_artikelen').getElements('.artikel').each( function(e) {
		e.addClass('artikel_' + i);
		e.hide();
		if (i == 1)
			e.show();	
		i++;
	});
	
	// enumerate
	var i = 1;
	
	$$('.pers_item').each( function(e) {
		e.addClass('pers_' + i);			
		if (i == 1)
			e.getElement('a').addClass('active');
		
		e.addEvent('click', function(event) {
			// prevent default
			event.stop();			
			
			// remove active class
			$$('.pers_item').getElement('a').removeClass('active');
			
			// set active class
			e.getElement('a').addClass('active');			
			
			var nr = e.get('class').replace('pers_item', '').replace('pers_', '').toInt();
			
			$$('#pers_artikelen .artikel').hide();
			$$('.artikel_' +nr).show();
			
		});
		i++;
	});
	
	// get value from querystring
	//..................................
	
	var pers_nr = getParameterByName('pers');
	
	// show the queried pers item
	if (pers_nr > 0) {
		
		// menu active class
		$$('.pers_item').getElement('a').removeClass('active'); 
		$$('.pers_' + pers_nr).getElement('a').addClass('active');
		
		// show pers container
		$$('#voorstelling_items .content').hide();
		$$('.item_3').show();		
		
		// show article
		$$('#pers_artikelen .artikel').hide();
		$$('.artikel_' + pers_nr).show();
	}
		
	
}

/**
 *	Get a querystring value from the href
 */
function getParameterByName( name ) {
	name = name.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]");
	var regexS = "[\\?&]"+name+"=([^&#]*)";
	var regex = new RegExp( regexS );
	var results = regex.exec( window.location.href );
	if( results == null )
		return "";
	else
		return decodeURIComponent(results[1].replace(/\+/g, " "));
}