var vertSlider = new Class({
	Implements: Options,
	initialize: function(options)	{
		this.setOptions(options);
		this.options.container.set('morph', {
			duration: 1400,
			transition: Fx.Transitions.Quad.easeInOut
		});
	},
	show: function(i)	{
		if(i == -1)
			this.reset();
		else {
			this.slideTo(i);
			if(!this.started)	this.begin();
		}
	},
	begin: function()	{
		this.options.home.fade('out');
		this.started = true;
	},
	reset: function()	{
		this.options.home.fade('in');
		$$('#tabs LI').removeClass('current');
		$$('#tabs LI').removeClass('current_next');
		this.started = false;
		this.options.container.setStyle('top', this.options.height);
	},
	slideTo: function(i)	{
		$$('#tabs LI').removeClass('current');
		$$('#tabs LI').removeClass('current_next');
		this.options.tabs[i].addClass('current');
		if(this.options.tabs[(i+1)])
			this.options.tabs[(i+1)].addClass('current_next');
		var targetPos = -(i * this.options.height);
		if (this.started == true)
			this.options.container.morph({'top': targetPos});
		else{
			this.options.container.setStyles({opacity:0,top: targetPos});
			this.options.container.fade('in');
		}
	},
	started: false
});

document.addEvent('domready', function(){
	var slider = new vertSlider({
		container: $('tab_content'),
		tabs: $$('#tabs LI'),
		height: $('mask').getHeight(),
		home: $('intro_text')
	});
	$('reset').addEvent('click', function()	{
		slider.show(-1);									  
	});
	$$('#tabs A').each(function(el, i)	{
		el.addEvents({
			'click': function()	{
				slider.show(i);
				return false;
			}
		});
	});
});