function HandleClick(rating, category){
    var currentRating;
    var newRating;
    
    //initialize variables
    newRating = 0;
    currentRating = document.getElementById(category + '-rating').value;
    currentRating = currentRating - 0; //implicit conversion
   
    
    if (currentRating == rating){
        //the user clicked a full star
        newRating = currentRating - 1;
    }
    else if (currentRating == rating - 1){
        //the user clicked a half star
        newRating = currentRating - 1;
    }
    else {
        //the user clicked a blank star
        newRating = rating;
    }
    
    //set the new rating
	document.getElementById(category + '-rating').value = newRating;
	
	//update stars
    RenderStars(newRating, category);
}




function HandleMouseOver(rating, category){ 
    var currentRating;
    
    //initialize variables
    currentRating = document.getElementById(category + '-rating').value;
    currentRating = currentRating - 0; //implicit conversion
    
    //update stars
    //if its currently a half-star, don't replace it with a full star on hover
    if (rating == currentRating + 1){
        RenderStars(currentRating, category);
    }
    else{
        RenderStars(rating, category);
    }
    
    //display the appropriate text label
	UpdateLabelText(rating, category);
}




function HandleMouseOut(category){
    var rating;
    
    //initialize variables
    rating = document.getElementById(category + '-rating').value;
    rating = rating - 0;  //implicit type conversion to int
    
    //update stars
    RenderStars(rating, category);
    
    //update label text
    UpdateLabelText(rating, category);  
}	



function RenderStars(rating, category){
    var currentRating;
    var numFullStars;   //number of full stars to display
    var halfStar;       //the half star to display, if there is one
    var firstGrayStar;  //where the first gray star should start from
    
    //initialize variables
    currentRating = document.getElementById(category + '-rating').value;
    currentRating = currentRating - 0; //implicit conversion
    
    
    //determine the number of full stars to display
    if (rating < currentRating)
    {
        if (currentRating % 2 > 0)
        {
            halfStar = Math.round(currentRating / 2);
            numFullStars = halfStar - 1;
            firstGrayStar = numFullStars + 2;
        }
        else
        {
            numFullStars = currentRating / 2;
            halfStar = 0;
            firstGrayStar = numFullStars + 1;
        }
    }
    else
    {
        if (rating % 2 > 0)
        {
            halfStar = Math.round(rating / 2)
            numFullStars = halfStar - 1;
            firstGrayStar = numFullStars + 2;
        }
        else
        {
            numFullStars = rating / 2;
            halfStar = 0;
            firstGrayStar = numFullStars + 1;
        }
    }

    
    
    //"light up" the appropriate full stars
    for (i = 1; i <= numFullStars; i++)
    {
        document.getElementById(category + '-star' + i).src='/virt/images/star_on.gif';
    }
    
    //display a half star if necessary
    if (halfStar > 0)
    {
        document.getElementById(category + '-star' + halfStar).src='/virt/images/star_half.gif';
    }

    //the rest of the stars should be gray
    for (i = firstGrayStar; i <= 5; i++)
    {
        document.getElementById(category + '-star' + i).src='/virt/images/star_off.gif';
    }
    
}





function UpdateLabelText(rating, category){
    switch (rating) {
        case 0:
            document.getElementById(category + '-rating-label').innerHTML = '';
		    break;
			
	    case 1:
		    document.getElementById(category + '-rating-label').innerHTML = 'Awful';
		    break;
		    
		case 2:
		    document.getElementById(category + '-rating-label').innerHTML = 'Awful';
		    break;

	    case 3:
		    document.getElementById(category + '-rating-label').innerHTML = 'Poor';
		    break;
		    
		case 4:
		    document.getElementById(category + '-rating-label').innerHTML = 'Poor';
		    break;

	    case 5:
		    document.getElementById(category + '-rating-label').innerHTML = 'Average';
		    break;
		    
		case 6:
		    document.getElementById(category + '-rating-label').innerHTML = 'Average';
		    break;

	    case 7:
		    document.getElementById(category + '-rating-label').innerHTML = 'Good';
		    break;
		    
		case 8:
		    document.getElementById(category + '-rating-label').innerHTML = 'Good';
		    break;

	    case 9:
		    document.getElementById(category + '-rating-label').innerHTML = 'Excellent';
		    break;
		    
		case 10:
		    document.getElementById(category + '-rating-label').innerHTML = 'Excellent';
		    break;

	    default:
		    //do nothing
		    break;
	} //end switch
}