//document.write('<link rel="stylesheet" type="text/css" href="/<%=Info.PagesPath%>v<%=this.Version%>/default/crafts/css/stars.css" media="screen" />');

var Input = {
	initialize: function() {
		
		var divs = $("div.crafts-radio-one,div.crafts-radio-two,div.crafts-radio-three,div.crafts-radio-four,div.crafts-radio-five");
		for(var i = 0; i < divs.length; i++) {
			var $divRadio = $(divs[i]);
			$divRadio.hover(function () {Input.effect(this);}, function () {Input.reverseeffect(this)});
			$divRadio.mouseup(function () {Input.handle(this)});
		}
		
		//check to see if there is a rating div if so then change the more-info div
		var ratingDiv = $("#avgRating");
		if (ratingDiv){
			var moreInfo = $("#more-info");
			if (moreInfo) 
				moreInfo.attr("id", "hasRating")
				
			var $innerContent = $("#inner-content");
			if ($innerContent) {
				if(!$innerContent.hasClass('hasRating')) {
					$innerContent.addClass('hasRating');
				}
			}
		}
			
	},

	effect: function(el) {
//	    if(document.getElementsByTagName("form")) {
//			var divs = document.getElementsByTagName("div");
//	    }
		if(el.className == "crafts-radio-one") {
			el.style.backgroundPosition = "0 -23px";
		} else if(el.className == "crafts-radio-two") {
		    el.style.backgroundPosition = "0 -23px";
		    document.getElementById("radio-1").style.backgroundPosition = "0 -23px";
		} else if(el.className == "crafts-radio-three") {
		    el.style.backgroundPosition = "0 -23px";
		    document.getElementById("radio-1").style.backgroundPosition = "0 -23px";
		    document.getElementById("radio-2").style.backgroundPosition = "0 -23px";
		} else if(el.className == "crafts-radio-four") {
		    el.style.backgroundPosition = "0 -23px";
		    document.getElementById("radio-1").style.backgroundPosition = "0 -23px";
		    document.getElementById("radio-2").style.backgroundPosition = "0 -23px";
		    document.getElementById("radio-3").style.backgroundPosition = "0 -23px";
		} else if(el.className == "crafts-radio-five") {
		    el.style.backgroundPosition = "0 -23px";
		    document.getElementById("radio-1").style.backgroundPosition = "0 -23px";
		    document.getElementById("radio-2").style.backgroundPosition = "0 -23px";
		    document.getElementById("radio-3").style.backgroundPosition = "0 -23px";
		    document.getElementById("radio-4").style.backgroundPosition = "0 -23px";
		}
	},
	
	reverseeffect: function(el) {
		document.getElementById("radio-1").style.backgroundPosition = "0 0px";
		document.getElementById("radio-2").style.backgroundPosition = "0 0px";
		document.getElementById("radio-3").style.backgroundPosition = "0 0px";
		document.getElementById("radio-4").style.backgroundPosition = "0 0px";
		document.getElementById("radio-5").style.backgroundPosition = "0 0px";
	},

	handle: function(el) {
		var itemId = $('#itemId', 'form#rateCraft').attr("value");
		var type = $('#type', 'form#rateCraft').attr("value");
		var rateValue = $('input:first', el).attr("value"); 
		var path = "";
		
		var options = {
				controller: '/fpxml.aspx',
				state: $('#st', 'form#rateCraft').attr('value'),
				event: 'rate'
		};	
		var query = options.controller;		
		var dataXml =	
			'<request st="' + options.state +  '" e="' + options.event + '">' + 
			'<parameters>' +
	        '<parameter name="itemId">' + itemId + '</parameter>' +
	        '<parameter name="type">' + type+ '</parameter>' +
	        '<parameter name="ratevalue">' + rateValue+ '</parameter>' +
			'</parameters></request>';
			
		$.post(query, dataXml, function(xml){
			Input.updateAvgRating(xml);
		  }, "html");
			  
		

		//////////////////
		switch(rateValue){
		case"1":
		path = "/content/v4/us/crafts/img/1colorstar.jpg"
		break;
		
		case"2":
		path = "/content/v4/us/crafts/img/2colorstar.jpg"
		break;
		
		case"3":
		path = "/content/v4/us/crafts/img/3colorstar.jpg"
		break;
		
		case"4":
		path = "/content/v4/us/crafts/img/4colorstar.jpg"
		break;
		
		case"5":
		path = "/content/v4/us/crafts/img/5colorstar.jpg"
		break;
		
		}
		
		
		/////////////////
		
		var contentId = $('#itemId', 'form#rateCraft').attr("value");
		document.cookie = "craftRating" + contentId + "="+ rateValue +"; expires=Fri, 31 Dec 2099 23:59:59 GMT;";
		
		$('form#rateCraft').html('');		
		$('form#rateCraft').append('<p>Thanks! Here\'s how you rated this craft:</p><img src="'+path+'"/>');

	},
	
	
	updateAvgRating: function(responseXml) {
		var xmlDoc = null;
		var path = "";		
		//check if ie
		if($.browser.msie) {
			xmlDoc=new ActiveXObject("Microsoft.XMLDOM");
 			xmlDoc.async="false";
  			xmlDoc.loadXML(responseXml);
		} else {
			var parser = new DOMParser();
			xmlDoc = parser.parseFromString(responseXml, "text/xml");
		}
		var attributeNodes = xmlDoc.getElementsByTagName('attribute');
		for(i=0; i < attributeNodes.length; i++){
			var code = attributeNodes[i].getAttribute('code');
			switch(code){
				case 'ratingValue':
					avgRateValue = attributeNodes[i].firstChild.firstChild.nodeValue;
					break;
				case 'numberOfRatings':
					numberOfRatings = attributeNodes[i].firstChild.firstChild.nodeValue;
					break;
				default:
					//maybe default load failed caption and image
					break;
			}
		}
		switch(avgRateValue){
			case"1":
			path = "/content/v4/us/crafts/img/1colorstar.jpg"
			break;
			
			case"2":
			path = "/content/v4/us/crafts/img/2colorstar.jpg"
			break;
			
			case"3":
			path = "/content/v4/us/crafts/img/3colorstar.jpg"
			break;
			
			case"4":
			path = "/content/v4/us/crafts/img/4colorstar.jpg"
			break;
			
			case"5":
			path = "/content/v4/us/crafts/img/5colorstar.jpg"
			break;		
		}
		
		var ratingHolder = document.getElementById("avgRatingHolder");
		var ratingDiv = document.getElementById("avgRating");
		
		if(ratingDiv) {
			ratingHolder.removeChild(ratingDiv);
		}
		
		// show Average rating value div
		// <div id="avgRating">Average User Rating: <img src="/content//v4/us/crafts/img/4colorstar.jpg"/> out of 2 votes.</div>
		var newNode = document.createElement("div");
		newNode.setAttribute("id", "avgRating");
		var newImageNode = document.createElement("img");
		newImageNode.setAttribute("src",path);
		var newNodeText1 = document.createTextNode("Average rating:");
		var newNodeText2 = document.createTextNode("out of " + numberOfRatings + " vote(s).");
		newNode.appendChild(newNodeText1);
		newNode.appendChild(newImageNode);
		newNode.appendChild(newNodeText2);
		ratingHolder.appendChild(newNode);		
		
		// if there is a rating div, then change the more-info div
		{
			var moreInfo = document.getElementById("more-info");
			if (moreInfo) 
				moreInfo.setAttribute("id","hasRating");
				
			var innerContent = document.getElementById("inner-content");
			if (innerContent) 
				innerContent.className = "hasRating";
		}
	},

	clear: function() {
		divs = $("#div");
		for(var i = 0; i < divs.length; i++) {
			if(divs[i].className == "crafts-radio-one") {
				divs[i].style.backgroundPosition = "0 0";
			} else if(divs[i].className == "crafts-radio-one selected") {
				divs[i].style.backgroundPosition = "0 -23px";
			}
		}
	}
};

$(function () {
	Input.initialize();
});