var currentDetail = null;

// Affichage du détail
function showDetail() {
	var output = $("<table class=\"Detail\"><tr><td></td></tr></table>");
	output.css({
		top: currentDetail.attr("coords").split(",")[1] - 26,
		left: currentDetail.attr("coords").split(",")[0] - 15,
		backgroundImage: "url(" + currentDetail.attr("href") + ")"
	}).find("td").text(currentDetail.attr("title"));
	
	if ( currentDetail.attr("alt") != "" ) {
		output.css("cursor", "pointer").click(function(){
			window.location = currentDetail.attr("alt");
		});
	}
	output.bind("mouseout", hideDetail);
	$("#WebHandlingDetails").append(output);
}

// Fermeture du détail
function hideDetail() {
	var detail = $("#WebHandlingDetails").children(".Detail");
	if ( currentDetail != null ) {
		detail.unbind("mouseout", hideDetail);
		detail.remove();
		currentDetail = null;
	}
}


$(document).ready(function(){
	
	// Interaction avec l'image de détails
	$("#mapWebHandlingDetails area")
		.mouseover(function(){
			currentDetail = $(this);
			showDetail();
		})
		
		.click(function(){
			return false;
		});

});