var fadeSpeed = 1000;
var pauseInterval = 3500;
var slideInterval;

$(document).ready(function() {
	slideInterval = window.setTimeout("slideSwitch()", pauseInterval );


	$("a.nextSlide").click(function() {
		clearTimeout(slideInterval);
		slideInterval = window.setTimeout("slideSwitch()", pauseInterval );
		quickSlideSwitch("next");
		return false;
	});
	
	$("a.prevSlide").click(function() {
		clearTimeout(slideInterval);
		slideInterval = window.setTimeout("slideSwitch()", pauseInterval );
		quickSlideSwitch("prev");
		return false;
	});

	$("#thumbs img.thumbBtn").click(function() {
		clearTimeout(slideInterval);
		slideInterval = window.setTimeout("slideSwitch()", pauseInterval );
		jumpToSlide($(this).attr("data-id"));
		return false;	
	});

});


function slideSwitch() {
	
    var $active = $('#slideshow ul li.active');

    if ( $active.length == 0 ) $active = $('#slideshow ul li:last');

    var $next =  $active.next().length ? $active.next()
        : $('#slideshow ul li:first');

    $active.addClass('last-active');

	no = $next.find("img").attr("data-id");
	$(".activestate").animate({"left": no*159}, {easing: "easeOutSine"});

	slideInterval = window.setTimeout("slideSwitch()", pauseInterval );

    $next.css({opacity: 0.0})
        .addClass('active')
        .animate({opacity: 1.0}, fadeSpeed, function() {
            $active.removeClass('active last-active');
        });
}

function quickSlideSwitch(direction) {
	
    var $active = $('#slideshow ul li.active');

	if (direction == "prev") {
		var $next =  $active.prev().length ? $active.prev()
        : $('#slideshow ul li:last');
	} else {
 	   var $next =  $active.next().length ? $active.next()
        : $('#slideshow ul li:first');
    }
    
    $next.css({opacity: 1.0});
    $next.addClass('active');
	$active.removeClass('active last-active');

	no = $next.find("img").attr("data-id");
	$(".activestate").animate({"left": no*159}, {easing: "easeOutSine"});
}

function jumpToSlide(id) {
	var $active = $('#slideshow ul li.active');
	var $next = $("img[data-id="+id+"]").parent();
    $next.css({opacity: 1.0});
    $next.addClass('active');
	no = $next.find("img").attr("data-id");
	$(".activestate").animate({"left": no*159}, {easing: "easeOutSine"});
	$active.removeClass('active last-active');

}