/**
 * This is the portfolio category selector. By defined portfolio categories when clicking
 * on a specified category, shows only the items that belong to this category. Also sets the
 * info that is shown when hovering a portfolio item.
 * 
 * Author: Pexeto
 * http://pexeto.com/
 */


var portfolioSetter={
	imgWidth:260,
	imgHeight:180,
	imgArray:new Array(),
	imgNumber:0,
	
	/**
	 * Inits the portfolio setter. Calls the main functions for setting category selectors and
	 * portfolio items info.
	 */
	init:function(){
		this.getAllDivs();
		if(this.imgNumber>0){
			//this.setSelector();
			this.setInfo('.portfolio_item_top');
		}
		this.setMainPortfolioHover();
	//	$("#portfolio_categories li:first").addClass('selected');
	},
	
	/**
	 *	Gets all the divs that have to be shown in the slider and fills them in an array.
	 */
	getAllDivs: function(){
		//fill the divs in an array
		$("#portfolio_gallery img").each(function(i){
			portfolioSetter.imgArray[i]=$(this);
			portfolioSetter.imgNumber++;
			
			//add the shadow to the image
			 $('<div class="portfolio_shadow"></div>').insertAfter($(this));
		});
		
		$('.portfolio_item_top').show().animate({opacity:0},0);
		$('.portfolio_item_top a').hide();
		$('a.portfolio_info').hide();

	},
	
	/**
	 * Sets the category selector. When a category has been selected, only the images from
	 * this category are shown.
	 */
	setSelector: function(){
		$("#portfolio_categories a").click(function(event){	
			
			event.preventDefault();
			var rel=$(this).attr("class");
			portfolioSetter.setSelected($(this).parent().parent('li'));

			for(var i=0; i<portfolioSetter.imgNumber; i++){
				var img=portfolioSetter.imgArray[i];
				if(rel=="all"){
					img.parent("div").css({display:"block"});
				}else{
					img.parent("div").css({display:"none"});
					$("#portfolio_gallery img."+rel).parent("div").css({display:"block"});
				}
			}
		});
	},
	
	/**
	 * Sets a category to be selected- makes the title bold.
	 */
	setSelected: function(li){
		$("#portfolio_categories li").each(function(){
			$(this).removeClass('selected');
		});
		
		li.addClass('selected');
	},

	/**
	 * Sets the info for the item when it is hovered.
	 */
	setInfo: function($selector){		
		$($selector).each(function(){
			
			$(this).hover(function(){
				$(this).stop().animate({opacity:0.7});
				$(this).find('a').animate({opacity:0.9}).show();
			},function(){
				$(this).stop().animate({opacity:0});
				$(this).find('a').hide();
			});
		
		});
	},
	
	setMainPortfolioHover:function(){
		$('.portfolio_item_top2').show().animate({opacity:0},0);
		$('.portfolio_item_top2 a').hide();
		this.setInfo('.portfolio_item_top2');
	}
		
};