/////////////////////////////////////////// BASIC FUNCTIONS, DON'T EDIT ///////////////////////////////////////////

// Starts loading these functions on loading the page:
window.addEvent('domready', function() {	
									
	// Enables the JS errorconsole:
	enableErrorConsole = false;
	// Define wether to use Firebug as the JS debugger (true) or the custom errorconsole (false):
	useFireBugAsErrorConsole = true;
	
	if (window.ie) {
		useFireBugAsErrorConsole = false;
	}
	if (useFireBugAsErrorConsole == false) {
		initConsole();
	}
	
	init();
});

function init() {
	initRemoveLinkLines();
	initExternalLinks();
	initCustomFunctions();	
}



// Check for Internet Explorer for Mac:
var IEMAC = (navigator.userAgent.indexOf('Mac') != -1 && navigator.userAgent.indexOf('MSIE') != -1);
// Check for browser supporting W3CDOM:
var W3CDOM = (document.createElement && document.getElementsByTagName && !IEMAC);

// Error console:
if (W3CDOM) {
	function initConsole() {
		if (enableErrorConsole) {
			var console = document.createElement('div');
			console.id = 'errorConsole';
			var errorConsoleTitle = document.createElement('h2');
			errorConsoleTitle.innerHTML = 'JavaScript Error Console:';
			console.appendChild(errorConsoleTitle);
			var errorList = document.createElement('ol');
			errorList.id = 'errorList';
			console.appendChild(errorList);
			document.body.appendChild(console);
		}
	}
	function error(message) {
		if (enableErrorConsole && !window.ie && useFireBugAsErrorConsole == true) {
			window.console.log(message);
		} else if (enableErrorConsole) {
			var newMessage = document.createElement('li');
			newMessage.innerHTML = message;
			var console = document.getElementById('errorList');
			console.appendChild(newMessage);
		}
	}
}

// This function is used in order for certain links to open in a new window without the direct target attribute:
function initExternalLinks() { 
	if (!document.getElementsByTagName) return; 
	var anchors = document.getElementsByTagName("a"); 
	for (var i=0; i<anchors.length; i++) { 
		var anchor = anchors[i]; 
		if (anchor.getAttribute("href") && anchor.getAttribute("rel") == "external") {
			anchor.target = "_blank";
		}
	}
}

// This function removes the dotted lines around links, but breaks the Tab button on the keyboard: less accessability:
function initRemoveLinkLines() {
	$$('a').addEvent('focus', function(){this.blur()});
}





/////////////////////////////////////////// EDIT CUSTOM JAVASCRIPT BELOW THIS LINE ///////////////////////////////////////////

// Add all your custom function which need to be initialized to this function:
function initCustomFunctions() {
	Shadowbox.init();
	archiveAccordion();
	initToolTips();
	slideshowInteraction();
}

// Define global variables:
var slideshowActive = true;
var activeSlide = 0;
var firstSlideLink = 0;

// Creates an accodion for the newsarchive:
function archiveAccordion() {
	if (!$('archiveAccordion')) return;
	
	var myClickables = $ES('.clickable', 'archiveAccordion');
	var myHideables = $ES('.hideable', 'archiveAccordion');
	
	var myAccordion = new Accordion(myClickables, myHideables, {
		opacity : true,
		openClose : true,
		show : 'none',
		alwaysHide : true
	});
}

// Tool-tip bij mouseover in tagcloud:
function initToolTips() {
	var Tips1 = new Tips($$('.Tips1'));
}

// Populates the slideshow navigation depending on which group of links is shown:
function populateSlideshowNavigation(thisFirstSlideLink, theseSlideListItems, theseMaxSlideLinks, theseListItemAnchors) {
	var i=0;
	theseListItemAnchors.removeEvents();
	theseListItemAnchors.each(function(thisListItemAnchor) {
		i++;
		thisListItemAnchor.title = thisListItemAnchor.innerHTML = i + thisFirstSlideLink;
		
		thisListItemAnchor.addEvent('click', function(){
			clearTimeout(slideshowTimer);
			activeSlide = thisListItemAnchor.innerHTML - 1;
			loadSlideContent(activeSlide);
		});
	});
}

// Defines the interaction with the slideshow on the homepage:
function slideshowInteraction() {
	if ($('slideshow_nav')) {
		
		var slideListItems = $ES('li', 'slideshow_nav');
		var maxSlideLinks = slideListItems.length;
		var totalSlides = slides.length;
		var anchorList = $E('ul', 'slideshow_nav');
		var listItemAnchors = $ES('a', anchorList);

		populateSlideshowNavigation(firstSlideLink, slideListItems, maxSlideLinks, listItemAnchors);

		$('slideshow_prev').addEvent('click', function(){
			clearTimeout(slideshowTimer);
			firstSlideLink = firstSlideLink - maxSlideLinks;
			if (firstSlideLink <= 0) {
				firstSlideLink = 0;
			}
			populateSlideshowNavigation(firstSlideLink, slideListItems, maxSlideLinks, listItemAnchors);
			activeSlide = firstSlideLink;
			loadSlideContent(activeSlide);
		});

		$('slideshow_next').addEvent('click', function(){
			clearTimeout(slideshowTimer);
			firstSlideLink = firstSlideLink + maxSlideLinks;
			if ((firstSlideLink + maxSlideLinks) >= totalSlides) {
				firstSlideLink = totalSlides - maxSlideLinks;
			}
			populateSlideshowNavigation(firstSlideLink, slideListItems, maxSlideLinks, listItemAnchors);
			activeSlide = firstSlideLink;
			loadSlideContent(activeSlide);
		});
	
		$('slideshow_pause').addEvent('click', function(){
			if ($('slideshow_pause').innerHTML != 'pauze') {
				$('slideshow_pause').title = $('slideshow_pause').innerHTML = 'pauze';
				loadSlideContent(activeSlide);
			} else {
				$('slideshow_pause').title = $('slideshow_pause').innerHTML = 'speel';
				clearTimeout(slideshowTimer);
			}
		});
		
		activeSlide = activeSlide + 1;
		slideshowTimer = setTimeout("loadSlideContent(activeSlide)", 4000);
	}
}

// Loads the content of a slide:
function loadSlideContent(thisSlideNumber) {
	activeSlide++;
	
	var slideListItems = $ES('li', 'slideshow_nav');
	var maxSlideLinks = slideListItems.length;
	var totalSlides = slides.length;
	var anchorList = $E('ul', 'slideshow_nav');
	var listItemAnchors = $ES('a', anchorList);

	if (activeSlide > totalSlides) {
		firstSlideLink = thisSlideNumber = activeSlide = 0;
		populateSlideshowNavigation(firstSlideLink, slideListItems, maxSlideLinks, listItemAnchors);
	} else if (activeSlide > (firstSlideLink + maxSlideLinks)) {
		firstSlideLink = activeSlide - 1;
		if ((firstSlideLink + maxSlideLinks) >= totalSlides) {
			firstSlideLink = totalSlides - maxSlideLinks;
		}
		populateSlideshowNavigation(firstSlideLink, slideListItems, maxSlideLinks, listItemAnchors);
	}
	
	for (var i=0; i<listItemAnchors.length; i++) {
		listItemAnchors[i].removeClass('active');
	}
	listItemAnchors[thisSlideNumber - firstSlideLink].addClass('active');

	// slide the text down, simultaneously swap background-image
	$('slideshow_text').effect('bottom', {
		duration: 400,
		onStart: function() { /* timer (in IE6 gaat het soms fout) */ menuTimer = setTimeout("changeBg('"+thisSlideNumber+"')",100); },
		transition: Fx.Transitions.Cubic.easeIn
	}).start(0-$('slideshow_text').clientHeight).chain(function() {	changeText(thisSlideNumber); });
	
	if ($('slideshow_pause').innerHTML == 'pauze') {
		slideshowTimer = setTimeout("loadSlideContent(activeSlide)", 4000);
	}
}

function changeText(slideID) {
	// change the text and slide the new text back in
	if (slides[slideID][2] == '') {
		$('slideshow_subtitle').setStyle('display', 'none');
	} else {
		$('slideshow_subtitle').setStyle('display', 'block');
		$('slideshow_quote').innerHTML = slides[slideID][2];
	}
	$('slideshow_artist').innerHTML = slides[slideID][1];
	
	$('slideshow_text').effect('bottom', {
		duration: 400,
		transition: Fx.Transitions.Cubic.easeOut
	}).start(0)
}

function changeBg(slideID) {
	// place a new div with the old background-image over the current (main)item,
	// change the background of the underlying (main)item to the new background,
	// fade the overlay div to transparent so the updated (main)item shows through and then remove the overlay div
	
	var currentBg = $('slideshow_screen').getStyle('background-image');
	var newBg = "url('" + slides[slideID][0] + "')";
	
	var overlay = new Element('div', {
		'styles': {
			'position': 'absolute',
			'top': '0',
			'left': '0',
			'width': '336px',
			'height': '342px',
			'background-image': currentBg
		}
	});
	overlay.injectTop($('slideshow_screen'));

	$('slideshow_screen').setStyle('background-image', newBg);

	overlay.effect('opacity', {
		duration: 800,
		transition: Fx.Transitions.linear,
		onComplete: function() { overlay.remove(); }
	}).start(1, 0);
}


