var isAnimating = false;

$(document).ready(function() {
	resizeHeaderImage();
	InfiniteRotator.init();
	
	$('.clickable').click(function(){
		location.href = $('a.target', this).attr('href');
	});
	
	$('.fancybox.iframe').fancybox({
		'width' : 900,
		'height' : 600
	});
	
	inputText('#zoekformulier input.text', 'Uw zoekterm');
	inputText('form.nieuwsbrief input.naam', 'Uw volledige naam');
	inputText('form.nieuwsbrief input.mail', 'Uw e-mailadres');
	inputTextError('form.nieuwsbrief input.naamerror', 'Uw volledige naam');
	inputTextError('form.nieuwsbrief input.mailerror', 'Uw e-mailadres');
	inputText('div.kaart input.text', 'Uw postcode of plaatsnaam');
	inputText('div.kenteken input.text', '00-ABS-0');
	inputText('form#googleMaps input.text', 'Uw postcode of plaatsnaam');
	
	uitklapbaar('.uitklapbaar', true, false);
	uitklapbaar('dd.item', true, 'dl.directnaar');
	
	kaartHover();
	
	$('a.externe-link').attr('target', '_blank');
	
	$('#home_poll').submit(function() {
		var $context = $(this);
		data = $('#home_poll').serialize();
		$context.find('.question').remove();
		$context.html('Resultaten ophalen...');
		$context.load('/ajax/poll.php', data);
		return false;
	});
});

var InfiniteRotator = {
    init: function() {
        var initialFadeIn = 1000;	//initial fade-in time (in milliseconds)
        var itemInterval = 5000;  	//interval between items (in milliseconds)
        var fadeTime = 1000;		//cross-fade time (in milliseconds)
		
        // Do not change below
        var numberOfItems = $('.rotating-item').length;
	    if (numberOfItems > 1) {
	        var currentItem = 0;
	        $('.rotating-item').eq(currentItem).fadeIn(initialFadeIn);
			
			$('#headerafbeelding .rotating-item:gt(0)').hide();	
			setInterval(function(){
				$('.rotating-item:first-child').fadeOut(fadeTime).next('.rotating-item').fadeIn(fadeTime)
				.end().appendTo('#headerafbeelding');
			}, 5000);
			
        } else if (numberOfItems == 1) {
        	$('.rotating-item').eq(0).fadeIn(initialFadeIn);
        }
    }
};

/**
 * Zorgt ervoor dat een element uitklapbaar wordt. Zal
 * hem eerst inklappen. Benodigde structuur:
 * 
 * wrapper, gespecificeerd door @param element
 * --> .slideToggle (knop om open/sluiten te triggeren)
 * --> .slideContent (inhoud die open/dicht moet schuiven)
 * 
 * @param element wrapperelement waarin zowel knop als content zit
 * @param defaultHidden Standaard .slideContent gesloten? true/false
 */
function uitklapbaar(element, defaultHidden, wrapper) {
	if ($(element)) {
		$(element).each(function(){
			
			if (defaultHidden && !$(this).hasClass('slideOpen')) { $('.slideContent', $(this)).hide(); } 
			else { $(this).addClass('slideOpen'); }
			
			var currElement = this;
			$('.slideToggle', $(this)).click(function(){
				
				// Is al open
				if (wrapper && $(currElement).hasClass('slideOpen')) {
					$(element, $(wrapper)).each(function(){
						$('.slideContent', this).slideUp(100);
						$(this).removeClass('slideOpen');
					});
					return false;
				}
				
				// Andere elementen sluiten
				if (wrapper) {
					$(element, $(wrapper)).each(function(){
						$('.slideContent', this).slideUp(100);
						$(this).removeClass('slideOpen');
					});
				}
				
				if (!isAnimating) {
					isAnimating = true;
					$(currElement).toggleClass('slideOpen');

					$('.slideContent', $(currElement)).slideToggle(300, function() {
						isAnimating = false;
					});
				}
			});
		});
	}
	return false;
}

/**
 * Zet de text op het gegeven inputelement, en haalt
 * dit weg bij een klik
 * 
 * @param element Inputelement waarin tekst moet komen
 * @param text de tekst die erin moet komen
 */
function inputText(element, text) {
	if ($(element) && ($(element).attr('value') == text || $(element).attr('value') == '')) {
		
		// Init grijze kleur
		$(element).attr('style', 'color: #000;');
		
		if ($(element).attr('value') == '') {
			$(element).attr('value', text);
			$(element).attr('style', 'color: #777;');
		}
		$(element).click(function(){
			if ($(element).attr('value') == text || $(element).attr('value') == '') {
				$(element).attr('value', '');
				$(element).attr('style', 'color: #000;');
			}
		});
		$(element).focus(function(){
			if ($(element).attr('value') == text || $(element).attr('value') == '') {
				$(element).attr('value', '');
				$(element).attr('style', 'color: #000;');
			}
		});
		$(element).blur(function(){
			if ($(element).attr('value') == '') {
				$(element).attr('value', text);
				$(element).attr('style', 'color: #777;');
			}
		});
	}
}
/**
 * Zet de text op het gegeven inputelement, en haalt
 * dit weg bij een klik
 * 
 * @param element Inputelement waarin tekst moet komen
 * @param text de tekst die erin moet komen
 */
function inputTextError(element, text) {
	if ($(element) && ($(element).attr('value') == text || $(element).attr('value') == '')) {
		
		// Init rode kleur
		$(element).attr('style', 'color: red;');
		
		if ($(element).attr('value') == '') {
			$(element).attr('value', text);
			$(element).attr('style', 'color: red;');
		}
		$(element).click(function(){
			if ($(element).attr('value') == text || $(element).attr('value') == '') {
				$(element).attr('value', '');
				$(element).attr('style', 'color: #000;');
			}
		});
		$(element).focus(function(){
			if ($(element).attr('value') == text || $(element).attr('value') == '') {
				$(element).attr('value', '');
				$(element).attr('style', 'color: #000;');
			}
		});
		$(element).blur(function(){
			if ($(element).attr('value') == '') {
				$(element).attr('value', text);
				$(element).attr('style', 'color: #000;');
			}
		});
	}
}

/**
 * Zorgt ervoor dat de headerafbeelding een groot
 * formaat krijgt in alle browsers.
 */
function resizeHeaderImage() {
	// Instellingen
	var treshold = 913;
	var maxImageSize = 1024;
	
	// Hieronder niet wijzigen
	var windowWidth = $(window).width();
	
	if (windowWidth > treshold) {
		var newWidth = (windowWidth > maxImageSize) ? maxImageSize : windowWidth;
		$('#headerafbeelding').attr('style', 'width:' + newWidth + 'px;margin-left:-' + (newWidth/2) + 'px;');
		$('#headerafbeelding img').attr('width', newWidth);
	}
	
	// Functie weer aanroepen na resize browser
	$(window).resize(function() {
		resizeHeaderImage();
	});
}

/** 
 * Zorgt ervoor dat de juiste provincies oplichten
 * bij hover over de kaart van Nederland
 */
function kaartHover() {
	if ($('div.kaart')) {
		
		$('div.kaart').each(function(){
			
			$('dd.groningen a', this).hover(
				function(){ $('div.kaart dl').attr('style', 'background-position: -221px 0;') }, // MouseIn
				function(){ $('div.kaart dl').attr('style', 'background-position: 0 0;') } // MouseOut
			)
			$('dd.drenthe a', this).hover(
				function(){ $('div.kaart dl').attr('style', 'background-position: -442px 0;') }, // MouseIn
				function(){ $('div.kaart dl').attr('style', 'background-position: 0 0;') } // MouseOut
			)
			$('dd.overijssel a', this).hover(
				function(){ $('div.kaart dl').attr('style', 'background-position: -663px 0;') }, // MouseIn
				function(){ $('div.kaart dl').attr('style', 'background-position: 0 0;') } // MouseOut
			)
			$('dd.flevoland a', this).hover(
				function(){ $('div.kaart dl').attr('style', 'background-position: -884px 0;') }, // MouseIn
				function(){ $('div.kaart dl').attr('style', 'background-position: 0 0;') } // MouseOut
			)
			$('dd.gelderland a', this).hover(
				function(){ $('div.kaart dl').attr('style', 'background-position: -1105px 0;') }, // MouseIn
				function(){ $('div.kaart dl').attr('style', 'background-position: 0 0;') } // MouseOut
			)
			$('dd.noordholland a', this).hover(
				function(){ $('div.kaart dl').attr('style', 'background-position: -1326px 0;') }, // MouseIn
				function(){ $('div.kaart dl').attr('style', 'background-position: 0 0;') } // MouseOut
			)
			$('dd.friesland a', this).hover(
				function(){ $('div.kaart dl').attr('style', 'background-position: -1547px 0;') }, // MouseIn
				function(){ $('div.kaart dl').attr('style', 'background-position: 0 0;') } // MouseOut
			)
			$('dd.utrecht a', this).hover(
				function(){ $('div.kaart dl').attr('style', 'background-position: -1768px 0;') }, // MouseIn
				function(){ $('div.kaart dl').attr('style', 'background-position: 0 0;') } // MouseOut
			)
			$('dd.zuidholland a', this).hover(
				function(){ $('div.kaart dl').attr('style', 'background-position: -1989px 0;') }, // MouseIn
				function(){ $('div.kaart dl').attr('style', 'background-position: 0 0;') } // MouseOut
			)
			$('dd.zeeland a', this).hover(
				function(){ $('div.kaart dl').attr('style', 'background-position: -2210px 0;') }, // MouseIn
				function(){ $('div.kaart dl').attr('style', 'background-position: 0 0;') } // MouseOut
			)
			$('dd.brabant a', this).hover(
				function(){ $('div.kaart dl').attr('style', 'background-position: -2431px 0;') }, // MouseIn
				function(){ $('div.kaart dl').attr('style', 'background-position: 0 0;') } // MouseOut
			)
			$('dd.limburg a', this).hover(
				function(){ $('div.kaart dl').attr('style', 'background-position: -2652px 0;') }, // MouseIn
				function(){ $('div.kaart dl').attr('style', 'background-position: 0 0;') } // MouseOut
			)
		});
	}
}