var current_slide = 0;
$('#arrow_left').live('click', function(){
		slide_portfolio('left')					
})

$('#arrow_right').live('click', function(){
		slide_portfolio('right')				
})

$('.pf_item').live('mouseenter', function(){
	$(this).find('.img').stop().animate({'opacity':'0.5'},150, "swing")
})

$('.pf_item').live('mouseleave', function(){
	$(this).find('.img').stop().animate({'opacity':'1'},150, "swing")
})

$('.pf_item').live('click', function(){
	var id = $(this).attr('id');
	show_detail(id)
});

function slide_portfolio(dir)
{
	var tot = $('.pf_item').length;
	var slides = Math.ceil(tot /3);
	if(dir == 'left')
	{
		if(current_slide != 0 && slides >! 1)
		{
			$('#slider').animate({'margin-left':'+=633px'}, 400, "swing")
			current_slide--;
		}
	}
	if(dir == 'right')
	{
		if(current_slide != slides-1 && slides >! 1)
		{
			$('#slider').animate({'margin-left':'-=633px'}, 400, "swing")
			current_slide++;
		}
	}
	
	if(current_slide == 0)
	{
		$('#arrow_left').css('opacity','0')
		$('#arrow_right').css('opacity','1')	
	}
	else
	{
		$('#arrow_left').css('opacity','1')
		$('#arrow_right').css('opacity','1')
	}
	if(current_slide == slides-1)
	{
		$('#arrow_right').css('opacity','0')
		$('#arrow_left').css('opacity','1')
	}
	
	
}

function show_detail(id)
{
	$('#pf_container').animate({'margin-left':'-=30px'}, 250, "swing")
	$('#pf_container').animate({'margin-left':'1000px'}, 300, "swing", function(){
		$('#content').css('margin-top','30px')																	
		$.ajax({
			url: 'pages/portfolio_item.php?id='+ id +'',
			data: 'data',
			success: function(data) {
				$('#content').append('<div id="detail"><div id="detail_content"></div></div>')
				$('#detail_content').html(data)
				$('#detail_content').css({'opacity':'1'})
				$('#detail').css({'display':'block', 'height':'1px', 'width':'1px'})
				$('#detail').animate({'width':'870px', 'height':'412px'}, 500)
				$('#detail_content').animate({'opacity':'1'}, 1000)
			}
		});
		
	})
}

function hide_detail()
{
	$('#detail').animate({'width':'1px', 'height':'1px'}, 500, function(){
		$('#detail').remove();
		$('#pf_container').animate({'margin-left':'89px'}, 300, "swing");
	})
}

$('#detail').live('click', function(){
	//hide_detail()
})