var theList="", theRegionList="", prevRegion="";
$(document).ready(function() {
	
	$.get(xmlURL, function(xml){ 
		var distributors = $.xml2json(xml);
		$(distributors.distributor, xml).each(function(i){
			
			var theRegion=this.region;
			var theLogo=this.logo;
			var theName=this.name;
			var theAddress=this.address;
			var theContact=this.contact;
			var theEmail=this.email;
			var theWeb=this.web;
			var theProducts=this.products;
			
			//region list		
			if (prevRegion != theRegion){
				theRegionList += "<li>"+theRegion+"</li>";
			}else{
				theRegionList += "<li>&nbsp;</li>";
			}
			prevRegion = theRegion;

			//distributor list
			theList +=	"<li>"+theName;
			theList	+=	"	<ul>"
			theList	+=	"			<li class=\"region\">"+theRegion+"</li>";
			if (theLogo != ""){
				theList	+=	"		<li class=\"logo\"><img src=\""+theLogo+"\" alt=\"\" /></li>";
			}
				theList	+=	"		<li class=\"name\">"+theName;

			if (theAddress != ""){
				theList	+=	"<br /><span style=\"color:#707070;font-size:12px;\">"		+theAddress+"</span>";
			}
				theList+="</li>";
			
			if (theContact != ""){
				theList	+=	"		<li class=\"contact\"><strong>Contact:</strong> "+theContact;
			}
			if (theEmail != ""){
				theList += 	"		<br /><strong>Email: </strong><a href=\"mailto:"+theEmail+"\" target=\"_blank\">"+theEmail+"</a>";
			}
			
			if(theWeb !=""){
			
				theTempURL = theWeb.replace("http://", "");
				theList +=		"		<br /><strong>Web:</strong> <a href=\"http://"+theTempURL+"\" target=\"_blank\">Visit Website</a>";
			}
			
			
			theList	+=	"	</li></ul>";
			theList	+=	"</li>";
			
			
		});
		$("ul.regionList").html(theRegionList);
		$("ul.distributorList").html(theList);
		$("ul.distributorList li").click(function() {
				$("#distributorInfoContainer .pad").html("");
				$(this).children("ul:eq(0)").clone().appendTo($("#distributorInfoContainer .pad"));
				$("#distributorInfoContainer").addClass("visible");
		});
		
		
		$("ul.distributorList li").hover(
			function () {
				$(this).addClass("highlight");
			}, 
			function () {
				$(this).removeClass("highlight");
			}
		);
		
	});
	
	

});