/*
 * This script hooks up all tab widgets on a page. The basic tabs
 * HMTL layout is:
 *
 * <div class="tabWidget">
 *    <div class="tabsWrapper">
 *       <div>
 *			<div>
 *				... [stuff for button tab 1]
 *			</div>
 *       </div>
 *		 ... [more <div> elements that will become buttons]
 *    </div>
 *    <div class="tabsContent">
 *       <div>
 *          ... [content for tab 1]
 *       </div>
 *       ... [ more <div>'s with content in ]
 *    </div>
 * </div>
 */
 
$(document).ready(tabsHookup);
		
function tabsHookup()
{
	var tabWidgets = $('.sys_tabWidget').add('.sys_largeTabWidget');
	var i = 0;
	
	while(i < tabWidgets.length)
	{
		var widget = $(tabWidgets[i]);
	
		var tabButtons = widget.children('.sys_tabsWrapper').children();
		var tabContents = widget.children('.sys_tabsContent').children();
		var b = 0;
	
		while(b < tabButtons.length)
		{
			var button = $(tabButtons[b]);
			
			button.bind("click", {buttons: tabButtons, contents: tabContents, index: b}, activateTab);
			button.css('cursor', 'pointer');
		
			b++;
		}
		
		loopTabs(tabButtons, tabContents, 0);
	
		i = i + 1;
	}
};

function loopTabs(buttons, contents, index)
{
	var i = 0;
	
	while(i < buttons.length)
	{
		// Button class switching
		var buttonDiv = $(buttons[i]);
		var innerDiv = buttonDiv.children('div');
		
		// Remove all existing classes.
		buttonDiv.removeClass('sys_leftactive');
		innerDiv.removeClass('sys_rightactive');
		buttonDiv.removeClass('sys_leftInactive');
		innerDiv.removeClass('sys_rightInactive');
		
		buttonDiv.removeClass('sys_leftactivefirst');
		buttonDiv.removeClass('sys_leftInactivefirst');
		buttonDiv.removeClass('sys_leftactivelast');
		buttonDiv.removeClass('sys_leftInactivelast');
		
		if(i == index)
		{
			buttonDiv.addClass('sys_leftactive');
			
			if(i == 0)
			{
				buttonDiv.addClass('sys_leftactivefirst');
			}
			
			if(i == buttons.length - 1)
			{
				buttonDiv.addClass('sys_leftactivelast');
			}
			
			innerDiv.addClass('sys_rightactive');
		}
		else
		{
			buttonDiv.addClass('sys_leftInactive');
			innerDiv.addClass('sys_rightInactive');
			
			if(i == 0)
			{
				buttonDiv.addClass('sys_leftInactivefirst');
			}
			
			if(i == buttons.length - 1)
			{
				buttonDiv.addClass('sys_leftInactivelast');
			}
		}
		
		// Content switching
		var content = $(contents[i]);
		
		if(i == index)
		{
			content.css('display', '');
		}
		else
		{
			content.css('display', 'none');
		}
		
		i = i + 1;
	}
};

function activateTab(e)
{
	loopTabs(e.data.buttons, e.data.contents, e.data.index);
};