var SliderManager = {
	'viewports' : {},

	'init' : function()
	{
		$$('.slider a.less').invoke('observe', 'click', SliderManager.less).invoke('hide');
		$$('.slider a.more').invoke('observe', 'click', SliderManager.more);
	},
	
	'less' : function(e)
	{
		var viewport = this.up('.slider').down('.viewport');
		
		viewport.scrollLeft -= SliderManager.viewports[viewport];

		if(viewport.scrollLeft == 0)
		{
			this.hide();
		}
		
		this.up('.lessMore').down('.more').show();
	},
	
	'more' : function(e)
	{
		var viewport = this.up('.slider').down('.viewport');
		
		if(!SliderManager.viewports[viewport])
		{
			viewport.descendants('li').each(function(el)
			{
				if(el.offsetLeft > viewport.scrollLeft + viewport.offsetWidth)
				{
					SliderManager.viewports[viewport] = el.offsetLeft - viewport.down('li').offsetLeft;
					throw $break;
				}
			});
		}
		
		viewport.scrollLeft += SliderManager.viewports[viewport];

		if(viewport.scrollLeft >= (viewport.scrollWidth - viewport.getWidth()))
		{
			this.hide();
		}

		this.up('.lessMore').down('.less').show();
	}
};

$(document).observe('dom:loaded', SliderManager.init);