/**************************************
 *	Create Filters
 **************************************/
window.addEvent('domready', function(){
	$$('div.filter').each(function(filter){
		var filter = new Filter({
			filter:		filter,
			items:		filter.getElements('a.filterItem')			
		});	
	})
});


/**************************************
 *	Filter
 **************************************/
Filter = new Class({
	
	options:	{
		filter:			false,
		items:			false,		
		transition:		Fx.Transitions.Linear,
		duration:		2000
	},
	
	currentFilterLink: 	false,
	
	/**
	 *	Initialize
	 */
	initialize: function(options){
		
		// Fetch options
		this.setOptions(options);			
		
		if(!this.options.filter) return false;			
		
		this.fillOut();
		
		var currentFilterLink = false;
		
		var options = this.options;		
		options.items.each(function(lnk, index){
			options.filter.getElement('div.'+lnk.rel).addClass('filterHide');
			var parent = lnk.getParent();;
			if(parent.tagName.toLowerCase() != 'li')
				parent = parent.getParent();	
			if(parent.hasClass('active'))			
				currentFilterLink = lnk.rel;
		});
		
		this.currentFilterLink = currentFilterLink;
		
		options.filter.getElement('div.'+currentFilterLink).removeClass('filterHide');			
		
		// Add handlers
		this.addHandlers();
	},
	
	/**
	 *	Add eventhandlers
	 */
	addHandlers: function(){
		
		// Disable following of link
		this.options.items.onclick = function(){ return false; }
		
		this.options.items.each(function(link,index) {
			link.onclick = function(){ return false; }
			link.addEvent('click', this.showFilter.bind(this));
		}.bind(this));
	},
	
	/**
	 *	show filter
	 */
	showFilter: function(button){
		
		//hide current
		var currentFilter = this.options.filter.getElement('div.'+this.currentFilterLink);
		//currentFilter.setStyle('opacity', 1);
		//currentFilter.fade('out');		
		
		//show new
		var filterLink = button.target.rel;
		if (filterLink) {
			
			//hide old
			currentFilter.addClass('filterHide');
			var parentLi = this.options.filter.getElement('a.'+this.currentFilterLink).getParent();
			if(parentLi.tagName.toLowerCase() != 'li')
				parentLi = parentLi.getParent();
				
			parentLi.removeClass('active');
			
			
			var newFilter = this.options.filter.getElement('div.'+filterLink)		
			//newFilter.setStyle('opacity', 0);
			newFilter.removeClass('filterHide');
			//newFilter.fade('in');
			var buttonLi = button.target.getParent();
			if(buttonLi.tagName.toLowerCase() != 'li')
				buttonLi = buttonLi.getParent();
			
			buttonLi.addClass('active');
			
			this.currentFilterLink = filterLink;
		}
	},
	
	fillOut : function()
	{
		if(!this.options.filter.getElement('div.list').getElement('div.slider_content'))
			return false;
		
		var total = this.options.filter.getElement('div.list').getElements('ul').length;		
		var ULs = this.options.filter.getElement('div.list').getElements('ul');
		var ulLength = ULs.length;
		var container = ULs.getParent()[0];
		var mod = (total%parseInt(container.lang));
		var need = 0;
		if (mod > 0)
			need = parseInt(container.lang)-mod;			
		
		ULs.each(function(ul, index){
			var LIs = ul.getElements('li');
			var liLength = LIs.length;
			while(liLength < 3)
			{
				var spaceLi = new Element('li', {
					'html': '<a href="#">&nbsp</a>'
				})
				spaceLi.injectInside(ul);
				liLength++;
			}			
		});
		
		var ul = new Element('ul');
		var li = new Element('li', {
			'html': '<a style="cursor:default">&nbsp</a>'
		});
		li.injectInside(ul);
		li.clone().injectInside(ul);
		li.clone().injectInside(ul);
		
		for (var i = 0; i < need; i++) {		
			ul.clone().injectInside(container);
			ulLength++;
		}
		
		var listItem = 	ULs[0];	
		var itemWidth = listItem.getSize().x + parseInt(listItem.getStyle('margin-left')) + parseInt(listItem.getStyle('margin-right'));		
		var containerWidth = ulLength * itemWidth;
		container.setStyle('width', containerWidth);
	}
	
});
Filter.implement(new Options);