in_package('purplesage.ui');
purplesage.ui.Tabs = new Class({
	
	tab_panels : null,
	tabs : null,
	
	initialize : function(el)
	{
		
		var links = $ES('a', el);
		var lis = $ES('li', el);
		this.tab_panels = [];
		this.tabs = lis;
		
		for(var i=0; i < links.length; i++)
		{
			var link = links[i].href;
			var parts = link.split("#");
			var id = parts[1];
						
			//this.tab_panels.push($(id));
			this.tab_panels[i] = $(id);
			
			links[i]._tab_index = i;
			links[i]._tabs = this;
			
			links[i].onclick = function(){
				this._tabs.setTab(this._tab_index);
				this._tabs.fireEvent('change', this._tab_index);
				
				return false;
			};
		}
	},
	
	setTab : function(index)
	{
		for (var i=0; i < this.tab_panels.length; i++)
		{
			this.tabs[i].className = (index != i) ? '' : 'selected';
			if ($chk(this.tab_panels[i])) this.tab_panels[i].style.display = (index != i) ? 'none' : 'block';
		}
	}
	
});
purplesage.ui.Tabs.implement(new Events);