var jsSlider = {
	'timer': null,
	'effects': {
		'fade': null,
		'appear': null
	},
	'slides': {
		'active': 1,
		'total': 0
	},
	'options': {
		'delay': 5,
		'fade': 0.75
	}
};

Event.observe(window, 'load', function() {
	jsSlider.slides.total = $$('div.slider-slide').length;
	
	$$('div.slider-slide').invoke('hide');
	$$('div.slider-slide').first().show();
	
	$$('a.slider-button').first().addClassName('slider-button-active');
	$$('a.slider-button').each(function(button) {
		button.observe('click', function(event) {
			fadeSlide(event.element().id.replace('slider_button_', ''));
		})
	})
	
	start();
	
	$('slider').observe('mouseover', function(event) {
		if(withinElement($('slider'), event))
			stop()
    });

	$('slider').observe('mouseout', function(event) {	
        if(withinElement($('slider'), event))
            start();
    });
});

function start()
{
	jsSlider.timer = new PeriodicalExecuter(fadeSlide, jsSlider.options.delay);
}

function stop()
{
	jsSlider.timer.stop();
}

function withinElement(element, event)
{
	var relatedTarget = $(event.relatedTarget || event.fromElement);
	var target = Event.element(event);
	if ((target == element || Element.descendantOf(target, element))
	&& !((relatedTarget == element) || Element.descendantOf(relatedTarget, element)))
	{
		return true;
	}
	else return false;
}

function fadeSlide(slide)
{
	/**
	 * Set opacity to 1 for all slides
	 * Hide all slides except active
	 */
	$$('div.slider-slide').each(function(slide) {
		slide.setOpacity(1);
		
		if(slide.id == 'slider_slide_' + jsSlider.slides.active)
			slide.show();
		else
			slide.hide();
	});
	
	jsSlider.effects.fade = $('slider_slide_' + jsSlider.slides.active).fade({ 
		duration: jsSlider.options.fade, 
		from: 1, 
		to: 0
	});
	
	if(slide > 0)
	{
		jsSlider.slides.active = slide;
	}
	else
	{
		if(jsSlider.slides.active == jsSlider.slides.total)
			jsSlider.slides.active = 1;
		else
			jsSlider.slides.active++;
	}

	jsSlider.effects.appear = $('slider_slide_' + jsSlider.slides.active).appear({ 
		duration: jsSlider.options.fade, 
		from: 0, 
		to: 1
	});
	
	refreshButtons();
}

function refreshButtons()
{
	$$('a.slider-button').each(function(button) {
		button.removeClassName('slider-button-active');
		
		$('slider_button_' + jsSlider.slides.active).addClassName('slider-button-active');
	});
}