// javascript functions go here

window.addEvent('domready', function(){

	var tabContainer = $$('.tab-container');
		
	tabContainer.each(function(container, i){

		var tabs = container.getElements('.tab');
		var tabContents = container.getElements('.tab-content')
		
		var tabsDIV  = new Element('div', {'class': 'tabs'});
		var tabUL = new Element('ul');

		var tabsList = tabsDIV.grab(tabUL);
		container.grab(tabsList,'top');
		
		var activeTabNumber = -1;
		
		tabs.each(function(tab, k){
			var tabA;
			if(tab.get('tag') != 'a'){ // New highlight tab element in Contensis uses a <div> rather <a> for the tab name
				tabA = new Element('a', { // Needs to be converted to an <a>
					'id': 'tab-' + i + '-' + k,
					'class': tab.className,
					'href': '#'
					});
				tabA.innerHTML = tab.innerHTML;
				tab.dispose();
			} else {
				tabA = tab;
				tabA.set('id','tab-' + i + '-' + k);
			}
			var tabLI = new Element('li');
			tabLI = tabLI.grab(tabA);
			tabUL.grab(tabLI);
            tabA.set('style','display:inline-block;*display:inline;');
			
			var tabNumber = tabA.id.split('-');
			var contentID = 'tab-content-' + i + '-' + k;
			
			if (tabA.hasClass('active')){
				tabLI.addClass('active');
				activeTabNumber = tabNumber[2];
				}
			if (tabA.hasClass('highlight')){
				tabLI.addClass('highlight');
				}
			
			if (tabA.href.indexOf('#') != -1){
			
				tabs = container.getElements('.tab'); // Get tabs again as some may have been disposed of
				
				tabA.addEvent('click', function(){
					toggleTabs(tabs, contentID, this);
					return false;
					});
			}
			
		});
        
        container.getElement('.tabs').setStyle('display','block');
		
		tabContents.each(function(tabContent, j){	
			var contentID = 'tab-content-' + i + '-' + j;
			tabContent.set('id',contentID);
			if(tabContent.hasClass('highlight')){
				tabContent.addClass('highlight');
			}
			tabContent.getElements('a').each(function(a){
				if(a.hash.indexOf('#tb') != -1){
					var targetContentID = 'tab-content-' + i + '-';
					var targetTabID = 'tab-' + i + '-';
					var num = a.hash.substring(3) - 1;
					if(num <= tabs.length - 1){
						var targetTab = $(targetTabID + (num));
						a.addEvent('click', function(e){
							return toggleTabs(tabs, targetContentID + (num), targetTab);
						});
					}
				}
			});

		});
		
		function toggleTabs(tabs, contentID, tab){
		
			var content = $(contentID);
			
			tabContents.each(function(tabContent, i){
				tabContent.setStyle('display', 'none');
				});
			tabs.each(function(tab, i){
				tab.getParent('li').removeClass('active');
				tab.getParent('li').removeClass('highlight-active');
				});
			tab.getParent('li').addClass('active')
			if(tab.hasClass('highlight')){
				tab.getParent('li').getParent('ul').addClass('highlight')
				tab.getParent('li').addClass('highlight-active')
			} else {
				tab.getParent('li').getParent('ul').removeClass('highlight')
				tabs.each(function(tab, i){
					tab.getParent('li').removeClass('highlight-active');
					});
			}
			if(content){
				content.setStyle('display','block');
			}
			return false;
			
		}
		
		if (activeTabNumber == -1){
			tabContents.each(function(tabContent){	
				tabContent.setStyle('display', 'none');
			});
		    firstTab = $('tab-' + i + '-0');
		    firstTab.getParent('li').addClass('active');
		    if(firstTab.hasClass('highlight')){
			    firstTab.getParent('li').getParent('ul').addClass('highlight')
			    tabs = container.getElements('.tab');
			    /*tabs.each(function(tab, i){
				    tab.getParent('li').addClass('highlight-active');
				    });*/
			    firstTab.getParent('li').addClass('highlight-active')
		    }
		    firstContent = $('tab-content-' + i + '-0');
		    firstContent.setStyle('display','block');
		} else {
			tabContents.each(function(tabContent){	
				tabContent.setStyle('display', 'none');
			});
			firstContent = $('tab-content-' + i + '-' + activeTabNumber);
			firstContent.setStyle('display','block');
		}
		
	});

});

