var Slider = new Class({
	Implements: Options
	
	,options: {
		height: 200
		,el: false
		,up: false
		,down: false
	}
	,top: 0
	,maxTop: false
	,busy: false
	
	,initialize: function(options)
	{
		// Options
		this.setOptions(options);
		
		// Check for height
		if(this.options.el.getParent().getStyle('height').replace('px', '') < this.options.el.getStyle('height').replace('px', ''))
		{
			// Not high enough
			this.options.down.fade(1);
			//return;
		}
		
		// Add events to buttons
		this.options.up.addEvent('click', this.up.bind(this));
		this.options.down.addEvent('click', this.down.bind(this));
		
		// Get current top
		this.top = this.options.el.getStyle('margin-top').replace('px', '');
		
		// Calculate max top
		this.maxTop = this.options.el.getStyle('height').replace('px', '')*(-1);
		
		// Create FX
		this.fx = new Fx.Tween(this.options.el);
	}
	,up: function(e) {	
		var e = new Event(e);
		e.stop();
		if(!this.busy)
		{
			var newTop = (this.top + this.options.height);
			
			if(newTop <= 0)
			{
				this.options.down.fade(1);
				this.busy = true;
				this.animate(this.top, newTop);
				this.top = newTop;
			}
			if((newTop + this.options.height) > 0) this.options.up.fade(0);
		}
	}
	,down: function(e) {
		var e = new Event(e);
		e.stop();
		if(!this.busy)
		{
			var newTop = (this.top - this.options.height);
			if(newTop > (this.maxTop)+this.options.height)
			{
				this.options.up.fade(1);
				this.busy = true;
				this.animate(this.top, newTop);
				this.top = newTop;
			}
			if((newTop - this.options.height) < (this.maxTop)+this.options.height) this.options.down.fade(0);
		}
	}
	,animate: function(from, to)
	{
		this.fx.start('margin-top', from, to);
		this.fx.addEvent('complete', function() {
			this.busy = false;
		}.bind(this));
	}
});
window.addEvent('load', function(){
	new Slider({
		el: $$('ul.brands_list')[0]
		,up: $('up')
		,down: $('down')
	});
});