// JQUERY CUSTOM COMMANDS
$(document).ready( function() {  // start javascript when document is loaded
	
	$('#navigation_wrapper ul>li').hover(function() {
		$(this).parent().addClass('hover');
	}, function() {
		$(this).parent().removeClass('hover');
	});

	filterholder = $('.filter_holder');
	filterholder.find('h3').click(function() {	
		filterholder.addClass('hover');
	});	
	
	// UNHOVER
	$('.filter_holder .close_filter').click(function() {		
		filterholder.removeClass('hover');
	});
	
	
	// supersize opties definieren	
	$(function(){
		$.fn.supersized.options = {  
				startwidth: 640,  
				startheight: 400,			//let goed op deze verhouding, dit blijft de verhouding
				vertical_center: 1,
				slideshow: 0
		};
		
	});
	$('#supersize').supersized(); 

	
	// validate the comment form when it is submitted
	// -jquery.validation-
	$("#form_bestelling").validate();
	 
	
	// fancy box
	//fancyBox_images();	
	$("a.group").fancybox({
		'zoomSpeedIn': 300,
		'zoomSpeedOut': 300,
		'overlayShow': true
	});
		
	//!belangrijk geen andere fade functies mogen actief zijn op deze objecten
	/*
	$('.sidebar .pro_ig').hover(function() {
		$(this).stop().animate({opacity: 1}, 250); 
	}, function() { 
		$(this).stop().animate({opacity: 0}, 250); 
	});	
	*/

	// fancy box
	fancyBox_images();
	
	 
	// A IMG HOVERS
	// HOVER
	var hoverStateButtonsAnimating = false;		
	$('a img:not(.picture_big a img, .sidebar .pro_ig)').mouseover(function() {			
		if (!hoverStateButtonsAnimating) {
			$(this).fadeTo(100, 0.75); 		//SET
			hoverStateButtonsAnimating = true;
		}
	});	
	// UNHOVER
	$("a img:not(.picture_big a img, .sidebar .pro_ig)").mouseleave(function() {			
		$(this).fadeTo(100, 1.00).queue(function() { 	//RESET
			hoverStateButtonsAnimating = false; $(this).dequeue(); 	
		});		
	}); 

	$('#photoWrap input').change(duplicateInputElement);
	
	
	// als de geselecteerde provincie wijzigt
	$('#form_filter #l_provincie').change(function() {

		// id van de geselecteerde provincie ophalen
		var selectedProvincie = $(this).val();
		
		$('#l_plaats')
			.attr('disabled', 'disabled')
			.load('/user/index/getplaatsen/format/html/provincie/' + selectedProvincie + '/plaats/' + escape($('#l_plaats').val()), function() {
				$(this).attr('disabled', '');
			});
	});
	
}); // end ready function



function fancyBox_images()
{
	
	$("a.single_image").fancybox({
		'zoomSpeedIn': 300,
		'zoomSpeedOut': 300,
		'overlayShow': true
	});
	
	// Using custom settings 
	$(".extra_pictures a.inline").fancybox({
		'hideOnContentClick': true
	});
	
	$("a.group").fancybox({
		'zoomSpeedIn': 300,
		'zoomSpeedOut': 300,
		'overlayShow': true
	});
}


function duplicateInputElement()
{
	// de scope is het input element
	element = $(this);
	
	// het attribuut max_count wordt gebruikt om aan te geven hoeveel elementen nog toe zijn gestaan
	var max_count = element.attr('max_count');
	
	// max. aantal mag niet onder de 1 komen
	if (max_count <= 1) {
		return;
	}
	
	// het input element clonen en toevoegen na zichzelf
	var clone = element.clone(true);
	clone.insertAfter(element).val('');
	
	// change event loskoppelen van het eerste input element
	element.unbind('change');
	
	// max count verlagen van het geclonede element
	if (max_count) {
		clone.attr('max_count', max_count - 1);
	}
}

function deleteProfilePhoto(element)
{
	if (!confirm('Weet je zeker dat je deze foto wilt verwijderen?')) {
		return;
	}
	element = $(element);
	
	$.getJSON(element.attr('href') + '/format/json', function(response) {
		
		element.closest('p').fadeOut();
		
		var photoInput = $('#photoWrap input:last-child');
		if (photoInput.length) {
			var maxCount = parseInt(photoInput.attr('max_count'));
			
			photoInput.attr('max_count', maxCount + 1);
			
			if (maxCount == 1) {
				photoInput.change();
			}
		} else {
			$('#photoWrap').append(
				$('<input type="file" name="photo[]" max_count="1" />').change(duplicateInputElement)
			);
		}
	});
	
}

function fancyBox_images(){
	$("a.single_image").fancybox({
		'zoomSpeedIn': 300,
		'zoomSpeedOut': 300,
		'overlayShow': true
	});
	
	/* Using custom settings */
	$(".extra_pictures a.inline").fancybox({
		'hideOnContentClick': true
	});
	$(".pictures_list_in_content a.group").fancybox({
		'zoomSpeedIn': 300,
		'zoomSpeedOut': 300,
		'overlayShow': true
	});
}