// JQUERY CUSTOM COMMANDS
$(document).ready( function() {  // start javascript when document is loaded
	
	
	// 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(); 

	
	 //for header animation - startup
	 var headAnimation = new HeaderAnimation();

	 // fancy box
	 fancyBox_images();	
	 
	// validate the comment form when it is submitted
	// -jquery.validation-
	$("#form_bestelling").validate();
	 
	// A IMG HOVERS
	// HOVER
	var hoverStateButtonsAnimating = false;		
	$('a img:not(#s1 img)').mouseover(function() {			
		if (!hoverStateButtonsAnimating) {
			$(this).fadeTo(100, 0.75); 		//SET
			hoverStateButtonsAnimating = true;
		}
	});	
	// UNHOVER
	$("a img:not(#s1 img)").mouseleave(function() {			
		$(this).fadeTo(100, 1.00).queue(function() { 	//RESET
			hoverStateButtonsAnimating = false; $(this).dequeue(); 	
		});		
	}); 


	//laatste menu item, uitklapper naar link laten gaan
	$('ul.navigation li:last').each(function (i) {
		$(this).parents('li').addClass('last');
	});
	
	
}); // 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
	});
	$(".pictures_list_in_content a.group").fancybox({
		'zoomSpeedIn': 300,
		'zoomSpeedOut': 300,
		'overlayShow': true
	});
}







function HeaderAnimation() {
	this.init();
}

HeaderAnimation.prototype = {
		
	current: 0,
	timerInterval: 3000,
	
	init: function() {

		var self = this;
		
		// defineer
		
		this.photoWrapper 		= $('#s2 li');
		this.linkWrappers 		= $('#s2 li');		
		//this.textWrapper 	= $('#main_banner li');
		//this.textHolderWrapper	= $('.top_text_layer');	
		
		// pause mode
		this.photoWrapper.hover(
			function() { self.pauseAutoTimer(); },
			function() { self.resetAutoTimer(); });
		this.hideAll();
		/*// pause mode		
		this.mainBannerWrapper.hover(
			function() { self.pauseAutoTimer(); },
			function() { self.resetAutoTimer(); });		*/
		
		
		//var self = this;
		// linkWrappers click actie
		this.linkWrappers.css('cursor', 'pointer').hover(
			function() {		
				self.setCurrent(
					self.linkWrappers.index($(this))
				);
			}			
		);
		
		this.resetAutoTimer();
	},
	
	pauseAutoTimer: function() {

		clearInterval(this.autoTimer);
	},
	
	resetAutoTimer: function() {

		var self = this;

		clearInterval(this.autoTimer);
		this.autoTimer = setInterval(function() {
			self.showNext();
		}, this.timerInterval);
	},
	
	hideAll: function() {		

		this.photoWrapper.css({
			opacity: 0,
			position: 'absolute',
			top: 0
		});	
		/*
		this.textWrapper.css({
			opacity: 0,
			position: 'absolute',
			top: 0
		});	*/
		 
		this.showCurrent();
	},
	
	showCurrent: function() {
		this.linkWrappers.eq(this.current).addClass('active');
		//this.photoWrapper.eq(this.current).stop().animate({opacity: 1});
		this.photoWrapper.eq(this.current).stop().css({'zIndex':'10'}).animate({opacity: 1});
	},
	
	hideCurrent: function() {
		this.linkWrappers.eq(this.current).removeClass('active');
		//this.photoWrapper.eq(this.current).stop().animate({opacity: 0});
		this.photoWrapper.eq(this.current).stop().css({'zIndex':'1'}).animate({opacity: 0});
	},
	
	setCurrent: function(index) {
		
		//prev state
		this.hideCurrent();
		//set new state
		this.current = index;
		//new state
		this.showCurrent();
		
		//reset timer
		this.resetAutoTimer();
	},
	
	showNext: function() {
		//can only be a number as large as the collection!, otherwise it wil reset itself
		this.setCurrent((this.current + 1) % this.linkWrappers.length);
	}
};