// JavaScript Document
var targetElementSelectorString ;
var $pane;
var $scroll=179;//box width + margin (left or right)
var $scrollCtr=0;
var $scrollElement=6;
var $prevCategory;
var $noCols=0;
var $cols=5;
function gallery()
{
	lastBlock = $("#a1");
    maxWidth = 210;
    minWidth = 60;	

	//on click Category Links for animation effect
    $("#categories li a").click(
      function(){
        $(lastBlock).animate({width: minWidth+"px"}, { queue:false, duration:400 });
	$(this).animate({width: maxWidth+"px"}, { queue:false, duration:400});
	lastBlock = this;
      }
    );

	$('#previous').hide(); 	
	var prevClick="";
	$pane = $('#portfolioGallery');
//				$pane.jScrollPane({animateTo:true});
				
				//Binding category links to open the respective gallery
				$('#categories li a').bind(
					'click',
					function()
					{	
						if(prevClick!=""&&$scrollCtr>0)
							$('#portfolioGallery').scrollTo(prevClick,500);	
						
						targetElementSelectorString = $(this).attr('rel');
						prevClick=targetElementSelectorString;
						
						$scrollCtr=0;
						$noCols = $(targetElementSelectorString).children().size();
						
						//dynamically set the width of the project list
						/*$('.project_list').width($noCols*$scroll);*/
						
						//$('#previous').fadeOut();
						if($noCols>$cols)
						{
							$('#next').fadeIn(600);
						}
						else
						{							 
							$('#next').fadeOut(600);
						}
						$('#previous').hide();
						$('#portfolioGallery').scrollTo(targetElementSelectorString, 800 );	
						//Large image gallery on clicking thumbnails						
						
												
						$(targetElementSelectorString+" a").prettyPhoto({theme:'dark_rounded', opacity:0.8});
						return false;
					}
				);
			$("#a1").click();	
			
	var $scrollNo=4;//no. of col to scroll
	var $availNo=0;
	var $no=0;
	var $s=[];
	var i=0;
	//Binding next button
	$('#next').bind(
	'click',function(){
	if($noCols>$cols&&$scrollCtr<$noCols-$cols)
	{		
		$availNo=$noCols-($scrollCtr+$cols);
		if($availNo>=$scrollNo)
			$no=$scrollNo;
		else
			$no=$availNo;
			
		$s[i]=$no;
		i++;
		$pane.scrollTo({top:'-=0px',left:'+='+$scroll*$no+'px'},1200);
		$scrollCtr+=$no;
		$prevCategory=targetElementSelectorString;
		$('#previous').fadeIn(600);
	}
	
	if($scrollCtr==$noCols-$cols)
		$(this).fadeOut(600);
	}).css({'color':'#FFF','cursor':'pointer'});
	
	//Binding next button
	$('#previous').bind(
	'click',function(){
		
		
		if($scrollCtr>0&&$prevCategory==targetElementSelectorString)
		{i--;
			$no=$s[i];
			
			$pane.scrollTo({top:'-=0px',left:'-='+$scroll*$no+'px'}, 1200);
			$scrollCtr-=$no;	
		}
		if($scrollCtr==0)
			$(this).fadeOut(600);
			
		if($scrollCtr<$noCols-($cols-1))
			$('#next').fadeIn(600);
			
	}).css({'color':'#FFF','cursor':'pointer'});
	
	$('.projects-box img').hover(function()
	{
		var mWd=$(this).width();
        $(this).animate({opacity:0.3},{duration:600}).animate({opacity:1},{duration:700});
	});
		
/*============= Slider=============*/
	/*$("#content-slider").slider({
    animate: true,
    change: handleSliderChange,
    slide: handleSliderSlide
	});
	
function handleSliderChange(e, ui)
{
  var maxScroll = $("#portfolioGallery").attr("scrollWidth") -
                  $("#portfolioGallery").width();
  $("#portfolioGallery").animate({scrollLeft: ui.value *
     (maxScroll / 100) }, 1000);
}

function handleSliderSlide(e, ui)
{
  var maxScroll = $("#portfolioGallery").attr("scrollWidth") -
                  $("#portfolioGallery").width();
  $("#portfolioGallery").attr({scrollLeft: ui.value * (maxScroll / 100) });
}*/
/*============= End Slider==========*/

}