$(document).ready(function() {
	$(".stars").each(function() {
		var obj = $(this);
		var classes = []; classes[1] = "one"; classes[2] = "two"; classes[3] = "three"; classes[4] = "four"; classes[5] = "five"; classes[6] = "six"; classes[7] = "seven"; classes[8] = "eight"; classes[9] = "nine"; classes[10] = "ten";
		obj.append("<ul></ul>");
		for( var i = 1; i <= 10; i++ ) {
			$("<li></li>").html( '<a href="#" class="' + classes[i] + '">' + i + '</a>' ).appendTo( obj.find("ul") );
		}
		obj.append('<p class="average"></p>');
		obj.append('<p class="results"></p>');
		$.ajax({ type: "GET", cache: false, url: "/ratings/rating.php", dataType: "xml", data: "name=" + obj.attr("id"), success: function(xml) {
			var average = $(xml).find('average').text();
			var votes = $(xml).find('votes').text();
			var value = $(xml).find('value').text();
				obj.find("ul").prepend('<li class="current" style="width:' + average * 22 + 'px;"></li>');
				obj.find("p.average").html( average + ' <span id="highlight">(' + votes + ' votes)</span>');
			}
		});
	});
	$(".stars a").click(function(e) {
		e.preventDefault();
		var obj = $(this).closest("div");
		var name = obj.attr("id");
		var value = $(this).html();
		obj.find("ul, li").css("opacity", 0.33);
		obj.find("p.results").css("color","#aaa");
		obj.find("p.average").css("color","#aaa");
		$.ajax({ type: "GET", cache: false, url: "/ratings/rating.php", dataType: "xml", data: "name=" + name + "&value=" + value, success: function(xml) {
			var average = $(xml).find('average').text();
			var votes = $(xml).find('votes').text();
			var value = $(xml).find('value').text();
				obj.find("ul").find("li.current").remove();
				obj.find("ul").prepend('<li class="current" style="width:' + average * 22 + 'px;"></li>');
				obj.find("p.average").html( average + ' (' + votes + ' votes)');
				obj.find("ul, li").css("opacity", 1);
				obj.find("p.average").css("color","#666");
			}
		});
	});
});