window.addEvent('domready', function ()
{
	var hints = $$('#container .item_portfolio');
	hints.each(function (el, index)
	{	
		//var innerEl		= el.getElement('span');
		var innerImg	= el.getElement('a');
		var innerEl		= new Element('span').set('text', truncate(innerImg.getProperty('title'), 33)).inject(el);
		//var newHeight	= innerEl.getSize().y;
		var newHeight	= innerEl.getStyle('bottom').toInt();
	
		innerImg.removeProperty('title');
		innerEl.fade(0.9);
		
		el.addEvents({
			'mouseout': function ()
			{
				innerEl.set('tween', {duration: 150, transition: Fx.Transitions.Expo.easeOut}).tween('bottom', newHeight);
			},
			'mouseover': function ()
			{
				innerEl.set('tween', {duration: 300, transition: Fx.Transitions.Expo.easeOut}).tween('bottom', '0');
			}
		});
	});
	
	
	/* VARIÁVEIS */
	var main				= $('container');
	var holder				= new Element('div', {'class': 'holder_portfolio'}).inject(main);
	var nextPage			= main.getElement('.next');
	var prevPage			= main.getElement('.prev');
	var nextInfo			= [nextPage.getProperty('href'), nextPage.getProperty('title')];
	var prevInfo			= [prevPage.getProperty('href'), prevPage.getProperty('title')];
	
	
	var filterHolder		= $('filter_holder');
	var viewAll				= filterHolder.getElement('.ver_todos');
	var subFilterHolder		= filterHolder.getElement('ul');
	var subFilters			= new Array;
	
	var allItensPortfolio	= main.getElements('.item_portfolio');
	var itensPortfolio		= new Array;
	var pagesPortfolio		= new Array;
	var allPageFilters		= new Array;
	var pageFilters			= new Array;
	
	var showItens			= 12;
	var showItensLines		= 3;
	var pageMax				= 0;
	var scrollSize			= main.getSize().x;
	var marginSize			= 0;
	var separadorFiltros	= ", ";
	
	var pageIndex			= 0;
	var prevIndex			= 0;
	
	/* INIT */
	createFilters ();
	
	/* MÉTODOS */
	function createPages (currentFilters /*Array*/) /* Void */
	{
		allItensPortfolio.each(function (item)
		{
			item.inject(main).setStyle('visibility', 'hidden');
		});
		holder.empty();
		pagesPortfolio.empty();
		itensPortfolio.empty();
		
		pageIndex = 0;
		
		pageFilters = (currentFilters) ? currentFilters : $A(allPageFilters);
		
		allPageFilters.each(function (filter, index)
		{
			if (pageFilters.contains(filter))
			{
				subFilters[index].addClass('active');
				if (pageFilters.length > 1)
				{
					subFilters[index].setProperty('href', '#selecionar_'+filter).setProperty('title', 'selecionar '+filter).removeClass('no_cursor');
				}
				else
				{
					subFilters[index].setProperty('href', '#').removeProperty('title').addClass('no_cursor');
				}
			}
			else
			{
				subFilters[index].removeClass('active');
				subFilters[index].setProperty('href', '#selecionar_'+filter).setProperty('title', 'selecionar '+filter).removeClass('no_cursor');
			}
		});
		
		var indexItem = 0;
		
		allItensPortfolio.each(function (el)
		{
			var elFilter		= el.getElement('input').get('class');
			var elFilters		= elFilter.toLowerCase().split(separadorFiltros);
			var isActive		= false;
			
			if (elFilter == '' || elFilter == null) isActive = true;
			else
			{
				pageFilters.each(function (current)
				{
					if (elFilters.contains(current)) isActive = true;
				});
			}
			if (isActive)
			{
				indexItem++;
				if (indexItem == showItens/showItensLines)
				{
					el.addClass('lastItem');
					indexItem = 0;
				}
				else el.removeClass('lastItem');
				
				itensPortfolio.push(el);
			}
		});
		
		pageMax = Math.ceil(itensPortfolio.length/showItens);
		
		var divPage;
		for (i = 0; i < itensPortfolio.length; i++)
		{
			if (i % showItens == 0)
			{
				divPage = new Element('div', {'class': 'pagina_portfolio'});
				holder.grab(divPage);
				pagesPortfolio.push(divPage);
			}
			itensPortfolio[i].inject(divPage).setStyle('visibility', 'visible');
		}
		if (pagesPortfolio.length > 0)
		{
			marginSize = (scrollSize - pagesPortfolio[0].getSize().x + allItensPortfolio[0].getStyle('marginRight').toInt())/2;
			positionObjects ();
		}
		navigationStatus (pageMax > 1);
	}
	
	function createFilters () /* Void */
	{
		var currentFilters	= new Array;
		allItensPortfolio.each(function (el)
		{
			var elFilter		= el.getElement('input').get('class');
			if (elFilter != '' && elFilter != null)
			{
				var elFilters		= elFilter.toLowerCase().split(separadorFiltros);
				currentFilters.combine(elFilters);
			}
		});
		currentFilters.sort();
		
		viewAll.addEvent('click', function (event)
		{
			event.stop();
			if (pageFilters.length < allPageFilters.length) createPages ();
		});
		
		currentFilters.each(function (el)
		{
			var newFilter	= new Element('li');
			var filterLink	= new Element('a', {'href': '#'}).inject(newFilter).set('text', truncate(el.capitalize(), 13));
			
			filterLink.addEvent('click', function(event)
			{
				event.stop();
				var elFilters	= [el];
				if(!this.hasClass('no_cursor')) createPages (elFilters);
			});
			
			subFilters.include(filterLink);
			newFilter.inject(subFilterHolder);
		});
		
		allPageFilters	= $A(currentFilters);
		
		createPages (currentFilters);
	}
	
	function positionObjects () /* Void */
	{
		pagesPortfolio.each(function (el, index)
		{
			if (index == 0)  el.setStyle('left', marginSize);
			else if (index == pageMax && index != 0) el.setStyle('left', -scrollSize);
			else el.setStyle('left', scrollSize*index);
		});
	}
	
	function navigationStatus (status /*Boolean*/) /* Void */
	{
		nextPage.removeEvents('click');
		prevPage.removeEvents('click');
			
		if (status)
		{
			nextPage.removeClass('desativado').setProperty('href', nextInfo[0]).setProperty('title', nextInfo[1]).fade(1);
			prevPage.removeClass('desativado').setProperty('href', prevInfo[0]).setProperty('title', prevInfo[1]).fade(1);
		}
		else
		{
			nextPage.addClass('desativado').removeProperty('title').setProperty('href', '#').fade(0);
			prevPage.addClass('desativado').removeProperty('title').setProperty('href', '#').fade(0);
		}
		nextPage.addEvent('click', function (event)
		{
			event.stop();
			if (status) movePage('next');
		});
		prevPage.addEvent('click', function (event)
		{
			event.stop();
			if (status) movePage('prev');
		});
	}
	
	function movePage (dir /*String*/) /* Void */
	{
		if (dir == 'next')
		{
			pageIndex = (pageIndex >= pageMax - 1) ? 0 : pageIndex + 1;
			prevIndex = (pageIndex <= 0) ? pageMax - 1 : pageIndex - 1;
			difIndex = 1;
		}
		else if (dir == 'prev')
		{
			pageIndex = (pageIndex <= 0) ? pageMax - 1 : pageIndex - 1;
			prevIndex = (pageIndex >= pageMax - 1) ? 0 : pageIndex + 1;
			difIndex = -1;
		}
		
		pagesPortfolio[pageIndex].setStyle('left', difIndex * scrollSize);
		pagesPortfolio[prevIndex].set('tween', {
			duration: 500,
			transition: Fx.Transitions.Expo.easeOut
		}).tween('left', -scrollSize * difIndex);
		pagesPortfolio[pageIndex].set('tween', {
			duration: 500,
			transition: Fx.Transitions.Expo.easeOut
		}).tween('left', marginSize);
	}
	
	function updateFilter (newFilter /* String */) /* Void */
	{
		if(pageFilters.contains(newFilter) && pageFilters.length > 1) pageFilters.erase(newFilter);
		else pageFilters.include(newFilter);
		
		createPages (pageFilters);
	}
	
	/* public */ function truncate (string /* String */, limit /* Number */) /* String */
	{
		var newText;	
		if(string.length > limit)
		{
			newText = string.substr(0,limit).replace(/\s+$/,"");
			newText += '...';
		}
		else newText = string;
		return newText;
	}
});