var numberOfSlides=4;
var slideWidth=900;
var currentPos=0;
var slideDirection="left"
var slideTimer;
var currentIndex=1;
var timeoutValue=10000;

var slide = function() {

	var slideUl = Ext.get('slide-list');

	if(currentPos>=((numberOfSlides-1)*slideWidth))
	{
		slideDirection="right";
	}
	else if(currentPos==0) {
		slideDirection="left";
	}
	
	if(slideDirection=="right")
	{
		slideUl.move(slideDirection,slideWidth,true);
		currentPos=currentPos-slideWidth;
		currentIndex=currentIndex-1;
	}
	else
	{
		slideUl.move(slideDirection,slideWidth,true);
		currentPos=currentPos+slideWidth;
		currentIndex=currentIndex+1;
	}

	updateIndex(currentIndex);

	slideTimer = setTimeout("slide();",timeoutValue);	

}

var updateIndex = function(index) {

	for(var i=0;i<numberOfSlides;i++)
	{
		var elem = Ext.get('slide' + (i+1));
		elem.removeClass('current-slide');
	}

	var currentElem = Ext.get('slide' + index);
	currentElem.addClass('current-slide');
}

var pauseSlides = function() {

	var pauseButton = Ext.get('slide-pause');
	pauseButton.removeClass('available');

	var playButton = Ext.get('slide-play');
	playButton.addClass('available');

	clearTimeout(slideTimer);
}

var playSlides = function() {

	var pauseButton = Ext.get('slide-pause');
	pauseButton.addClass('available');

	var playButton = Ext.get('slide-play');
	playButton.removeClass('available');

	slideTimer = setTimeout("slide();",timeoutValue);
}

var gotoSlide = function(index) {

	pauseSlides();
	var slideUl = Ext.get('slide-list');
	var noOfSlidesToMove = currentIndex-index;

	var amountToMove = slideWidth*noOfSlidesToMove;

	slideUl.move("right",amountToMove,true);
	currentPos=currentPos-amountToMove;

	currentIndex = index;
	updateIndex(currentIndex);
}

Ext.onReady( function(){

	playSlides();

});