if (typeof ps == 'undefined') ps= {};
if (typeof ps.ui == 'undefined') ps.ui= {};

ps.ui.TabPanel = new Class(
{

	tabs : null,
	panels : null,
	
	selected_index : 1,

    initialize: function(el)
	{
        
		// Get a list of li objects for the tabs
		var tabs = $ES('li', el);
		var panels = [];
		
		for (var i=0; i < tabs.length; i++)
		{
			
			var tab = tabs[i];
			var a = tab.getFirst()
			var href = a.href;
			var parts = href.split('#');
			var id = parts[1];
			
			if (tab.hasClass('selected')) this.selected_index = i;
			
			var panel = $(id);
			
			if (panel)
			{
				
				panels.push(panel);
				
			} else {
				
				panels.push(null);
				
			}
			
			a.onclick = this.tab_clicked;
			a._tabs = this;
			
		}
		
		this.tabs = tabs;
		this.panels = panels;
		
		this.update();
		
    },


	update : function()
	{
		
		for (var i=0; i < this.tabs.length; i++)
		{
	
			if (this.selected_index == i)
			{
				
				this.tabs[i].className = 'selected';
				if (this.panels[i] != null) this.panels[i].style.display = '';
				
			} else {
				
				this.tabs[i].className = '';
				if (this.panels[i] != null) this.panels[i].style.display = 'none';
				
			}
			
		}
		
	},
	
	tab_clicked : function()
	{
		
		var href = this.href;
		var parts = href.split('#');
		var id = parts[1];
		
		this._tabs.change_tab(id);
		
		return false;
		
	},
	
	change_tab : function(id)
	{
		
		for (var i=0; i < this.tabs.length; i++)
		{
		
			var tab = this.tabs[i];
			var a = tab.getFirst()
			var href = a.href;
			var parts = href.split('#');
			var tab_id = parts[1];
			
			if (id == tab_id) this.selected_index = i;
			
		}
		
		this.update();
		
	}

});