var Slider = new Class.create
({
	num: 0,
	width: 0,
	current: 0,
	inner: null,
	duration: .5,
	timer: false,
	timer_interval: 3000,
	timerDirection: 1,
	
	parse: function()
	{
		this.num = $$('.area').length/2;
		
		if (this.num)
		{
			this.width = $$('.area').shift().getWidth();
			this.inner = $('inner');

			$$('.button').each(function(el) { el.observe('click', this.move.bind(this)); },this);
			
			this.timer = setInterval(this.autoScroll.bind(this), this.timer_interval);
		}
	},
	
	move: function(event)
	{
		(event.clientX != 0 && event.clientY != 0) && clearInterval(this.timer) && (this.timer = "");
		
		var direction = event.target.hasClassName("left") ? -1 : 1;

		((direction < 0 && this.current-direction > 0) || (direction > 0 && this.current+direction < this.num)) && (this.current += direction);
		
		Effect.Queues.get('myscope').each(function(effect) { effect.cancel(); });

		new Effect.Morph(this.inner, { style: "left: -"+(this.current*this.width*2)+'px', duration: this.duration, queue: 'front', transition: Effect.Transitions.sinoidal });
		
		if (this.current > 0) { $$('.button.left').shift().addClassName('hover'); } else { $$('.button.left').shift().removeClassName('hover'); }
		if (this.current < this.num-1) { $$('.button.right').shift().addClassName('hover'); } else { $$('.button.right').shift().removeClassName('hover'); }
	},
	
	autoScroll: function(event)
	{
		if (this.num-1 == this.current || (this.current == 0 && !this.timerDirection)) this.timerDirection = !this.timerDirection; 
		Event.simulate($$('.button.'+(this.timerDirection ? 'right' : 'left')).shift(), 'click');
	}
	
});

var slider = new Slider();
document.observe('dom:loaded', function() { slider.parse(); });