var currTab=null; // Panels and tabs are not available until function is called.
var currPanel=null;
var currThumbPanel=null;

var nextTab=null;
var nextPanel=null;
var nextThumbPanel=null;

var fullImg=null;
var thumbImg=null;
var tabName="";

var benefitItem="";
var benefitItemId="";
var benefitItemArrow="";

function initTabs()
{
	currTab = $('benefitsTab');
	currPanel = $('benefitsPanel');
	currThumbPanel = $('benefitsThumbs');
	
	// Show the current panel and hide the other panels.
	currPanel.show();
	$('featuresPanel').hide();
	$('requirementsPanel').hide();
	$('specificationsPanel').hide();

	// Show the current thumb panel and hide the other thumb panels.
	currThumbPanel.show();
	$('featuresThumbs').hide();
	$('requirementsThumbs').hide();
	$('specificationsThumbs').hide();
	
	// Hide all of the lists in the Benefits panel.
	$('pdList1').hide();
	$('pdList2').hide();
	$('pdList3').hide();
	
	// Hide the Flash movie.
	$('flashImg').hide();
}

function onClickTabHandler(event)
{
	$('flashImg').hide();
	showOrHideLeftColumn();
	
	// Make the selected tab the next tab and its panel the next panel 
	// and set the image in the full image panel to the first full image
	// associated with the tab panel.
	nextTab = Event.element(event);		
	if(nextTab.type == undefined || nextTab == currTab) 
	{
		return;
	}
	
	// Use the event to get the id of the clicked element. Use the clicked element's id
	// to find out which tab was selected. Use the selected tab's index to get the index 
	// of the associated panel.
	var tabsToCheck = $('tabbedPanels').childNodes[1].childNodes[1];
	if(tabsToCheck == undefined || tabsToCheck.tagName != "UL")
	{
		tabsToCheck = $('tabSet').childNodes[0];
	
		// childNodes in IE hides text element for node.				
		for( var i=0; i<tabsToCheck.childNodes.length; i++ )
		{
			if(tabsToCheck.childNodes[i].id != undefined && nextTab.id == tabsToCheck.childNodes[i].id)
			{
				// The panel's index is one more than the tab's index.
				nextPanel = $('tabbedPanels').childNodes[i+1];
				
				// The thumb panel's index is the tab's index.
				nextThumbPanel = $('thumbPanels').childNodes[i];
				break;
			}
		}
	}
	else
	{
		for( var i=0; i<tabsToCheck.childNodes.length; i++ )
		{
			if(tabsToCheck.childNodes[i].id != undefined && nextTab.id == tabsToCheck.childNodes[i].id)
			{
				// The panel's index is one more than the tab's index plus one to skip the text element.
				nextPanel = $('tabbedPanels').childNodes[i+2];
				
				// The thumb panel's index is the tab's index.
				nextThumbPanel = $('thumbPanels').childNodes[i];
				break;
			}
		}
	}

	// Select the tab and show the tabbed panel. IE recognizes className, not class.
	nextTab.setAttribute('class','current');
	nextTab.setAttribute('className','current');
	Element.show(nextPanel);
	Element.show(nextThumbPanel);
	
	// Deselect the old tab and hide the old panel and old thumb panel. IE recognizes className, not class.
	currTab.setAttribute('class','notcurrent');
	currTab.setAttribute('className','notcurrent');
	Element.hide(currPanel);
	Element.hide(currThumbPanel);
	
	// Set the new current tab, panel and thumb panel.
	currTab = nextTab;
	currPanel = nextPanel;
	currThumbPanel = nextThumbPanel;
	
	// Set the image in the full image panel to the first full image for the tab panel. 
	fullImg = $('productImg');
	var thumbPath = "";
	if( currThumbPanel.childNodes.length < 2 )
	{
		// childNodes in IE hides text element for node.
		thumbPath = currThumbPanel.childNodes[0].childNodes[0].childNodes[0].src;
		
		// Replace "thumb" with "full" in thumb's path and assign new path to full image's src.
		fullImg.childNodes[0].src = thumbPath.gsub("thumb","full");
	}
	else
	{
		thumbPath = currThumbPanel.childNodes[1].childNodes[1].childNodes[0].src;
		
		// Replace "thumb" with "full" in thumb's path and assign new path to full image's src.
		fullImg.childNodes[1].src = thumbPath.gsub("thumb","full");
	}
}
	
function onClickThumbHandler(event)
{
	// When a thumbnail is clicked, show the associated full image.
	fullImg = $('productImg');
	thumbImg = Event.element(event);
	var fullImgChild = "";
	if(fullImg.childNodes.length < 3)
	{
		// childNodes in IE hides text element for node.
		fullImgChild = fullImg.childNodes[0];
		fullImg.childNodes[0].src = thumbImg.src.gsub("thumb","full");
	}
	else
	{
		fullImgChild = fullImg.childNodes[1];
		fullImg.childNodes[1].src = thumbImg.src.gsub("thumb","full");
	}
}
		
function onClickBenefitsHandler(event)
{
	benefitItem = Event.element(event);
	
	if(benefitItem.id.startsWith("image"))
	{
		// The clicked item is an image and must have "image" removed from it's id.
		benefitItemId = benefitItem.id.gsub("image","");
		
		// Change the arrow image.
		if(benefitItem.src.endsWith("toggle_arrow_d.gif"))
		{
			benefitItem.src = benefitItem.src.gsub("toggle_arrow_d","toggle_arrow_u");
		}
		else
		{
			benefitItem.src = benefitItem.src.gsub("toggle_arrow_u","toggle_arrow_d");
		}

	}
	else
	{
		benefitItemId = benefitItem.id;
		
		// Change the arrow image associated with the clicked text item.
		benefitItemArrow = $(benefitItemId.gsub("pd","imagepd"));
		if(benefitItemArrow.src.endsWith("toggle_arrow_d.gif"))
		{
			benefitItemArrow.src = benefitItemArrow.src.gsub("toggle_arrow_d","toggle_arrow_u");
		}
		else
		{
			benefitItemArrow.src = benefitItemArrow.src.gsub("toggle_arrow_u","toggle_arrow_d");
		}
	}
	
	// Toggle the clicked item's associated list's visibility.
	$(benefitItemId.gsub("Arrow","List")).toggle();
}

function onClickPricePopup(winContent,winWidth,winHeight)
{
	 base.winOpen(winContent,'featureWin',winWidth,winHeight,1,1,'status=1, resizable=1,scrollbars=1');
	 return false;
}

function onClick360Handler()
{
	$('flashImg').toggle();
	showOrHideLeftColumn();
}
		
function showOrHideLeftColumn()
{
	// Hide left column panels when Flash 360 movie is shown.
	if($('flashImg').visible())
	{
		$('productImg').hide();
		$('thumbPanels').hide();

	}
	else
	{
		$('productImg').show();
		$('thumbPanels').show();
	}
}

function onClickVideoPopup()
{
	base.winOpen("http://www.wireless.att.com/home/swf/homeManager_video/index.html",'videoWin',360,420,1,1,'status=1, resizable=0,scrollbars=0');
	return false;
}