/*****************************************************************************************************
****************************************************************************************************
Description		- This document contains the functions and code necessary to create the Selector
				  animations.
				  
Notes			20110123 - Created
****************************************************************************************************
*****************************************************************************************************/
var SelectorContentHeight = 350;
var SelectorTimeToSlide = 250.0;

var openSelector = '';
var openSelectorTitle = '';

function runSelector(index)
{
	// create the ID of the content div to display and the title to highlight
	var nID = "Selector" + index + "Content";
	var tID = "SelectorTitle" + index;
  
	// if we clicked on the same link twixe then we want to close it
	if(openSelector == nID) {
		nID = '';
	}
	if(openSelectorTitle == tID) {
		tID = '';
	}
	
	// begin the open/close animation
	setTimeout("animateSelector(" + new Date().getTime() + "," + SelectorTimeToSlide + ",'"
	  + openSelector + "','" + nID + "')", 33);
	// highlight opened title and de-highlight closed title
	highlightTitle(openSelectorTitle, tID);
 
 	// set the update the openSelector
  	openSelector = nID;
  	openSelectorTitle = tID;
}

function animateSelector(lastTick, timeLeft, closingId, openingId)
{  
  var curTick = new Date().getTime();
  var elapsedTicks = curTick - lastTick;
 
  var opening = (openingId == '') ? null : document.getElementById(openingId);
  var closing = (closingId == '') ? null : document.getElementById(closingId);
 
  if(timeLeft <= elapsedTicks)
  {
    if(opening != null)
      opening.style.height = SelectorContentHeight + 'px';
   
    if(closing != null)
    {
      closing.style.display = 'none';
      closing.style.height = '0px';
    }
    return;
  }
 
  timeLeft -= elapsedTicks;
  var newClosedHeight = Math.round((timeLeft/SelectorTimeToSlide) * SelectorContentHeight);

  if(opening != null)
  {
    if(opening.style.display != 'block')
      opening.style.display = 'block';
    opening.style.height = (SelectorContentHeight - newClosedHeight) + 'px';
  }
 
  if(closing != null)
    closing.style.height = newClosedHeight + 'px';

  setTimeout("animateSelector(" + curTick + "," + timeLeft + ",'"
      + closingId + "','" + openingId + "')", 33);
}
function highlightTitle(closingTitleID, openingTitleID)
{
                var opening = document.getElementById(openingTitleID);
                var closing = document.getElementById(closingTitleID);
                
                if (opening != null) {
                                opening.className = "SelectorTitle Selected"; 
                }
                if (closing != null) {
                                closing.className = "SelectorTitle";
                }
}
/*****************************************************************************************************
	Selects the image speficied.  This function is intended to be used when the page first loads
*****************************************************************************************************/
function selectDefaultGraph() 
{
	runSelector(1);
}
window.onload = selectDefaultGraph;