/*
	 all tab id should be finalised with _header
	 all content id should be finalised with _body (this id will be activated by the tab clicking on the tab)
	 e.g 
	 	tab id = new_info_header 
	 	content id = new_info_body (this id will be activated by the tab clicking on the tab) (all tab content bodies should have class - tab_item_body)
	  	as you see above both, tab id and content id should start with exactly the same string (eg new_info _header, _body)
	  	
	  	Tabs.Show activates and deactivates tabs and takes a single parameter
	  		if tab id = new_info_header
	  		tab content id will be = new_info_body
	  		parameter passed in function will be = new_info
	  		Tabs.Show("new_info")
	  
	  	Advisable Names
	  	tab id tab_item_news_header
	  	tab content id tab_item_news_body (must have class tab_item_body)
	  	pass parrameter Tabs.Show("tab_item_news")	
	  
	 */
	
	var Tabs = {};
	
	Tabs.Settings = {
		PrefixId : {
			TabHeader : '_header',
			TabBody : '_body'
		},
		CssClass : {
			TabActive : 'c_tab_selected',
			TabContentBody : 'tab_item_body'
		}
	}


	Tabs.Show = function(TabOption) {
		
		var oTabItem = $(TabOption + Tabs.Settings.PrefixId.TabHeader);
		var oTabBody = $(TabOption + Tabs.Settings.PrefixId.TabBody);

		var oTabHeaderParent = oTabItem.parentNode;
		var oTabContentParent = oTabBody.parentNode;
		
		if (oTabItem.hasClassName(Tabs.Settings.CssClass.TabActive)) {
		    return;
		}
		
		/***  Deactivate Selected Tab/Body ******/
		Element.childElements(oTabHeaderParent).each(function(oHeader){
		    if (oHeader.hasClassName(Tabs.Settings.CssClass.TabActive)) {
		        oHeader.removeClassName(Tabs.Settings.CssClass.TabActive);
		    }
		});
		
		Element.childElements(oTabContentParent).each(function(oBody){
		    if (oBody.hasClassName(Tabs.Settings.CssClass.TabContentBody)) {
		        oBody.style.display = 'none';
		    }
		});
		
		/***  Activate Selected Tab/Body ******/
		oTabItem.addClassName(Tabs.Settings.CssClass.TabActive);
		oTabBody.style.display = 'block';
		/***************************************/
			
	}
	

    var FAQTabs = {};
    
    FAQTabs.Settings = {
        PrefixId : {
            TabHeader : 'topic_tab_',
            TabBody : 'topic_content_'
        },
        CssClass : {
            TabActive : 'active',
            TabContentBody : 'topic_item'
        }
    }


    FAQTabs.Show = function(TabOption){
	
		var oTabItem = $(FAQTabs.Settings.PrefixId.TabHeader + TabOption);
		var oTabBody = $(FAQTabs.Settings.PrefixId.TabBody + TabOption);
		
		var oTabHeaderParent = oTabItem.parentNode;
		var oTabContentParent = oTabBody.parentNode;
		
		if (oTabItem.hasClassName(FAQTabs.Settings.CssClass.TabActive)) {
			return;
		}
		
		/***  Deactivate Selected Tab/Body ******/
		Element.childElements(oTabHeaderParent).each(function(oHeader){
			if (oHeader.hasClassName(FAQTabs.Settings.CssClass.TabActive)) {
				oHeader.removeClassName(FAQTabs.Settings.CssClass.TabActive);
			}
		});
		
        Element.childElements(oTabContentParent).each(function(oBody){
			if (oBody.hasClassName(FAQTabs.Settings.CssClass.TabContentBody)) {
				oBody.style.display = 'none';
			}
		});
		/**************************************/
		
		/***  Activate Selected Tab/Body ******/
		oTabItem.addClassName(FAQTabs.Settings.CssClass.TabActive);
		oTabBody.style.display = 'block';
	   /***************************************/
	}