// JPEG Array-based animation script: copyright http://StoneTip.com

// Define variaables, path, name, number, and ID of images.
// eg, this is for seven images, named 0-6: images/radface/radio[0-6].jpg
var img_path = "/images/radface/radio"

// highest number in image names (eg, radio6.jpg)
var img_num = 6;

// ID of img to animate
var img_ID = "radioface";

// variables for use in scripts
var img_0 = img_path + 0 + ".jpg";

// <img src="images/radface/radio0.jpg" id="radioface">


// Preload all the images so there is not stuttering or interruption when the animation is triggered
// Note: This is called before anything else so it gets going right away
for(i=0; i<img_num; i++)
{
	var preloadImageName = "preloadImage" + i;
	
	eval(preloadImageName + " = new Image()");
	
	eval(preloadImageName + ".src = '" + img_path + i + ".jpg'");
}



// This is the order in which we want the images to display - creating a pulsing effect
drawOrderArray = new Array(1, 0, 1, 2, 1, 0, 2, 3, 1, 4, 3, 2, 3, 2, 4, 2, 3, 4, 5, 6);

// Clear out any timeouts that have been set on object
function clearObjectTimeouts(obj)
{
	// First, check to see that a timeout array has been created for the obj
	if (obj.timeouts != undefined)
	{		
		// Loop through timeouts array and clear each timeout
		for (i=0; i < obj.timeouts.length; i++)
		{
			clearTimeout(obj.timeouts[i]);
		}
		
		// Clean up the timeouts array by creating an empty array
		obj.timeouts = new Array();	
	}
}


// addObjectTimeout will add a timeout to the array attached to the object
function addObjectTimeout(obj, timeoutStatement, duration)
{		
	// Check to see if the array exists			
	if (obj.timeouts == undefined)
	{
		// If not, create it
		obj.timeouts = new Array();
	}
	
	// Push a new timeout onto the end of the array
	obj.timeouts.push( setTimeout(timeoutStatement, duration) );
}


/* showFrame does the actual work of displaying each item, based on 
   the time scale (duration) used. It loops through the drawOrderArray
   and recursively adds timeouts. If it reaches the end of the array, it
   starts over again */
function showFrame(objID, num)
{

	// Get the image object from its ID. (We use ID because a timeout cannot pass an object, only references)
	obj = document.getElementById(objID);

	// Check to see that we haven't reached the end of the drawOrderArray
	if (num < drawOrderArray.length)
	{
		// Set the number of the current frame from the content of current array item
		var currentFrame = drawOrderArray[num];
		
		// Set the source of the image object
		obj.src = img_path + currentFrame + ".jpg"
		
		// increment the array
		num++;
		
		// (re)build the timeout statement with the incremented number
		var timeoutStatement = "showFrame('" + objID + "',"  +  num + ")";
	
		// set the duration. Note: This could be rewritten to vary if the drawOrderArray used a constructor with
		// both frame number and duration
		var duration = 150;
		
		// Set a new timeout with the incremented number (recursing into showFrame)
		addObjectTimeout(obj, timeoutStatement, duration);
	}

// start times to repeat animation.
	else repeatTimers(obj);

//	else // Start over at beginning of drawOrderArray
//	{
//		num = 0;
		
//		showFrame(objID, 0);
//	}


}


// We could just call showFrame, but this clarifies things
function startAnim(obj)
{
	// clear waitAnim timeouts from memory
	clearTimeout(timeoutIDstart);
	
	// begin another animation cycle
	showFrame(obj.id, 0);
}

// And this provides a matching function to stop the animation
function stopAnim(obj)
{
	// Clear all the timeouts from the image object's timeouts array
	clearObjectTimeouts(obj);
	
	// Revert the image back to the original
	obj.src = img_0
}


// Wait, then revert to original image, then repeat animation.
function repeatTimers(obj)
{
	// Clear all the timeouts from the image object's timeouts array
	clearObjectTimeouts(obj);

	// Revert, repeat
	timeoutID102 = setTimeout('obj.src=img_0',3500);
	timeoutID103 = setTimeout('repeatAnim(obj)',10000);

}

// Repeat the animation
function repeatAnim(obj)
{
	// Clear repeatTimers
	clearTimeout(timeoutID102);
//	clearTimeout(timeoutID103);
	
	// Start animation again
	startAnim(obj);
}


// Wait, then start animation
function waitAnim(obj)
{	
	// In 5sec start animation.
	timeoutIDstart = setTimeout('startAnim(document.getElementById(img_ID))', 3000);
}


// Simon Willsons' addLoadEvent
// http://simon.incutio.com/archive/2004/05/26/addLoadEvent
function addLoadEvent(func) {
    var oldonload = window.onload;
    if (typeof window.onload != 'function') {
        window.onload = func;
    } else {
        window.onload = function() {
            if (oldonload) {
                oldonload();
            }
            func();
        }
    }
}

addLoadEvent(function() {
    waitAnim();
})