/*
 * Sonalksis custom rollButtons
 * 
 * TODO: probably should check for nulls in case page loads partially and user starts clicking like a man possessed.
 *
 */

	var rollHeight    = 72;
	var rollSpeed     = 10;           // how many pixels
	var framerate     = 25;           // animation interval time (ms)
	var titleTopStart = 0;            // pixels
	var rollTopStart  = rollHeight;   // pixels

	var titleTopEnd   = titleTopStart - rollHeight;
	var rollTopEnd    = 0;

	/*
	var isActive      = new Array(false, false, false, false);
	var rollNext      = new Array(false, false, false, false);

	var offset        = new Array(0, 0, 0, 0);
	
	var timeout       = new Array(4);
	var titleObjects  = new Array(4);
	var rollObjects   = new Array(4);
	*/
	
	var isActive;
	var rollNext;
	var offset;
	var timeout;
	var titleObjects;
	var rollObjects;
	
	function preloadComplete()
	{
		document.getElementById("nav").style.display    = 'inline';
		document.getElementById("nav").style.visibility = 'visible';
	}
	
	//
	// To initialise rollButtons, use "var numRollers = <number>; window.onload = initRollers;"
	//
	function initRollers()
	{
		isActive     = new Array(numRollers);
		rollNext     = new Array(numRollers);
		offset       = new Array(numRollers);
		timeout      = new Array(numRollers);
		titleObjects = new Array(numRollers);
		rollObjects  = new Array(numRollers);
		
		for (var i = 0; i < numRollers; i++)
		{
			isActive[i] = false;
			rollNext[i] = false;
			offset[i]   = 0;
		}

	}
	
	function rollOn(index, titleId, rollId)
	{
		rollNext[index] = true;
		
		if (isActive[index] == false)
		{
			titleObjects[index] = document.getElementById(titleId);
			rollObjects[index]  = document.getElementById(rollId);
			timeout[index]      = setTimeout(function(){animRollOn(index);}, framerate);
		}
	}

	function rollOff(index, titleId, rollId)
	{
		rollNext[index] = false;
		
		if (isActive[index] == false)
		{
			titleObjects[index] = document.getElementById(titleId);
			rollObjects[index]  = document.getElementById(rollId);
			
			timeout[index]      = setTimeout(function(){animRollOff(index);}, framerate);
		}
	}
	
	function animRollOff(index)
	{
		if (offset[index] > 0)
		{
			offset[index] -= rollSpeed;
			
			titleObjects[index].style.top = titleTopEnd + (rollHeight - offset[index]) + "px";
			rollObjects[index].style.top  = rollTopEnd  + (rollHeight - offset[index]) + "px"; 

			if (offset[index] <= 0)
			{
				isActive[index] = false
				clearTimeout(timeout[index]);

				if (rollNext[index] == true)
				{
					setTimeout(function(){animRollOn(index);}, framerate);
				}
			}
			else
			{
				isActive[index] = true;
				timeout[index]  = setTimeout(function(){animRollOff(index);}, framerate);
			}
		}
	}

	
	function animRollOn(index)
	{	
		if (offset[index] < rollHeight)
		{
			offset[index] += rollSpeed;

			titleObjects[index].style.top = titleTopStart - offset[index] + "px";
			rollObjects[index].style.top  = rollTopStart  - offset[index] + "px"; 
			
			if (offset[index] >= rollHeight)
			{
				isActive[index] = false;
				clearTimeout(timeout[index]);

				if (rollNext[index] == false)
				{
					setTimeout(function(){animRollOff(index);}, framerate);
				}
			}
			else
			{
				isActive[index] = true;
				timeout[index]  = setTimeout(function(){animRollOn(index);}, framerate);
			}
		}
	}