//do when the document is ready
$(document).ready(function() {



 



    		    		
    //hide the portfolio grids
    $('.portfolio_grid').hide();
    
    //set the transparenct on the grid items
    //$('.portfolio_grid li').fadeTo('fast',.4);
    
    //hide the portfolio image
    $('.project-image').hide();
    
    //set the transparenct on the image
    $('.project-image').fadeIn('normal');
    
    //show the starting grid 
    $('#webPortfolio').fadeIn('normal');
    
    //set the hover for the grid items
    $('.portfolio_grid li').hover(function(){
    	//$(this).fadeTo('fast',1);
   	}, function(){
    	//$(this).fadeTo(10,.4);
    }); // END Selector

	$('#webPortfolio li:eq(0)').addClass('alpha');
	$('#webPortfolio li:eq(3)').addClass('alpha');
	
	$('#webPortfolio li:eq(2)').addClass('omega');
	$('#webPortfolio li:eq(5)').addClass('omega');
	
	$('#designPortfolio li:eq(0)').addClass('alpha');
	$('#designPortfolio li:eq(3)').addClass('alpha');
	
	$('#designPortfolio li:eq(2)').addClass('omega');
	$('#designPortfolio li:eq(5)').addClass('omega');
	
	$('#motionPortfolio li:eq(0)').addClass('alpha');
	$('#motionPortfolio li:eq(3)').addClass('alpha');
	
	$('#motionPortfolio li:eq(2)').addClass('omega');
	$('#motionPortfolio li:eq(75)').addClass('omega');
//	$("#webPortfolio:nth-child(4)").hide();



//code for the work area seletor links

	$('#link-web-portfolio').addClass('active');

	$('#workAreasList a').click(function(){
    	//console.log('clicked');
    	$('#workAreasList a').removeClass('active');
    	$(this).addClass('active');
    	$('.portfolio_grid').hide();	
   	}); // END Selector
   	
   	
   	$('#link-web-portfolio').click(function(){
    	$('#webPortfolio').fadeIn('slow');
    	return false;
   	}); // END Selector
   	
   	$('#link-graphic-portfolio').click(function(){
    	$('#designPortfolio').fadeIn('slow');
    	return false;
   	}); // END Selector
   	
   	$('#link-motion-portfolio').click(function(){
    	$('#motionPortfolio').fadeIn('slow');
    	return false;
   	}); // END Selector
   	
   	
   	
   	
   	
   	//ajax load the portfolio item
    $('.portfolio_grid li a').click(function(){
    	//ajax load the page
    	hidySlidyDiv();
    	linkHref = $(this).attr('href');
    	//console.log(linkHref);
    	$('#contentArea').append('<div id="slidyDiv"></div>');
    	$('#slidyDiv').load(""+ linkHref +" #portfolioItem",
		function(){
   		$('#slidyDiv').animate({"left": "0px"},750);
   		Cufon.replace('a#visitSite');
		Cufon.replace('a#closeProject');

	 })
    				
    	return false;
    	//append the page to the frame
   	}); // END Selector
   	
   	
   	//ajax load the about me page
    $('a.aboutLink').click(function(){
    	//ajax load the page
    	$('#primaryNav a').removeClass('active');
		$('a.aboutLink').addClass('active');
    	
    	
    	
    	
    	if($('#aboutPane').length > 0){
      	}
    	else
    	{
    	
    		if($('#slidyDiv').length > 0){
					$('#slidyDiv').animate({"left": "940px"}
					,
						750
					,
						function(){
				   		$('#slidyDiv').remove();
				   		showAboutPage();
					 });
	
	
		  	}else{
		  		showAboutPage();

		  	}
    	
    		
    	}
    	
    	
    	
    	
		
		return false;
    	//append the page to the frame
   	}); // END Selector
   	
   	
   	
   	//ajax load the about me page
    $('a.homeLink').click(function(){
    	//ajax load the page
    	$('#primaryNav a').removeClass('active');
		$('a.homeLink').addClass('active');
    	
    	if($('#slidyDiv').length > 0){
    		hidySlidyDiv();
       	}
    	
    	
    	
		
		return false;
    	//append the page to the frame
   	}); // END Selector
   	
   	
   	
   	
   	
   	
   	//change "img/loading.gif" to match your loading icon
			$('#sendButton').click(function() {
			$('#contactArea').append('<img src="img/ajax-loader.gif" alt="Currently Loading" id="loading" />');
			
				var name = $('#name').val();
				var email = $('#email').val();
				var message = $('#message').val();
				
				//change the php file below as well as the POST data
				$.ajax({
					url: 'contact.php',
					type: 'POST',
					data: 'name=' + name + '&email=' + email + '&message=' + message,
					
					success: function(result) {
						$('#response').remove();
						$('#contactArea').append('<p id="response">' + result + '</p>');
						$('#loading').fadeOut(500, function() {
							$(this).remove();
						});
						
					}
				});
				
				return false;
			});
   	
   	


}); //END do when the document is ready


function hidySlidyDiv(){
		
	$('#slidyDiv').animate({"left": "940px"}
	,
		750
	,
		function(){
   		$('#slidyDiv').remove();
	 });
}

function showAboutPage(){
  
	
	
	
	$('#contentArea').append('<div id="slidyDiv" class="about" style="overflow:visible;" ></div>');
	//alert('I am in ShowAboutPage')
	$('#slidyDiv').load("index.php?id=14 #aboutPane",
		function(){
		
		//alert($('#slidyDiv').css("position"));
   		$('#slidyDiv').animate({"left": "0px"},750);
   		//$('#slidyDiv').css("left","0px");
   		//alert($('#slidyDiv').css("left"));
   		Cufon.replace('h2');
	 });
}