var XMLPATH = "../xml/gtr_artists.xml";

$("document").ready(function()
{	
	$.ajax({url: XMLPATH,
		    type: "GET",
			cache: false, 
		    success: DrawArtists,			
			dataType: "xml"});	
});

//response
function DrawArtists(XmlDoc)
{
	var artist_items;
	var html = "";
	var count = 0;
	var link, img, name, job, desc;
	
	//get all artists
	artist_items = $("artist", XmlDoc);

	artist_items.each(function()
    {
		//get xml attr
		link  = $(this).attr("link");
		img   = "../static/images/artists/" + $(this).attr("img");
		name  = $(this).attr("name");
		job   = $(this).attr("job");
		
		//get description
		desc = $(this).find("desc").text();
		
		//start container
		if(count % 3 == 0)
		{
			 html += "<div class=\"artists_container\">";
		}

		//open artists div -----------------------------------------------------		
		if(count % 3 == 2)
		{
			html += "<div class=\"artists_item\">";
		}
		else
		{
			html += "<div class=\"artists_item\" style=\"margin-right: 10px;\">";	
		}		
	    
			//set image
			html += "<a href=\"" + link + "\" title='" + name + " - " + job + "' class=\"ImgLink\">";
			html += "<img src=\"" + img + "\" alt='" + name + " - " + job + "' title='" + name + " " + job + "' border=\"0\"/>";
			html += "</a>";
			
			//set content			
			html += "<a href=\"" + link + "\" title='" + name + " - " + job + "' class=\"ContentLink\" style=\"display: none\">";
				html += "<span class=\"Name\">" + name + "</span><br/>";
				
				if(job != "" && job != undefined)
				{
					html += "<span class=\"Job\">" + job + "</span><br/>";
				}
				html += desc + "<br/>";
			html += "</a>";				
		
		html += "</div>";
		//end artists div -----------------------------------------------------
		
		count++;
		
		//end container
		if((count % 3 == 0) || (count == artist_items.length))
		{
			 html += "</div>";			
		}				
    });	
	
	//set html
	document.getElementById("XmlArtists").innerHTML = html;	
	
	//set onmouseover
	$("#XmlArtists div.artists_container div.artists_item").mouseover(function()
	{
		$(this).find("a.ImgLink").hide();
		$(this).find("a.ContentLink").show();		
	});	
	
	$("#XmlArtists div.artists_container div.artists_item").mouseout(function()
	{
		$(this).find("a.ImgLink").show();
		$(this).find("a.ContentLink").hide();		
	});		
	
	
}