var StarRate = {
	instanceID: 0,
	create: function(targetElement, value, settings)
	{
		var id = this.instanceID;
		if (!settings) settings = {};
		var starCount 		= settings.starCount ? settings.starCount : 5;
		var maxValue 		= settings.maxValue ? settings.maxValue : 5;
		var backgroundItem 	= settings.backgroundItem ? settings.backgroundItem : '/images/star-black.gif';
		var starItem 		= settings.starItem ? settings.starItem : '/images/star-green.gif';
		var itemHeight 		= settings.itemHeight ? settings.itemHeight : 24;
		var itemWidth 		= settings.itemWidth ? settings.itemWidth : 22;
		var totalWidth 		= settings.width ? settings.width : 120;
		var totalHeight		= settings.height ? settings.height : 22;
		var isEditable		= settings.editable ? settings.editable : false;
		var halfStars		= settings.halfStars ? settings.halfStars : true;
		value				= value ? value : 0;
		
		// Calculate snapping interval
		var snapInterval = totalWidth / (halfStars ? (starCount*2) : starCount);
		
		if (!targetElement)
		{
			window.alert('No target element specified for StarRate. Use StarRate.create({targetElement:YOURDIV}) to set the target.');
			return false;
		}
		
		// Empty container
		emptyTextNode(targetElement);
		
		// Create stars container
		var stars = new Element('div',{'id':'starRate_stars'+id}).setStyle({position:'absolute',width:totalWidth+'px',left:totalWidth+'px'});
		var bgStars = new Element('div',{'id':'starRate_backgroundStars'+id}).setStyle({position:'absolute',width:totalWidth+'px'});
		for (var i=0; i<starCount; i++)
		{
			var star = new Element('img',{'src':starItem,'id':'starRate_star'+id+'_'+i}).setStyle({float:'left'});
			stars.appendChild(star);
			var bgstar = new Element('img',{'src':backgroundItem,'id':'starRate_backgroundStar'+id+'_'+i}).setStyle({float:'left'});
			bgStars.appendChild(bgstar);
		}
		// Create clipping container
		var clippingContainer = new Element('div',{'id':'starRate_clipping'+id}).setStyle({position: 'absolute',width:totalWidth+'px',height:totalHeight+'px',left:(0-totalWidth)+'px',overflow:'hidden'});
		clippingContainer.appendChild(stars);
		
		// Create main container
		var container = new Element('div',{'id':'starRate_container'+id}).setStyle({position: 'relative',width:totalWidth+'px',height:totalHeight+'px'});
		container.appendChild(bgStars);
		container.appendChild(clippingContainer);
		
		// Value field
		var hiddenValue = new Element('input',{'type':'hidden','name':'starRate_value','id':'starRate_value'+id});
		container.appendChild(hiddenValue);
		
		if (isEditable)
		{
			// Add cursor
			container.setStyle({'cursor':'pointer'});
			// Add mouse observers
			container.observe('mousemove', function(event){
				var el = event.element();
				var X = event.pointerX();
				var objX = $('starRate_container'+id).cumulativeOffset().left;
				var localX = X - objX;
				
				// Snap
				var snapDiff = localX % snapInterval;
				localX += (snapInterval-snapDiff);
				
				//$('debug_stars').innerHTML = "Mouse move: "+localX+". Snap diff: "+snapDiff;
				// Position clipping and stars
				$('starRate_clipping'+id).setStyle({left:(0-totalWidth+localX)+'px'});
				$('starRate_stars'+id).setStyle({left:(totalWidth-localX)+'px'});
			});
			container.observe('click', function(event){
				var xpos = totalWidth - ($('starRate_stars'+id).getStyle('left').replace('px',''));
				var posDivided = xpos/totalWidth;
				var value = starCount * posDivided;
				$('starRate_value'+id).value = value;
				
				//$('debug_stars').innerHTML = "Value: "+value;
			});
			container.observe('mouseout', function(event){
				
				var objPos = $('starRate_container'+id).cumulativeOffset();
				var xOffset = event.pointerX() - objPos.left;
				var yOffset = event.pointerY() - objPos.top;
				//$('debug_stars').innerHTML = "Mouse out: "+xOffset+","+yOffset;
				
				// Check if it was a "true" mouseout
				if (xOffset<1||xOffset>totalWidth-1||yOffset<1||yOffset>totalHeight-1)
				{
					// It's a true mouseout
					if ($('starRate_value'+id).value == "")
					{
						// No value set, so animate back to 0
						var finalX = 0-totalWidth;
					}
					else
					{
						// A value is set, so animate back to that value
						var amount = $('starRate_value'+id).value / starCount;
						var pixels = totalWidth - (totalWidth * amount);
						var finalX = 0-pixels;
					}			
					var currentX = $('starRate_clipping'+id).getStyle('left').replace('px','');
					new Effect.Tween(null, currentX, finalX, {duration:.3}, function(p)
					{ 
						$('starRate_clipping'+id).setStyle({left:p+'px'});
						$('starRate_stars'+id).setStyle({left:(0-p)+'px'});
						//$('debug_stars').innerHTML = "Left: "+p;
					});
				}
				
			});
		}
		
		// Output the starRate to the document
		$(targetElement).appendChild(container);
		
		// Set default value
		if (value > 0)
		{
			hiddenValue.value = value;
			// A value is set, so animate back to that value
			var amount = value / starCount;
			var pixels = totalWidth - (totalWidth * amount);
			var finalX = 0-pixels;
			
			$('starRate_clipping'+id).setStyle({left:finalX+'px'});
			$('starRate_stars'+id).setStyle({left:(0-finalX)+'px'});
			/*
			var currentX = $('starRate_clipping'+id).getStyle('left').replace('px','');
			new Effect.Tween(null, currentX, finalX, {duration:.3}, function(p)
			{ 
				$('starRate_clipping'+id).setStyle({left:p+'px'});
				$('starRate_stars'+id).setStyle({left:(0-p)+'px'});
				//$('debug_stars').innerHTML = "Left: "+p;
			});
			*/
		}
		
		// Increase instance ID by 1 for next instance
		this.instanceID++
	}
};