//nemTab.js
//2008 Paul Graves paul.graves@nemisys.uk.com
//Nemisys tabs with ajax request feature.
      
var nemTabs = new Class({
    initialize: function(el){
        this.nemTabs = el;
        this.tabs = new Array();
        this.tabHandles = new Array();
        this.currentTab=0;
        
        this.tabBar = new Element("DIV",{'class':'nemTabBar'});
        this.tabList = new Element("DIV",{'class':'nemTabList'});
        this.tabList.setStyle('width',0);
        this.nemTabs.grab(this.tabBar,'top');
        this.tabBar.grab(this.tabList,'top');
        
        this.nemTabs.getElements('.nemTab').each((function(el){
                                                                this.tabs.push(new nemTab(el,this.tabs.length));  
                                                               }).bind(this));
        //get the width of the tablist
        var tabsWidth=0;                                                       
        this.tabList.getElements('.nemTabHandle').each((function(el){tabsWidth+=el.getSize().x+el.getStyle('margin-right').toInt()+el.getStyle('margin-left').toInt();}).bind(this))
        this.tabList.setStyle('width',tabsWidth+100);                                                       
                     
        //build the scroller element if the tabs overlap the width             
        if(this.tabList.getStyle('width').toInt()-60>this.tabBar.getStyle('width').toInt()){   
            this.scrollFx = new Fx.Scroll(this.tabBar);                                            
            this.scrollRight = new Element("SPAN",{'html':' ','class':'nemScrollRight','events':{'click':(function(){
                                                                                              this.scrollFx.start(this.tabBar.getScroll().x+50,0);
                                                                                             }).bind(this)}});    
            this.scrollRight.inject(this.tabBar,'after');          
            this.scrollLeft = new Element("SPAN",{'html':' ','class':'nemScrollLeft','events':{'click':(function(){
                                                                                              this.scrollFx.start(this.tabBar.getScroll().x-50,0);
                                                                                             }).bind(this)}});    
            this.scrollLeft.inject(this.tabBar,'before'); 
            this.tabBar.setStyle('width',this.tabBar.getStyle('width').toInt()-this.scrollLeft.getStyle('width').toInt()-this.scrollRight.getStyle('width').toInt());
             
        }                                                                                             
    }
});

//nemTab class
var nemTab = new Class({
	initialize: function(el, id) {
		this.tab = el;
		this.parent = this.tab.getParent(".nemTabs");
		this.tabList = this.parent.getFirst(".nemTabBar").getFirst(".nemTabList");
		this.id = id;
		
		this.content = this.tab.getFirst(".nemTabContent");
		this.handle = new Element("SPAN", { 'class': 'nemTabHandle', 'html': el.title, 'events': { 'click': (function() { this.handleClicked(); }).bind(this)} });

		var handleHTML = this.handle.innerHTML;
		this.handle.innerHTML = "";

		this.handle.grab(new Element("SPAN", { 'class': 'nemTabHandleStart', 'html': ' ' }), 'bottom'); //handle start  
		this.handle.grab(new Element("SPAN", { 'class': 'nemTabHandleMid', 'html': handleHTML }), 'bottom'); //handle middle    
		this.handle.grab(new Element("SPAN", { 'class': 'nemTabHandleEnd', 'html': ' ' }), 'bottom'); //handle end


		this.tabList.grab(this.handle, 'bottom');

		//this tab is not set to visible
		if (this.tab.getProperty('visible') != 'true') {
			this.content.hide();
		} else {
			this.handle.addClass('nemTabActive');
			this.getContent();
			currentTab = this.id;
		}
	},
	handleClicked: function() {
		this.hideOtherTabs();
		this.content.show();
		this.handle.addClass('nemTabActive');
		this.getContent();
	},
	hideOtherTabs: function() {
		currentTab = this.id;
		//hide all other tabs that are siblings of this tab
		this.parent.getElements('.nemTab').each(function(item, index) { item.getFirst(".nemTabContent").hide(); });
		this.parent.getElements('.nemTabHandle').each(function(item, index) { item.removeClass('nemTabActive'); });

	},
	getContent: function() {
		if (this.content.getProperty('location')) {
			var updateRequest = new Request({ method: 'post', async: true, url: this.content.getProperty('location'), onSuccess: (function(txt) { this.content.set('html', txt); this.content.focus(); }).bind(this) });
			updateRequest.send("date=" + Date());
			this.content.removeProperty('location');
		}
	}
});