var gEcGames = new Array();
var gEcCurrent = 0;
var gEcTimeoutObj = null;
var gEcTimeout = 5000; // how long until game rotate
/**
 * Initializes the editor's choice section.
 *
 */
function doEcLoad() {
	// Add events for all images in the footer.
	var thumbs = document.getElementsByClassName("ecSmallImage");
	for (var i=0, len=thumbs.length; i<len; i++) {
		Event.observe(thumbs[i], "click", doEcClick, true);
	}
	
	// Collect all games in the middle. Store in global array for quick access later.
	var ecMiddle = $("ecMiddle");
	gEcGames = document.getElementsByClassName("ecGame");
	
	gEcTimeoutObj = window.setTimeout("doEcRotate();", gEcTimeout);
}

/**
 * Shows the appropriate EC game. Hides the rest.
 */
function showEcGame(gameId) {
	for (var i=0, len=gEcGames.length; i<len; i++) {
		if (i == gameId) {
			//gEcGames[i].style.display = "block";
			new Effect.Appear(gEcGames[i], {duration : 0.7});
		} else {
			gEcGames[i].style.display = "none";
		}
	}
}

/**
 * Event handler for thumbnail image click
 */
function doEcClick(e) {
	var source = Event.element(e);
	// Set the global...
	gEcCurrent = parseInt(source.getAttribute("ecGame"), 10);
	// Show game
	showEcGame(gEcCurrent);
	// Clear the timeout so we don't get an immediate game switch
	window.clearTimeout(gEcTimeoutObj);
	// Reset the timeout, double the time so someone can read what they clicked properly.
	gEcTimeoutObj = window.setTimeout("doEcRotate();", gEcTimeout*2);
}

/**
 * Rotates the EC games every X seconds.
 */
function doEcRotate() {
	if ( (gEcCurrent + 1) < gEcGames.length) {
		gEcCurrent++;
	} else {
		gEcCurrent = 0;
	}
	showEcGame(gEcCurrent);
	// reset the timeout
	gEcTimeoutObj = window.setTimeout("doEcRotate();", gEcTimeout);
}


// Add onload handler
Event.observe(window, "load", doEcLoad, true);