var counter = 0;
var sliderwidth = 572;
var indicatorwidth = 17; // Please include margins and padding in this number
var slideduration = 1500;
var timebetweenautoslides = 8000;
var forward = true;
var showbuttons = false;
var showindicators = true;
var periodicalFunctionVar;
var numberofslidesinview = 1;

var cannon = function() 
{
	aSlideDivs = $$('#imageslider div.slide');
	
    if (counter == aSlideDivs.length - 1 - (numberofslidesinview - 1)) forward = false;
    else if (counter == 0) forward = true;
	
	if(forward == true) counter++;
	else counter--;	
	
	doSlide();
}

var nextSlide = function(event) 
{
	$clear(periodicalFunctionVar);
	aSlideDivs = $$('#imageslider div.slide');
	if (counter < aSlideDivs.length - 1 - (numberofslidesinview - 1))
	{ 	
		counter++;		
		doSlide();
	}
	event.stop();
}

var previousSlide = function(event) 
{
	$clear(periodicalFunctionVar);
	if (counter > 0)
	{	
		counter--;		
		doSlide();
	}
	event.stop();
}

var jumpSlide = function(event)
{
	$clear(periodicalFunctionVar);
	periodicalFunctionVar = cannon.periodical(timebetweenautoslides);
	
	clickedIndicator = this;
	
	$$('#indicators li').each(function(item, index){
		if(clickedIndicator == item) counter = index;
	});
	doSlide();
	event.stop();
}

var doSlide = function()
{
	aSlideDivs = $$('#imageslider div.slide');
	
	aSlideDivs.each(function(div){
		offset = div.getStyle('width').substring(0, div.getStyle('width').length - 2);
		div.set('tween', {duration: slideduration});
		div.tween('left', -(counter * offset) + (offset * (div.id.substring(5) - 1)) + 'px');
	});
	
	$$('#indicators li').set('class', 'inactive');
	$$('#indicators li')[counter].set('class', 'active');

	if (showbuttons == true)
	{
		if (counter == aSlideDivs.length - 1)
		{
			$('leftslidebutton').fade(1);
			$('rightslidebutton').fade(0.3);
			
			$('leftslidebutton').setStyle('cursor', 'pointer');
			$('rightslidebutton').setStyle('cursor', 'auto');
		}
		else if (counter == 0)
		{
			$('leftslidebutton').fade(0.3);
			$('rightslidebutton').fade(1);
			
			$('leftslidebutton').setStyle('cursor', 'auto');
			$('rightslidebutton').setStyle('cursor', 'pointer');
		}
		else 
		{
			$('leftslidebutton').fade(1);
			$('rightslidebutton').fade(1);
	
			$('leftslidebutton').setStyle('cursor', 'pointer');
			$('rightslidebutton').setStyle('cursor', 'pointer');
		}
	}	
}

function setupSlides()
{
	aSlideDivs = $$('#imageslider div.slide');
	aSlideDivs.each(function(div){
		offset = div.getStyle('width').substring(0, div.getStyle('width').length - 2);
		var aLeftPos = offset*(div.id.substring(5) - 1);
		div.setStyle('left', aLeftPos + 'px');
	});
}
 
window.addEvent('domready', function() 
{
    if($$('#imageslider div.slide').length > 1)
    {
    	if(($$('#imageslider div.slide').length >= 2) && (showbuttons == true))
    	{
    		aSlideButtonLeftEl = new Element('div', {id: 'leftslidebutton'});
    		aSlideButtonLeftEl.inject($('imagesliderwrapper'), 'top');
    	
    		aSlideButtonRightEl = new Element('div', {id: 'rightslidebutton'});
    		aSlideButtonRightEl.inject($('imagesliderwrapper'), 'top');
    		
    		$('rightslidebutton').addEvent('click', nextSlide);
    		$('leftslidebutton').addEvent('click', previousSlide);
    	}
    
    	if(($$('#imageslider div.slide').length >= 2) && (showindicators == true))
    	{
    		aIndicatorsListEl = new Element('ul', {id: 'indicators'});
    		aIndicatorsListEl.inject($('imageslider'), 'top');
    
	    	$$('#imageslider div.slide').each(function(aItem, aIndex){
				aIndicatorEl = new Element('li');
				aIndicatorEl.set('class', 'inactive');
				aIndicatorEl.inject(aIndicatorsListEl, 'top');
			});
			$('indicators').getElement('li').set('class', 'active');
			
			$$('#indicators li').addEvent('click', jumpSlide);
		}
    
		setupSlides();
		doSlide();
    	periodicalFunctionVar = cannon.periodical(timebetweenautoslides);
    }
});