$(function() {
		function closePortfolio() {
			$('.portScroller').fadeOut("fast");
			$('.prev').fadeOut('fast');
			$('.next').fadeOut('fast');
			$('.close').fadeOut('fast');
			$('#subNav').fadeOut('fast');
			$('#projectName').fadeOut('fast');
			$('#footer').fadeIn('slow');
			$('.mainScroller').fadeIn('slow');
			//$('#preloader').hide();	
			$(".portScroller .items").empty();
			for (i = 0; i < 4; i++) {	
				$(".portScroller .items").append('<div id="item'+i+'"><img src="../images/pixel.gif" alt="" /></div>');

			}
			porfolioOpen = false;
			
		}
		
		
		
		$("#nav li").click(function(e) {
				//if (!porfolioOpen) {
					$('#nav li').removeClass('on');
					$(this).addClass('on');
				//}
				closePortfolio();
			}
			/*,
			function() {
				$(this).animate({borderTopColor: '#fff'}, 300);
			},
			function() {
				$(this).animate({borderTopColor: '#ccc'}, 300);
			}*/
			
		);
		
		$(".step").click(	function(e) {
				$('.step').removeClass('subNavSelected');
				$(this).addClass('subNavSelected');
			}
		);
		
		var portfolioTitles = new Array();
		portfolioTitles[0] = "tumi|Tumi|Rebrand & Redesign|2010";
		portfolioTitles[1] = "betsey|Betsey Johnson|Redesign|2010";
		portfolioTitles[2] = "espn|ESPN Shop|Redesign|2010";
		portfolioTitles[3] = "peacocks|Peacocks|Redesign|2010";
		portfolioTitles[4] = "nascar|NASCAR|Superstore Redesign|2009";
		portfolioTitles[5] = "maurices|Maurices|Online Store Launch|2009";
		portfolioTitles[6] = "rockport|Rockport|Rebrand & Redesign|2008";
		portfolioTitles[7] = "ace|Ace Hardware|Multi-Channel Redesign|2007";
		portfolioTitles[8] = "torsion|Rockport with Adidas Torsion|International Microsite|2007";
		portfolioTitles[9] = "nick|Nickelodeon|Online Strategy & Redesign|2006";
		portfolioTitles[10] = "dicks|Dick’s Sporting Goods|Rebrand & Redesign|2006";
		
		$("#portfolio li a").click(function(e) {
				porfolioOpen = true;
				$('#preloader').fadeIn('fast');			
				var brand = $(this).parent().attr("id");
				$('.mainScroller').fadeOut('fast');
				
				$.get('portfolio/'+brand+'.txt', function(data) {
					$(".portScroller .items").empty();
					//$("#subNav").empty();
					var count = 0;
					var items = data.split('|')
					for (i = 0; i < items.length; i++) {	
						$(".portScroller .items").append('<div id="item'+i+'" style="display:none;"><img src="' + items[i] + '" alt="" /></div>');
						
						count++;
					}
					for (j = 0; j < 4; j++) {
						if (j==0) {
							$("#subNav #step"+j).addClass("step active");
						}
						else if (j<count) {
							$("#subNav #step"+j).addClass("step");
							$("#subNav #step"+j).removeClass("stepHide");
							$("#subNav #step"+j).removeClass("active");
						}
						else {
							$("#subNav #step"+j).addClass("stepHide");
							$("#subNav #step"+j).removeClass("active");
							$("#subNav #step"+j).removeClass("step");
						}
					}
					for (k = 0; k < portfolioTitles.length; k++) {
						var titles = portfolioTitles[k].split("|");
						if (titles[0]==brand) {
							$("#projectName strong").html(titles[1]);
							$("#projectName .specs").html(titles[2]);
							$("#projectName .year").html(titles[3]);
						}
					}
					if (count==4)
						$('#subNav').css('margin-left','859px');
					if (count==3)
						$('#subNav').css('margin-left','879px');
					if (count==2)
						$('#subNav').css('margin-left','900px');
					
				  
				});
				//var imgHeight = 705;//$('.portScroller div#item1 img').attr("height");
				//alert(imgHeight);
				$('#footer').fadeOut('slow');
				
					
				$(".portScroller").scrollable().begin();
				$('.portScroller').fadeIn('slow', function() {
						$('.prev').fadeIn('slow').css({display:'block'});
						$('.next').fadeIn('slow').css({display:'block'});
						$('.close').fadeIn('slow').css({display:'block'});
						//$('#subNav').fadeIn('slow').css({display:'block'});
						$('#projectName').fadeIn('slow').css({display:'block'});
						$('.portScroller div').addClass("active");
						
						
				 });
				
				$('#preloader').fadeOut('fast', function() {
					var imgHeight = $('.portScroller div#item0 img').attr("height");
					var subNavTop = Number(imgHeight+109)+'px';
					imgHeight = Number(imgHeight)+'px';
					//alert("third " +subNavTop + " " + imgHeight);
					resizePortfolio(subNavTop, imgHeight);
					
				});
			}
		);
		
		
		
		$("#subNav li a").click(	function(e) {
				$('#subNav li a').removeClass('subNavSelected');
				$(this).addClass('subNavSelected');
			}
		);
		

		
		

	});