// JavaScript Document

var currentArrow			= 1;			// currently selected arrow; 1-9
var numberOfArrows			= 10;			// number of arrows
var arrowInterval			= 500;			// time between change of arrow; milliseconds
var arrows					= new Array();	// array of images for preload
var textOverlayState		= 'visible';	// current state of text overlay
var textOverlayInterval		= 2000;			// time betwenn toogle of text overlay; milliseconds
var i						= 0;

function setArrows () {
	for (i = 1; i <= numberOfArrows ; i++) {
		arrows[i] = new Image();
		arrows[i].src = '/common/colorwheel/colorwheel_arrow_' + padDigits(i, 2, '0') + '.png';
	}
	setInterval(changeArrow , arrowInterval);
	setInterval(toggleTextOverlay , textOverlayInterval);
}

function changeArrow () {
	var newArrow = Math.ceil(Math.random() * (numberOfArrows - 1) );

	if (newArrow >= currentArrow) {
		newArrow++;
	}
	document.getElementById('img_colorwheel_arrow').src = arrows[newArrow].src;
	currentArrow = newArrow;
}


function toggleTextOverlay () {
	if (textOverlayState == 'hidden') {
		textOverlayState = 'visible';
	} else {
		textOverlayState = 'hidden';
	}
	document.getElementById('colorwheel_text_overlay').style.visibility = textOverlayState;
}

function padDigits(n, totalDigits, leadingCharacter) { 
	n = n.toString(); 
	var i = 0;
	var leader = '';
	if (totalDigits > n.length) {
		for (i  = 0; i < (totalDigits - n.length); i++) { 
			leader += leadingCharacter; 
		} 
	} 
	return leader + n.toString(); 
}