///////////////////////////////////////////////////////////
// Class Tabs
///////////////////////////////////////////////////////////


var Tabs = Class.create({
	
	///////////////////////////////////////////////////////////
	// initialize
	///////////////////////////////////////////////////////////
	
	initialize:function(parent, element){
	    
	    this.parent = parent;
	    this.element = element;
	    
		this.init();
	},
	
	///////////////////////////////////////////////////////////
	// Tabcontent
	///////////////////////////////////////////////////////////

	init:function(){
	    this.showTab(this.element.down('.active').down('a'));
	    $$('#'+ this.element.identify() +' li a').invoke('observe', 'click', this.onTabClick.bind(this));
	},
	
	
	///////////////////////////////////////////////////////////
	// onTabClick
	///////////////////////////////////////////////////////////
	
	onTabClick:function(e){
	    Event.stop(e);

		// get the link element
		var el = Event.element(e);
		if(el.nodeName.toLowerCase() != 'a'){
			el = el.up('a');
		}

		this.showTab(el);
	},
	
	
	///////////////////////////////////////////////////////////
	// showTab
	///////////////////////////////////////////////////////////
    
	showTab:function(el){
	    
	    var href = el.readAttribute('href').substr(1);
	    
	    // hide all other tabs
		this.hideAll();

		// add active class
		el.up('li').addClassName('active');
		
		if(href){
			$(href).show();
			if($(href) === $('mapview')){
				this.parent.updateMap();
			}
		}
	},
	
	
	///////////////////////////////////////////////////////////
	// hide all
	///////////////////////////////////////////////////////////

	hideAll:function(){
		$$('#'+ this.element.identify() +' li').each(function(li){
			if(li.hasClassName('active')) li.removeClassName('active');
			li.childElements().each(function(link){
				href = link.readAttribute('href').substr(1);
				$(href).hide();
			}.bind(this));
		}.bind(this));
	}
});