$(document).ready(function() 
{	
	
	// Slideshow

	var menuWrapper = document.getElementById('slideshow-menu-wrapper');
	var cursor = document.getElementById('slideshow-menu-cursor');

	var slideshow = new Dragdealer('slideshow', {
		steps : 3,
		loose : true,
		animationCallback : function(x, y) {
			var top = x * (menuWrapper.offsetHeight - cursor.offsetHeight);
			cursor.style.top = String(top) + 'px';
		}
	});

	document.getElementById('slideshow-photo-1').onclick = function() {
		slideshow.setStep(1);
		stopTimer();
		return false;
	}

	document.getElementById('slideshow-photo-2').onclick = function() {
		slideshow.setStep(2);
		stopTimer();
		return false;
	}

	document.getElementById('slideshow-photo-3').onclick = function() {
		slideshow.setStep(3);
		stopTimer();
		return false;
	}


	// TIMER

	var i = 2;

	function activeSlide() {
		
		if(i == 1) {
			$(".handle").animate({
			    left: '0',
			}, 1000, function() {});
			$("#slideshow-menu-cursor").animate({
				top: '0',
			}, 1000, function() {});
		}
		if(i == 2) {
			$(".handle").animate({
				left: '-400',
			}, 1000, function() {});
			$("#slideshow-menu-cursor").animate({
				top: '68',
			}, 1000, function() {});
		}
		
		if(i == 3) {
			$(".handle").animate({
				left: '-800',
			}, 1000, function() {});
			$("#slideshow-menu-cursor").animate({
				top: '136',
			}, 1000, function() {});
		}
		

		if (i < 3) {i++;} else {i = i - 2;}
	}

	// Play TIMER
	timer = setInterval(activeSlide, 2500);

	// Stop TIMER
	function stopTimer() {
		clearInterval(timer);
	}
	
});