$(document).ready(function() {
	
	getProjectsXML();
});

var projectsDoc

function getProjectsXML() {
	
	$.ajax({
	   type: "GET",
	   url: "inc/work.xml",
	   dataType: "xml",
	   success: function(doc){
		projectsDoc = doc;
		setUpProjects();
	  }
	 });
	 
}

function setImage(path) {
	
	$("#projectImage")
		.attr("src", path)
		.attr("width", 446)
		.attr("height", 250);	
}
//screenShots
//launchButton
//
//projectDescription

function setUpProjects() {
	$("#projectNav").empty();
	$("project", projectsDoc).each(function(index, item) {
		var project = $(item);
		$("#projectNav")
			.append(
				$("<li></li>")
					.append(
						$("<a href='javascript:;'></a>")
							.text(project.attr("name"))
							.addClass((index == 0) ? "active" : "")
							.click(function() {
								swapProject(project)
							})
					)
			);
		
		if(index == 0) {
			swapProject(project);
		}
	});
	 
}

function swapProject(project) {
	var subNavLinks = $("#projectNav a"); 
	subNavLinks.each(function(index, link) {
		var jLink = $(link); 
		jLink.removeClass("active");
		if(jLink.text() == project.attr("name")) {
			jLink.addClass("active");
		}
	});
	
	if(project.attr("launchURL")==undefined){
	$("#launchButton").hide();
	}else{
	$("#launchButton").attr("href", project.attr("launchURL"));
	$("#launchButton").show();
	}
	
	var firstImage = $("image", project).get(0);
	var firstImagePath = $(firstImage).attr("path");

	setImage(firstImagePath);
	
	$("#projectName").text(project.attr("name"));
	$("#clientHeading").text($("client", project).text())
	$("#serviceHeading").text($("services", project).text())
	$("#projectDescription").html($("description", project).text())

	setUpScreenShotNav(project);
}

function updateScreenShotNav(imgIndex) {
	var screenShots = $("#screenShots a"); 
	screenShots.each(function(index, link) {
		var jLink = $(link); 
		jLink.removeClass("active");
		if(index == imgIndex) {
			jLink.addClass("active");
		}
	});
}

function setUpScreenShotNav(project) {
	$("#screenShots").empty();
	var images = $("image", project); 
			images.each(function(imgIndex, image) {
				$("#screenShots")
					.append(
						$("<li></li>")
							.append(
								$("<a href='javascript:;'></a>")
									.text((imgIndex) + 1)
									.addClass((imgIndex == 0) ? "active" : "")
									.click(function() {
										imgTag = $($("image", project).get(imgIndex));
										setImage(imgTag.attr("path"));
										updateScreenShotNav(imgIndex);
									})
							)
					);
			});
}