var mootabs = new Class({
	
	initialize: function(element, options) {
		this.options = Object.extend({
			changeTransition:	Fx.Transitions.bounceOut
		}, options || {});
		
		this.el = $(element);
		this.id = element;
		this.tabPanels = $$('#' + this.id + ' ul.mootabs_title');
		this.tabPanel = this.tabPanels[0];
		this.container = 'profileCont';
		this.history = 'tab0';
		
		this.el.setStyle('width', this.options.width + 'px');
		
		/*$$('#' + this.id + ' div.mootabs_panel').each(function(panel) {
			panel.setStyles({
				height: this.options.height + 'px',
				width: this.options.width + 'px'
			});
		}.bind(this));*/
		
		this.tabs = $$('#' + this.id + ' ul li a');
		
		
		this.tabs.each(function(tab) {
			tab.addEvent('click', function() {
				this.activate(tab);
			}.bind(this));
		}.bind(this));
		$$('#' + this.id + ' ul.mootabs_title').getFirst().addClass('active');
		//$$('#' + this.id + ' div.mootabs_panel').getFirst().addClass('active');
	},
	
	activate: function(tab) {
		//alert(123); return false;
		var linkName = tab.getProperty('href').split('#')[1];
		this.tab_id = tab.getProperty('href').split('#tab')[1];
		
		this.tabs.each(function(tab) {
			tab.removeClass('active');
		});
		tab.addClass('active');
		
		if (linkName != this.history)
			this._getContent();
			
		this.history = linkName;
			},
	
	_getContent: function(){
		$("profileCont").set("html","<div class=\"progress\"><span>Загрузка...</span></div>");
		new Request.HTML({
            url: '/ajax.php',
            update: 'profileCont'
        }).post({
        	action: 'load_tab_content',
            tab: this.tab_id
        });
	},
	
	setActive: function(tabAnchor) {
		this.tabToActivate = tabAnchor;
		$$('#' + this.id + ' ul.mootabs_title').getChildren()[0].each(function(tabLi) {
			if(tabLi.getFirst().getProperty('href') == '#' + this.tabToActivate)
			{
				this.activate(tabLi.getFirst());
			}
		}.bind(this));
	}
	
});
