// JavaScript Document

function loadPortfolioOverview(itemCount){
		$.getJSON('data/ajax_portfolio_item.js',function(data){

		if (itemCount){
			var itemsToShow = itemCount;
		} else {
			var itemsToShow = data.length;
		}
	
		var itemString3 = ""
		for(var i=0; i<(itemsToShow); i++) {
			var id = i;
			var projectName = data[id].projectName;
			var title = data[id].title;
			var subTitle = data[id].subTitle;
			
			itemString1 = itemString3 + '<li><a href="#" onclick="openPortfolioItem(' + id + ');return false;">'
			itemString2 = itemString1 + '<div class="image" style="background:url(media/' + projectName + '/thumbnail.jpg);"></div>'
			itemString3 = itemString2 + '<div class="title">' + title + '</div><div class="type">' + subTitle + '</div></a></li>'
		}
		$('#portfolio_items').html(itemString3);
	});
}

function openPortfolioItem(id){
	$('#overlayBackground').css('filter', 'alpha(opacity=30)');
	$('#overlayBackground').fadeIn(100, function(){
		$('#visualBlock').fadeIn(function(){
			$('#horizontalBar').fadeIn();									
		});
	});
	
	loadPortfolioItem(id);
	
	//$('#overlayBackground').show();
	//$('#horizontalBar').slideDown(200, function() {
		//$('#visualBlock').slideDown(300, function() {
			//loadPortfolioItem(id);
		//});
	//});
}

function closePortfolioItem(){
	$('#visualBlock').fadeOut(50, function(){
		$('#horizontalBar').fadeOut(100);
		$('#overlayBackground').fadeOut(200);
	});
	
	
	//$('#visualBlock').slideToggle(400);
	//$('#horizontalBar').slideToggle(400);
	//$('#overlayBackground').hide();
	
	$(".projectDescription div").css("display", "none");
	$(".portfolioItemTitle .text").css("display", "none");
	$("#visuals .container").css("display", "none");
	$('#visuals .container').cycle('destroy');
	$('#visuals .container').html("");
}

function browsePortfolioItem(id){
	$('.projectDescription div').fadeOut(400);
	$('.portfolioItemTitle .text').fadeOut(400);
	$("#visuals .container").fadeOut(700, function() {
		$('#visuals .container').cycle('destroy');
		loadPortfolioItem(id);
	});
}

function loadPortfolioItem(id){
		// Load content
		$.getJSON('data/ajax_portfolio_item.js',function(data){

		$('.projectDescription div').fadeIn(400);
		$('.portfolioItemTitle .text').fadeIn(400);
		
		$('.portfolioItemTitle .text').html(data[id].title + ' <span>&nbsp;&nbsp;' + data[id].subTitle + '</span>');
		$('.projectDescription .description').html(data[id].description);
		$('.projectDescription .partnerText').html(data[id].partnerText);
		
		
		if (id == (data.length-1)){
			var nextId = 0;
		} else {
			var nextId = id+1;
		}
		
		if (id == 0){
			var previousId = (data.length-1);
		} else {
			var previousId = id-1;
		}
		
		var navBarStringNext = '<a href="#" onclick="browsePortfolioItem(' + nextId + ');return false;" class="next"><img src="img/nav_arrow_right.png" width="15" height="15"></a>'
		var navBarStringPrev = '<a href="#" onclick="browsePortfolioItem(' + previousId + ');return false;" class="previous"><img src="img/nav_arrow_left.png" width="15" height="15"></a>'
		$('#horizontalBar .navBlock').html(navBarStringNext + navBarStringPrev);
		
		var partnersString = ""
		for(var i=0; i<(data[id].partners.length); i++) { 
			var name = data[id].partners[i]; 
			var url = data[id].partners[i+1]; 
			var partnersString = partnersString + "<a href='http://" + url + "' target='_blank'>" + name + "</a>&nbsp;&nbsp;";
			i = i+1;
		}
		$('.projectDescription .partners').html(partnersString);	
		
		
		var linkString = ""
		if (!data[id].links[0] == ''){
			for(var i=0; i<(data[id].links.length); i++) { 
				var name = data[id].links[i]; 
				var url = data[id].links[i+1]; 
				var linkString = linkString + "<a href='http://" + url + "' target='_blank'>" + name + "</a>";
				i = i+1;
			}
		}
		$('.projectDescription .links').html(linkString);

	
		// Start slider or video
		if(data[id].video){
			$("#visualBlock").css("height", "470px");
			$("#visualBlock #visuals").css("height", "400px");
			
			
			var videoString = "<iframe src='media/" + data[id].projectName + "/video.html' width='640px' height='400px' frameborder='0' scrolling='no'></iframe>";
			$('#visuals .container').html(videoString);
			$("#visuals .container").fadeIn(1000);
	
		} else {
		$(function() {
			$.preload(["media/" + data[id].projectName + "/visual_1.jpg"], {loaded_all: function(loaded, total) {

				var visualString = ""
				for(var i=0; i<(data[id].visualCount); i++) { 
					var visualString = visualString + "<img src='media/" + data[id].projectName + "/visual_" + (i+1) + ".jpg'>";
				}
				
				$("#visualBlock").css("height", "610px");
				$("#visualBlock #visuals").css("height", "530px");
				
				$('#visuals .container').html(visualString);
				
				$("#visuals .container").fadeIn(1000);
				$('#visuals .container').cycle({ fx:'scrollHorz', speed:1900, timeout: 3500, easing:'easeInOutQuart', pager: '.dotNav .floatRight' });
				}
			});
		});
		}
	
	});
}

// Image preload function for slider
(function($) {
	var imgList = [];
	$.extend({
		preload: function(imgArr, option) {
			var setting = $.extend({
				init: function(loaded, total) {},
				loaded: function(img, loaded, total) {},
				loaded_all: function(loaded, total) {}
			}, option);
			var total = imgArr.length;
			var loaded = 0;
			
			setting.init(0, total);
			for(var i in imgArr) {
				imgList.push($("<img />")
					.load(function() {
						loaded++;
						setting.loaded(this, loaded, total);
						if(loaded == total) {
							setting.loaded_all(loaded, total);
						}
					})
					.attr("src", imgArr[i])
				);
			}
			
		}
	});
})(jQuery);