// project Array
var projectArray = [];
var numberOfItems = 0;

$(document).ready(function() {	
	$.get("./xml/content.xml", {}, function(xml) {
		var count = 0;
		$(xml).find('project').each(function() {
			var projectId = $(this).attr('id');
			var projectTitle = $(this).attr('title');
			var projectProduct =  $(this).find('product').text();
			var projectYear = $(this).find('year').text();
			var projectClient = $(this).find('client').text();
			var projectDescription = $(this).find('description').text();
			var projectUrl = $(this).find('url').text();
			
			var mediaArray = [];	

			var mediaCount = 0;
			$(this).find('media').each(function() {
				var url = $(this).attr('url');
				if ($(this).attr('type') == "video") {
					var mediaObject = {"type" : "video", "url": url };
					mediaArray[parseInt(mediaCount)] = mediaObject;
				} else {
					var mediaObject = {"type" : "image", "url": url };
					mediaArray[parseInt(mediaCount)] = mediaObject;
				}
				mediaCount++;
			});
			
			projectArray[parseInt(count)] = new Array(projectTitle, projectProduct, projectYear, projectClient, projectDescription, projectUrl, mediaArray)
			count++;

		});
		// open random project
		//var random = Math.floor(Math.random()*7);
		
		//Random uit gezet zodat hij altijd met Elastique start
		
		projectId = 1;
		// fake a click event on a random carousel item
		$('#carousel_list').find('.item'+projectId).click();
		
	});				
});

function showProject(projectId) {
	
	// re-initialize variables
	numberOfItems = 0;
	nextImageNumber = 0;
	prevImageNumber = 0;
	
	$('#media').html("<img class='loading' src='./images/loading.gif' />");	
	$('#content').css('display','inline');
	// convert ProjectId To Array Position
	converted = projectId - 1;
	// header titel
	$('#content_header_titel').html(projectArray[converted][0]);
	// content footer info
	$('.product').html("Product: <strong>" + projectArray[converted][1] + "</strong>");
	$('.year').html("Year: <strong>" + projectArray[converted][2] + "</strong>");
	$('.client').html("Client: <strong>" + projectArray[converted][3] + "</strong>");
	// main content
	$('#rounds').html("");
	$.each(projectArray[converted][6], function() {
		numberOfItems++;	
		$('#rounds').append("<a href='#' id='media" + numberOfItems + "' class='round'></a>");	
	});
	$('#media1').attr('class', 'selected'); 
	$('#desc').html(projectArray[converted][4]);
	// add scrollpane to desc after filling
	$('#desc').jScrollPane();	
	// add url if not empty
	if (projectArray[converted][5] != '') {
		$('.link').css('display', 'inline');
		$('.link').attr('href', projectArray[converted][5]);
	} else {
		$('.link').css('display', 'none');		
	}
	if (projectArray[converted][6][0].type == "video") {
		$('#media').oembed(projectArray[converted][6][0].url);		
	} else {
		$('#media').html("<img src='" + projectArray[converted][6][0].url + "' />");				
	}
		
};

function nextImage() { 
	currentImageNumber = parseInt($('#content_body').find(".selected").attr('id').substring(5));
	if (currentImageNumber < numberOfItems) {
		$('#media').html("<img class='loading' src='./images/loading.gif' />");		
		nextImageNumber = currentImageNumber + 1;	
		$('#content_body').find(".selected").attr('class', 'round');	
		if (projectArray[converted][6][nextImageNumber-1].type == "video") {
			$('#media').oembed(projectArray[converted][6][nextImageNumber-1].url);		
		} else {
			$('#media').html("<img src='" + projectArray[converted][6][nextImageNumber-1].url + "' />");				
		}
		$('#media' + nextImageNumber).attr('class', 'selected');
	} else {
		$('#media').html("<img class='loading' src='./images/loading.gif' />");		
		nextImageNumber = 1;	
		$('#content_body').find(".selected").attr('class', 'round');	
		if (projectArray[converted][6][nextImageNumber-1].type == "video") {
			$('#media').oembed(projectArray[converted][6][nextImageNumber-1].url);		
		} else {
			$('#media').html("<img src='" + projectArray[converted][6][nextImageNumber-1].url + "' />");				
		}
		$('#media' + nextImageNumber).attr('class', 'selected');		
	}
};	

function prevImage() { 
	currentImageNumber = parseInt($('#content_body').find(".selected").attr('id').substring(5));
	if (currentImageNumber > 1) {
		$('#media').html("<img class='loading' src='./images/loading.gif' />");		
		prevImageNumber = currentImageNumber - 1;	
		$('#content_body').find(".selected").attr('class', 'round');	
		if (projectArray[converted][6][prevImageNumber-1].type == "video") {
			$('#media').oembed(projectArray[converted][6][prevImageNumber-1].url);		
		} else {
			$('#media').html("<img src='" + projectArray[converted][6][prevImageNumber-1].url + "' />");				
		}
		$('#media' + prevImageNumber).attr('class', 'selected');
	} else {
		$('#media').html("<img class='loading' src='./images/loading.gif' />");		
		prevImageNumber = numberOfItems;	
		$('#content_body').find(".selected").attr('class', 'round');	
		if (projectArray[converted][6][prevImageNumber-1].type == "video") {
			$('#media').oembed(projectArray[converted][6][prevImageNumber-1].url);		
		} else {
			$('#media').html("<img src='" + projectArray[converted][6][prevImageNumber-1].url + "' />");				
		}
		$('#media' + prevImageNumber).attr('class', 'selected');		
	}
};