$(document).ready(function() {
  $("img.button").hover(
		  function(){
			  $(this).attr("src", $(this).attr("src").replace("zwart-wit", "kleur"));
		  },
		  function(){
			  $(this).attr("src", $(this).attr("src").replace("kleur", "zwart-wit"));
		  }		  
  );
  
  if($("#pane ul > li").size() % 2 == 0)
	  $('#pane ul li:last-child').prev('li').andSelf().addClass("last");
  else
	  $('#pane ul li:last-child').addClass("last");
});


function initImage(id)
{
	$("#imagesContent ul li a img").each(function(){
		if($(this).attr("id") == "image"+id)
		{
			$(this).attr("src", $(this).attr("src").replace("zwart-wit", "kleur"));
			$(this).hover(
					  function(){
						  $(this).attr("src", $(this).attr("src").replace("zwart-wit", "kleur"));
					  },
					  function(){
						  $(this).attr("src", $(this).attr("src").replace("zwart-wit", "kleur"));
					  }		  
			);
		}
	});
}


function loadImage(id)
{
	$("#projectImage").attr("src", "/afbeelding/"+id);
	$("#imagesContent ul li a img").each(function(){
		$(this).unbind('mouseenter mouseleave');
		if($(this).attr("id") == "image"+id)
		{
			$(this).attr("src", $(this).attr("src").replace("zwart-wit", "kleur"));
			$(this).hover(
					  function(){
						  $(this).attr("src", $(this).attr("src").replace("zwart-wit", "kleur"));
					  },
					  function(){
						  $(this).attr("src", $(this).attr("src").replace("zwart-wit", "kleur"));
					  }		  
			);
		}
		else
		{
			$(this).attr("src", $(this).attr("src").replace("kleur", "zwart-wit"));
			$(this).hover(
					  function(){
						  $(this).attr("src", $(this).attr("src").replace("zwart-wit", "kleur"));
					  },
					  function(){
						  $(this).attr("src", $(this).attr("src").replace("kleur", "zwart-wit"));
					  }		  
			);
		}
	});
}

function setProject(id, nr)
{
	for(i = 0; i < 4; i++)
	{
		$("#pj"+i).removeClass("selected");
	}
	
	$("#pj"+nr).addClass("selected");
	
	$.ajax({ 
		url: "/klant-project/"+id, 
		dataType: "json",
		success: function(data, textStatus, XMLHttpRequest){
			$("#textContent").html(data[0]);
			$("#imagesContent").html(data[1]);
			$("img.button").hover(
				  function(){
					  $(this).attr("src", $(this).attr("src").replace("zwart-wit", "kleur"));
				  },
				  function(){
					  $(this).attr("src", $(this).attr("src").replace("kleur", "zwart-wit"));
				  }		  
			 );
			loadImage(data[2]);
		}
	});
	
	
}