var slidActiveOld = 0;
var slidActiveOldLink = null;
var slidActive = null;
var slidMaxElements = null;
var autoSlide = null;
var autoSlideElements = null;
var autoSlideIndex = 1;
var autoSlideIndexLast = 0;
var zindex=9000;
var slidSpeed = 700;

$(document).ready(function() {
		
	// How many Slider Elements we have?
	slidMaxElements = $('#skppscSlider').find('div.sliderContent').length;
        
	$('.nextSliderElement').each(function(index) {
		$(this).attr('id', "sn"+index);
		if (index == 0) {
			$(this).closest('td').attr('class', 'nextSliderElement active');
			slidActiveOldLink = this;
		}
	});
  
	// SlideUp
	$('.nextSliderElement').click(function() {
		slidActive = $(this).attr('id');
		if (slidActive == slidActiveOld) {
			return;
		}		
		window.clearInterval(autoSlide);
		zindex++;
		$(this).closest('td').attr('class', 'active');
		slidActiveNew = slidActive.replace('sn', '');		
		$($('#skppscSlider').children('div')[slidActiveNew]).attr('style', 'z-index:'+zindex);

		$('#sliderNavigation').attr('style', 'z-index:'+parseInt(100000+zindex));



		$($('#skppscSlider').children('div')[slidActiveNew]).animate({ left: '900px'},0);
		$($('#skppscSlider').children('div')[slidActiveNew]).animate({ left: '0px'}, slidSpeed);
		
		$(slidActiveOldLink).closest('td').attr('class', '');
		slidActiveOld=slidActiveNew;
		autoSlideIndex = parseInt(slidActiveNew)+1;
		$('#sn'+autoSlideIndexLast).attr('class', '');
		autoSlideIndexLast = parseInt(slidActiveNew);
		slidActiveOldLink = this;
		autoSlide = window.setInterval("__autoSlider()", 9000);
	});
	
	autoSlider();
	
});

function autoSlider() {
	autoSlide = window.setInterval("__autoSlider()", 9000);
}


function __autoSlider() {

	if (autoSlideIndex > 2) {
		autoSlideIndex = 0;
	}
	$('#sn'+autoSlideIndex).attr('class', 'active');
	zindex++;

	$($('#skppscSlider').children('div')[autoSlideIndex]).attr('style', 'z-index:'+zindex);
	$('#sliderNavigation').attr('style', 'z-index:'+parseInt(100000+zindex));	

	$($('#skppscSlider').children('div')[autoSlideIndex]).animate({ left: '0px'}, slidSpeed);
	$($('#skppscSlider').children('div')[autoSlideIndex-1]).attr({ left: '900px'},0);

	$('#sn'+autoSlideIndexLast).attr('class', '');
	autoSlideIndexLast = autoSlideIndex;
	slidActiveOldLink=autoSlideIndex;
	autoSlideIndex++;
	if (autoSlideIndex > 2) {
		autoSlideIndex = 0;
	}
}