var Tabs = new Class({
				 
	Implements: [Options, Events],

	options: {	
		container : null	
	},
	
	tabs :	{},
	
	initialize: function(options){
		this.setOptions(options);
		this.options.container = $(this.options.container);
		this.wrapper = this.options.container.getElement('.wrapper');
		
		this.getTabs();
		this.addStyleElements();
		
		this.current = this.options.defaulttab;
		this.toggleTab(true);
	},
	
	addStyleElements:	function(){
	
		$each(this.tabs, function(tab, key){
			this.tabs[key]['lft'] = new Element('li', {
				'html'	:	' ',
				'class'	:	'lft'
			}).injectBefore(tab.tabEl);
			
			this.tabs[key]['rgt'] = new Element('li', {
				'html'	:	' ',
				'class'	:	'rgt'
			}).injectAfter(tab.tabEl);			
		}, this);
		
		
	},
	
	getTabs:	function(){
		$each(this.options.container.getElements('.tabs li'), function(tab){
			this.tabs[tab.get('title')] = {};
			
			this.tabs[tab.get('title')]['tabEl'] = tab;
			this.tabs[tab.get('title')]['containerEl'] = this.options.container.getElement('div.'+tab.get('title'));
			
			this.tabs[tab.get('title')]['fx'] = new Fx.Tween(this.tabs[tab.get('title')]['containerEl'], {
				'onStart'		:	function(el){
										if (el.get('opacity') == '0'){
											//el.setStyle('display',  'block');	
										}
									}.bind(this),		
				'onComplete'	:	function(el){
										console.log(el);
										//el.setStyle('display', 'none');
										//this.tabs[this.current].fx.start('opacity', '1');
									}.bind(this)
			});
			
			this.tabs[tab.get('title')]['tabEl'].addEvent('click', function(){
				this.current = tab.get('title');
				this.toggleTab(true);
			}.bind(this));
		}, this);
	},
	
	toggleTab:	function(instant){
		$each(this.tabs, function(currenttab, name){
	
			if (!instant){
				currenttab.fx.start('opacity',  name != this.current ? '0' : '1');
			} else {

				currenttab.fx.set('opacity', name != this.current ? '0' : '1');	
				currenttab.containerEl.setStyle('display', name != this.current ? 'none' : 'block');
				
				if (name == this.current){
					currenttab.lft.addClass('current');
					currenttab.rgt.addClass('current');
					currenttab.tabEl.addClass('current');
				} else {
					if (currenttab.tabEl.hasClass('current')){
						currenttab.lft.removeClass('current');
						currenttab.rgt.removeClass('current');
						currenttab.tabEl.removeClass('current');
					}				
				}
			}
		
		}.bind(this));		
	}
});