var rates = new Array( 0, 1, 2, 3, 4, 5);

var rateNotes = new Array(
			"Clear",
			"Poor",
			"Fair",
			"Average",
			"Good",
			"Excellent");
			
var imgMap = new Array(
			"0,0,17,16",
			"17,0,33,16",
			"33,0,49,16",
			"49,0,65,16",
			"65,0,80,16",
			"80,0,96,16"		
			);

var allImages = new Array();

function PreloadImgs() {
	// imgArray preloads the images
	imgArray = new Array();

	for (var i = 0; i <= 5; i++) {
		allImages[i] = new Image();
		allImages[i].src = 'images/ratings' + i + '-stars.gif';
	  imgArray[i] = '/images/ratings/' + i + '-stars.gif';
	}
}

function Rollover(myID, itemName) {
		document.images[itemName + 'Rate'].src = imgArray[myID];
		document.getElementById(itemName + 'Notes').innerHTML = rateNotes[myID];
}

function Rollout(itemName) {
		hiddenElement = document.getElementsByName(itemName);
		if (hiddenElement[0].value == 0) {
			document.images[itemName + 'Rate'].src = imgArray[0];
			document.getElementById(itemName + 'Notes').innerHTML = "Select a Rating";
		} else {
			document.images[itemName + 'Rate'].src = imgArray[hiddenElement[0].value];
			document.getElementById(itemName + 'Notes').innerHTML = rateNotes[hiddenElement[0].value];
		}
}

function RateMe(rate, whichName) {
		hiddenElement = document.getElementsByName(whichName);
		if (rate == 0) {
			hiddenElement[0].value = 0;
		} else {
			hiddenElement[0].value = rate;
		}		
}

function buildRating(ratingName) {
	var ratingItem;
	ratingItem = "<map name=\"mp" + ratingName + "\">";
	for (i=0; i<=5; i++) {
		ratingItem += "<area shape=\"rect\" ";
		ratingItem += "coords=\"" + imgMap[i] + "\" ";
		ratingItem += "onMouseOver=\"Rollover(" + i + ", '" + ratingName + "');\" ";
		ratingItem += "onMouseOut=\"Rollout('" + ratingName + "')\" ";
		ratingItem += "onClick=\"RateMe(" + rates[i] + ", '" + ratingName + "')\">";
	}
	ratingItem += "</map>";
	ratingItem += "<img src=\"/images/ratings/0-stars.gif\" usemap=\"#mp" + ratingName + "\" ";
	ratingItem += "name=\"" + ratingName + "Rate\" border=\"0\" style=\"cursor: hand\">";
	ratingItem += "<div id=\"" + ratingName + "Notes\">Select a Rating</div>";
	ratingItem += "<input type=\"hidden\" name=\"" + ratingName + "\" value=\"0\">";
	
	document.write(ratingItem);
}

// Initialize the Arrays
PreloadImgs();