// Tools for rating widget
// Copyright Network Ten 2010
// @author rsim

// JS / CSS required
// js-http://onehd.staging.ten.com.au/cutup/js/jquery-ui.custom.min.js
// js-http://onehd.staging.ten.com.au/cutup/js/jquery.ui.stars.js
// css-http://onehd.staging.ten.com.au/cutup/css/jquery.stars.css
// version 1.0 18/08/2010

var starRating = {
		contentRatings: {},
		ratingObjects: {},
		siteID: {},
		contentType: {},
		
		//Init
		setup: function (siteID, contentType, contentIDs){
			var contentIDList = new Array();

			if (contentIDs instanceof Array) {
				contentIDList = contentIDs
			} else {
				contentIDList.push(contentIDs)
			}
			
			this.siteID = siteID;
			
			this.contentType = contentType;
			
			this.getRating(siteID, contentType, contentIDList);
			
			return this;						
		},
		
		//Get rating of the ID
		getRating: function (siteID, contentType, contentIDList){
			var ratingResults = new Array();
			
			var data = '<?xml version="1.0" encoding="utf-8" ?>';
			data += '<list>';
			data += '<siteId>'+siteID+'</siteId>';
			data += '<contentType id="'+contentType+'">';
			if (contentIDList.length > 0){
				for (i=0; i<contentIDList.length; i++){
					data += '<media id="' + contentIDList[i] + ' "/>';
				}
			}
			data += '</contentType>';
			data += '</list>';
			
			$.ajax({
				type: "POST",
				url: "/ratings/getRateInfo.ashx",
				data: {data: data},
				dataType: "xml",
				async: false,
				success: function (xml) {
					//alert(xml)
 
					$(xml).find('content').each(function() {
						ratingResults[$(this).attr('contentID')] = $(this).attr('rate')+","+$(this).attr('votes')+","+$(this).attr('allow');
					});
				}
			});
			
			this.contentRatings = ratingResults;
		},
		
		//Draw the form
		drawForm: function (contentID, targetHtmlObject, customVars){
			
			var siteID = this.siteID;
			
			var contentType = this.contentType;
			
			var ratingData = this.contentRatings[contentID];
			
			var setUpVar = {
					voteDisabled: true,
					showResult: true,
					div_prefix: "rating"
				};
				
			var r_setup;
			
			if (customVars === undefined){
				r_setup = setUpVar;
			} else {
				r_setup = $.extend(setUpVar, customVars);
			}
			
			var s_id = contentID + "_" + r_setup.div_prefix;
			
			if (ratingData == undefined){
				var avr = 0
				var count = 0;
				var vote_allow = false;
			} else {
				var avr = ratingData.split(',')[0];
				var count = ratingData.split(',')[1];
				var vote_allow = ratingData.split(',')[2];
			}
			
			countStr = count + " " + (count == 1 ? "vote" : "votes"); 
			
			//If particular content allow vote
			if ((vote_allow == "true") || (vote_allow == "True")){
				if(r_setup.voteDisabled){
					var remarkStr;
					switch(contentType){
						case 1:
						  remarkStr = "Please watch the video to vote";
						  break;
						case 2:
						  remarkStr = "Please view the photo to vote";
						  break;
						case 3:
						  remarkStr = "Please read the recipe to vote";
						  break;
						case 4:
						  remarkStr = "Please read the article to vote";
						  break;
						default:
						  remarkStr = "Please select the content to vote";
					}
				
					var stars = $('<div class="st_rate_form">' +
						'	<div class="stars dstf'+contentID+'" id="dummy_starRatingForm_' + s_id  + '">' +
							getStarDrawn(s_id, avr, remarkStr) +
						'	</div>' +
						'</div>' +
						'<div class="rateCount dstc'+contentID+'" id="dummy_countInfo_'+ s_id  + '">'+ countStr +'</div>'
					 );
				} else {
					if(r_setup.showResult){
					// Form set up to show result initially
						var stars = $('<div class="st_rate_form">' +
							'	<div class="stars stf'+contentID+'" id="starRatingForm_' + s_id  + '">' +
							'		<input name="rating_' + contentID + '" type="radio" value="' + siteID + ',' + contentID + ',' + contentType + ',1" class="star" />' +
							'		<input name="rating_' + contentID + '" type="radio" value="' + siteID + ',' + contentID + ',' + contentType + ',2" class="star" />' +
							'		<input name="rating_' + contentID + '" type="radio" value="' + siteID + ',' + contentID + ',' + contentType + ',3" class="star" />' +
							'		<input name="rating_' + contentID + '" type="radio" value="' + siteID + ',' + contentID + ',' + contentType + ',4" class="star" />' +
							'		<input name="rating_' + contentID + '" type="radio" value="' + siteID + ',' + contentID + ',' + contentType + ',5" class="star" />' +
							'	</div>' +
							'	<div id="loader_'+s_id+'" class="loader">' +
							'		<div style="padding-top: 5px;">loading...</div>' +
							'	</div>' +
							'	<div id="ro_starRating_' + s_id  + '" class="ro_form ro'+contentID+'">' +
							'		<div class="stars" id="ro_starRatingForm_' + s_id  + '">' +
									getStarDrawn(s_id, avr) +
							'		</div>' +
							'	</div>' +
							'</div>' +
							'<div class="rateCount stc'+contentID+'" id="countInfo_'+ s_id  + '">'+ countStr +'</div>'
						);
					} else {
					// Form set up to hide result initially
						var stars = $('<div class="stars stf'+contentID+'" id="starRatingForm_' + s_id  + '">' +
							'<input name="rating_' + contentID + '" type="radio" value="' + siteID + ',' + contentID + ',' + contentType + ',1" class="star" ' + '/>' +
							'<input name="rating_' + contentID + '" type="radio" value="' + siteID + ',' + contentID + ',' + contentType + ',2" class="star" ' + '/>' +
							'<input name="rating_' + contentID + '" type="radio" value="' + siteID + ',' + contentID + ',' + contentType + ',3" class="star" ' + '/>' +
							'<input name="rating_' + contentID + '" type="radio" value="' + siteID + ',' + contentID + ',' + contentType + ',4" class="star" ' + '/>' +
							'<input name="rating_' + contentID + '" type="radio" value="' + siteID + ',' + contentID + ',' + contentType + ',5" class="star" ' + '/>' +
							'</div>' +
							'<div id="loader_'+s_id+'" class="loader"><div style="padding-top: 5px;">please wait...</div></div>'
						);
					}
				}
			} else {
				//No voting allows
				var stars = $('<div class="st_rate_form">' +
						'	<div class="stars stf'+contentID+'" id="starRatingForm_' + s_id  + '">' +
							getStarDrawn(s_id, avr, "You have already voted") +
						'	</div>' +
						'</div>' +
						'<div class="rateCount stc'+contentID+'" id="dummy_countInfo_'+ s_id  + '">'+ countStr +'</div>'
				 );
			}
			//$('#'+targetDivID).html(stars);
			targetHtmlObject.html(stars);
			
			var ratingObject = new Object;
			ratingObject.divID = s_id;
			ratingObject.rate = avr;
			ratingObject.count = count;
			
			this.ratingObjects[contentID] = ratingObject;
			this.formInit(s_id,r_setup);
			initToolTips();				
		},
		
		//Init the star form
		formInit: function (s_id,r_setup){
			$("#ro_starRating_"+s_id).bind("mouseover", function(){
				$(this).hide();			
			});
		
			$("#starRatingForm_"+s_id).bind("mouseout", function(){
				$("#ro_starRating_"+s_id).show();			
			});
		
			$("#starRatingForm_"+s_id).stars({
				oneVoteOnly: true,
				disabled: r_setup.voteDisabled,
				callback: function(ui, type, value) {
					//$("#loader_"+s_id).show();
					var siteID = value.split(',')[0];
					var contentID = value.split(',')[1];
					var contentType = value.split(',')[2];
					var rateValue = value.split(',')[3];
					
					$.post("/ratings/ratehandler.ashx",
						{
							siteID: siteID,
							widgettype: contentType,
							contentID: contentID,
							rate: rateValue
						},
						function(ratingData) {
							if(r_setup.showResult){
								var avr = ratingData.split(',')[0];
								var count = ratingData.split(',')[1];
								if (ratingData == undefined){
									var avr = 0
									var count = 0;
									//var vote_allow = true;
								} else {
									var avr = ratingData.split(',')[0];
									var count = ratingData.split(',')[1];
									//var vote_allow = ratingData.split(',')[2];
								}									
								countStr = count + " " + (count <= 1 ? "vote" : "votes"); 
								//$("#starRatingForm_"+s_id).stars("selectID", avr-1);
								/*$("#starRatingForm_"+s_id).unbind("mouseout");
								$("#starRatingForm_"+s_id).hide();
								$("#ro_starRating_"+s_id).unbind("mouseover");
								$("#ro_starRating_"+s_id).show();
								$("#ro_starRating_"+s_id).html(getStarDrawn(s_id, avr, "Thank you for your vote"));
								$("#countInfo_"+s_id).html(countStr);
								//Update other info
								$("#dummy_starRatingForm_"+s_id).html(getStarDrawn(s_id, avr, "Thank you for your vote"));
								$("#dummy_countInfo_"+s_id).html(countStr);*/
								$('.stf'+contentID).unbind("mouseout");
								$('.stf'+contentID).hide();
								$(".ro"+contentID).unbind("mouseover");
								$(".ro"+contentID).show();
								$(".ro"+contentID).html(getStarDrawn(s_id, avr, "Thank you for your vote"));
								$('.stf'+contentID).html(getStarDrawn(s_id, avr, "Thank you for your vote"));
								$('.stc'+contentID).html(countStr);
								$('.dstf'+contentID).html(getStarDrawn(s_id, avr, "Thank you for your vote"));
								$('.dstc'+contentID).html(countStr);
								 
								initToolTips();								
							}
							//$("#loader_"+s_id).hide();
						}
					);
				}	
			});
		},
		
		//Return the object of the star
		getRatingInfo: function(contentID){
			return this.ratingObjects[contentID];
		}
		
}
function getStarDrawn(s_id, avr, remark){
	if ( remark === undefined ) {
		return '<div id="ro_fake-stars-off_'+s_id+'" class="stars-off"><div id="ro_fake-stars-on_'+s_id+'" class="stars-on" style="width:'+getCSSwidth(avr)+'px"></div></div>';
	} else{
		return '<div id="ro_fake-stars-off_'+s_id+'" class="stars-off rateTips" remark="'+remark+'"><div id="ro_fake-stars-on_'+s_id+'" class="stars-on rateTips" remark="'+remark+'" style="width:'+getCSSwidth(avr)+'px"></div></div>';
	}
}

function getCSSwidth(rate){
	var CSSlook = new Array();
		CSSlook["0"] = "0";
		CSSlook["0.5"] = "8";
		CSSlook["1"] = "16";
		CSSlook["1.5"] = "24";
		CSSlook["2"] = "32";
		CSSlook["2.5"] = "40";
		CSSlook["3"] = "48";
		CSSlook["3.5"] = "56";
		CSSlook["4"] = "64";
		CSSlook["4.5"] = "72";
		CSSlook["5"] = "80";
	return CSSlook[rate];
}

//Init Tooltips for disable vote
function initToolTips(){
	$(".rateTips").tooltip({
	 track: false,
	 delay: 0,
	 showURL: false,
		fade: 100,
		bodyHandler: function() { 
			return $(this).attr("remark"); 
		} 
	});
 
}