// Currently selected project
var current_project_id = null;

// On window load show first client in list
window.addEvent('domready', function() {
    
    // Set up the events for each project thumbnail
	$$("#col1 .thumb").each(function(i) {
		i.setStyle("opacity", .5);
		i.addEvent("mouseover", function() { i.fade(1); });
		i.addEvent("mouseout", function() { i.fade(.5); });
		i.addEvent("click", function() { show_client(i, "client_" + i.id); });
	});
	
	// Choose which project to show first
	show_client($("mrt"), "client_mrt");
    
});

// Responsible for showing the appropriate project
function show_client(thumb, show_id) {
 
 	if (current_project_id == show_id) { 
		return;
	}
 
 	// Fade in the currently selected project
	$(show_id).setStyle("opacity", 0);
	$(show_id).setStyle("display", "block");
	$(show_id).fade(1);
	$(show_id).removeEvents("mouseout");
		
	// Hide the previously selected project
 	if (current_project_id != null) {
 	 	$(current_project_id).setStyle("display", "none");
	}
	
	// Store the currently selected project id
	current_project_id = show_id;
	
}