$(document).ready(function() {

/**********************************************
de navigatie tussen de golfcourses, syntax: (vul id's en classes in die overeenkomen met die in de html)

																								!!deze dienen allen uniek te zijn per container
$('IDwrapper').mainNav(													IDwrapper = de ID van de div die alle divs met inhoud bevat
	'IDinhoud',																		IDinhoud = de ID van de divs die de inhoud bevatten														
	'classFirst', 																classFirst = de class voor de eerste div met inhoud
	'IDnav',																			IDnav = de ID van de lijst met navigatie	
	'classFirstNav',															classFirstNav = extra class voor de eerste link
	'random1',																		'random1' = een random classnaam die je nergens anders al gebruikt hebt
	'random2'																			'random2' = een random classnaam die je nergens anders al gebruikt hebt
);
**********************************************/
$('#golfWrapper').mainNav('golfContainer', 'first', 'golfNav', 'one', 'visible', 'current');

/**********************************************
de navigatie tussen de afbeeldingen, syntax: (vul id's en classes in die overeenkomen met die in de html)

																								!!deze dienen allen uniek te zijn per gallery!!
$('IDwrapper').imgNav(													IDwrapper = de ID van de div die de navigatie lijst en afbeeldingenlijst bevat
	'classFirstImg', 															classFirstImg = de extra class voor de eerste afbeelding
	'classLastImg', 															classLastImg = de extra class voor de laatste afbeelding
	'classNextA', 																classNextA = de extra class voor de 'next' link
	'classPrevA', 																classPrevA = de extra class voor de 'previous' link
	'classUL', 																		classUL = de class voor de lijst die de navigatie bevat
	'classRandom'																	classRandom = een random classnaam die je nergens anders al gebruikt hebt
);
***********************************************/
$('#golfImg1').imgNav('firstImg', 'lastImg', 'nextNav', 'prevNav', 'imgN1', 'visibleImg');
$('#golfImg2').imgNav('firstImg2', 'lastImg2', 'nextNav2', 'prevNav2', 'imgN2', 'visibleImg2');
$('#golfImg3').imgNav('firstImg3', 'lastImg3', 'nextNav3', 'prevNav3', 'imgN3', 'visibleImg3');
$('#golfImg4').imgNav('firstImg4', 'lastImg4', 'nextNav4', 'prevNav4', 'imgN4', 'visibleImg4');
$('#golfImg5').imgNav('firstImg5', 'lastImg5', 'nextNav5', 'prevNav5', 'imgN5', 'visibleImg5');
$('#golfImg6').imgNav('firstImg6', 'lastImg6', 'nextNav6', 'prevNav6', 'imgN6', 'visibleImg6');
$('#golfImg7').imgNav('firstImg7', 'lastImg7', 'nextNav7', 'prevNav7', 'imgN7', 'visibleImg7');
$('#golfImg8').imgNav('firstImg8', 'lastImg8', 'nextNav8', 'prevNav8', 'imgN8', 'visibleImg8');
$('#golfImg9').imgNav('firstImg9', 'lastImg9', 'nextNav9', 'prevNav9', 'imgN9', 'visibleImg9');

});



// mainNav functie voor de navigatie over golfcourses
(function($) {
	$.fn.mainNav = function(
			container,
			first,
			nav,
			firstNav,
			visible,
			current
		) {
		
		var speed = 0;																		//speed for the fade, set 0 for no fading
		var container = container;											
		var first = first;															
		var nav = nav;			
		var firstNav = firstNav;
		var visible = visible;
		var current = current;
		
		$('.'+first).css({display:'block'}).addClass(visible);	
		$('#'+nav+' a.'+firstNav).css({backgroundColor:'#831619'}).addClass(current);
		$('#'+nav+' a').click(function(event){
			event.preventDefault();
			$('.'+current).css({backgroundColor: 'transparent'}).removeClass(current);
			$(this).css({backgroundColor:'#831619'}).addClass(current);
			var target = $(this).attr('href');	
			if ($('#'+target).hasClass(visible)){return}
			else {
				$('.'+visible)
					.stop()
					.fadeOut(speed)
					.removeClass(visible);
				$('#'+target)
					.stop()
					.fadeIn(speed)
					.addClass(visible); 
			}
		});
	}
})(jQuery);
	

//imgNav functie voor navigatie over afbeeldingen
(function($) {
	$.fn.imgNav = function(
			firstImg,
			lastImg,
			nextNav,
			prevNav,
			navImg,
			visibleImg
		) {
		
		var speedImg = 0;																			//speed for the fade, set 0 for no fading
		var firstImg = firstImg;															
		var lastImg = lastImg;																
		var nextNav = nextNav;																
		var prevNav = prevNav;																
		var navImg = navImg;																
		var visibleImg = visibleImg;
		
		$('.'+firstImg).css({display:'block'}).addClass(visibleImg);		
		$('.'+navImg+' a').click(function(event){
			event.preventDefault();
			if ($(this).hasClass(nextNav) && $('.'+visibleImg).hasClass(lastImg)) {
				return;
			} else if ($(this).hasClass(prevNav) && $('.'+visibleImg).hasClass(firstImg)) {
				return;
			} else if ($(this).hasClass(nextNav)) {
				var targetImg = $('.'+visibleImg).next();	
			} else if ($(this).hasClass(prevNav)) {
				var targetImg = $('.'+visibleImg).prev();	
			}
			$('.'+visibleImg)
				.stop()
				.fadeOut(speedImg)
				.removeClass(visibleImg);
			$(targetImg)
				.stop()
				.fadeIn(speedImg)
				.addClass(visibleImg); 
		});
	}
})(jQuery);