var SliderRollOver = Class.create();
SliderRollOver.GetLog = function()
{
    return nulllog;
}
SliderRollOver.DefaultOptions = 
{
	sliderControl:"",
	leftButton:"",
	leftButtonArea:"",
	rightButton:"",
	rightButtonArea:""
};

SliderRollOver.prototype = 
{
	initialize:function(options)
	{
        this.log = SliderRollOver.GetLog();
        this.log.info("inicalizando...");
		this.options = Object.extend(SliderRollOver.DefaultOptions, options);
		this.leftButton = $(this.options.leftButton);
		this.rightButton = $(this.options.rightButton);
		
		this.leftButtonArea = $(this.options.leftButtonArea);
		this.rightButtonArea = $(this.options.rightButtonArea);
		
		this.sliderControl = $(this.options.sliderControl);
		
		
		this.leftOn = false;
		this.rightOn = false;
		this.log.info("Observando evendo mousemove...");
		
		Event.observe(this.sliderControl, 'mousemove', this.checkButtons.bind(this));
		//Event.observe(this.sliderControl, 'custom:mouseleave', this.hideButtons.bind(this));
		this.hideButtons();
	},
	checkButtons:function(evt)
	{
		var mouseX = Event.pointerX(evt);
		var mouseY = Event.pointerY(evt);
		var width  = screen.width / 2;
		var position = mouseX - width;
		
		if(position - 10 > 0 && !this.rightOn)
		{	
			this.log.info("Acende direita");
			this.rightOn = true;
			this.leftOn = false;
			Effect.Appear(this.rightButtonArea, { duration: .5});
			Effect.Fade(this.leftButtonArea, { duration: .5});
		} else if(position + 10 < 0 && !this.leftOn)
		{
			this.log.info("Acende esquerda");
			this.leftOn = true;
			this.rightOn = false;
			Effect.Appear(this.leftButtonArea, { duration: .5});
			Effect.Fade(this.rightButtonArea, { duration: .5});
		} 
	},
	hideButtons:function()
	{
		this.leftOn = true;
		this.rightOn = false;
		this.log.info("Apaga todos: ");
		this.log.info(this.leftButtonArea);
		this.log.info(this.rightButtonArea);
		
		Effect.Fade(this.leftButtonArea, { duration: .5});
		Effect.Fade(this.rightButtonArea, { duration: .5});
	}	

};