
$(document).ready(function() {


	function checkIt() {
		
		var switchSpeed = 5000;
		//var player			= $("#con_photoviewer");
		
		$(".photo a:last").animate({
			'opacity' : 1
		}, switchSpeed).animate({
			'opacity' : 0
		}, 1000, function() {
			$(this).insertBefore(".photo a:first");
		}).animate({
			'opacity' : 1
		}, 100, checkIt);

		$(".beschrijving div:last").show().animate({
			'opacity' : 1
		}, switchSpeed).animate({
			'opacity' : 0
		}, 1000, function() {
			$(this).insertBefore(".beschrijving div:first").hide().animate({
				'opacity' : 1
			}, 100);
		});

	}

	
	$("#con_photoviewer").find('.photo IMG').each(function() {
		var h = $(this).height();
		var w = $(this).width();
		
		if ( h > w ) {
			$(this).css({
				'height' : '100%'
			});
		} 

		if ( h < w ) {
			$(this).css({
				'width' : '100%'
			});
		} 

	});
	

	checkIt();
	
	
	
	
	
	
	
  /* ----- SLIDER ----- */
  $sliderTimer = setInterval(nextImage, 6000);
  $imageWidth = 560;
  $imageActuelle = 1;
  $imageTotal = $(".slider img").length;

  $(".slider").css("width", ($imageTotal + 1) * $imageWidth + "px");

  for ($i = 0; $i < $imageTotal; $i++) {
    $(".slider-boutons").append("<span id='"+($i+1)+"' class='circle'><a href='#' onClick='return false'>&nbsp;</a></span>");
    $("#" + ($i + 1) + " a").click(function(event) { selectImage(event); });
    $("#" + ($i + 1) + " a").css("text-decoration", "none");
  }

  $("#" + $imageActuelle).css("background-color", "#873C5C");

  function nextImage(){
    $("#" + $imageActuelle).css("background-color", "#a3a297");
    if ($imageActuelle == $imageTotal) { $imageActuelle = 0; }
    $imageActuelle++;
    $deplacement = -($imageWidth + 4) * ($imageActuelle - 1);
    $(".slider").animate({marginLeft:$deplacement}, {duration:600});
    $("#" + $imageActuelle).css("background-color", "#873C5C");
  };

  function selectImage(event) {
    clearInterval($sliderTimer);
    $id = $(event.target).parent().attr("id");
    $id--;
    $deplacement = -($imageWidth + 4) * $id;
    $(".slider").animate({marginLeft:$deplacement}, {duration:600});
    $("#" + $imageActuelle).css("background-color", "#a3a297");
    $("#" + ($id + 1)).css("background-color", "#873C5C");
    $imageActuelle = $id + 1;
    $sliderTimer = setInterval(nextImage, 6000);
  };
	
	
	
	
	
	
});

