(function($)
{
	$.fn.AnaSlideController = function()
	{
	
		var btns = this;
		
		var defaultImages = [];
		var activeImages  = [];
		var activeNum = 0;

		
		var rollover = function(_index)
		{
			activeNum = _index;
			var url = activeImages[activeNum];
			btns.eq(activeNum).attr("src", url)
							  .css("cursor", "pointer");	
		}
		
		
		var rollout = function()
		{
			var url = defaultImages[activeNum];
			
			btns.eq(activeNum).attr("src", url)
							  .css("cursor", "auto");		
	
		}
		
				
		this.each(function(i)
		{
			$this = $(this);
			
			var defaultImgURL	= $this.attr("src");
			var fileType 		= defaultImgURL.substring(defaultImgURL.lastIndexOf('.'), defaultImgURL.length);
			var activeImgURL 	= defaultImgURL.replace(fileType, '_a' + fileType);
			
			
			defaultImages.push(defaultImgURL);
			activeImages.push(activeImgURL);
			
			
			//preload
			new Image().src = activeImgURL;
			
			
			$this.parent().mouseover(function(e)
			{
				rollout();
						
				var $img = $(this).find("img");
				var index = btns.index($img);
				
				rollover(index);
				$img.trigger("EVENT_CHANGE", [ index ]);
			});
			
			
		});
		
		
		
		
		//----------------------------------------------------
		// public method
		//----------------------------------------------------
		
		this.onRollOver = function(_index)
		{
			rollout();
			rollover(_index);
		}
		
		this.onRollOut = function()
		{
			rollout();
		}

		
		return this;
	};
})(jQuery);