// set vars
var numSlides = $('#slideshow .sidebox_slide').size()-1;
var currentSlide = 0;
var nextSlide = currentSlide + 1;
var slideshow = false;

//disable all slides on init
$('#slideshow .sidebox_slide').each(function() {
    $(this).hide();
});
// show only first slide on init
$('#slideshow .sidebox_slide').eq(currentSlide).show();
$('#slidebox_buttons span').eq(currentSlide).addClass('active');

$('.slidebutton').live('click', function() {
    showSelectedSlide($(this).attr('rel'));
});
setSlideshowTimer();

function setSlideshowTimer() {
  slideshow = setInterval(
    function() {
      showNextSlide()
    },
    5000
  );
}

function resetSlideshowTimer() {
  clearInterval(slideshow);
  setSlideshowTimer();
}

// function to show next slide and hide current slide
function showNextSlide() {
    
    if(currentSlide < numSlides) {
        nextSlide = currentSlide + 1;
    }
    else {
        nextSlide = 0;
    }
    $('#slideshow .sidebox_slide').eq(currentSlide).fadeOut();
    $('#slideshow .sidebox_slide').eq(nextSlide).fadeIn();

    $('#slidebox_buttons span').removeClass('active');
    $('#slidebox_buttons span').eq(nextSlide).addClass('active');

    if(currentSlide < numSlides) {
        currentSlide = nextSlide;
    }
    else {
        currentSlide = 0;
    }
}

function showSelectedSlide(clickedSlide) {
    if(clickedSlide < numSlides) {
        nextSlide = clickedSlide + 1;
    }
    else {
        nextSlide = 0;
    }
    $('#slideshow .sidebox_slide').eq(currentSlide).fadeOut();
    $('#slideshow .sidebox_slide').eq(clickedSlide).fadeIn();
    $('#slidebox_buttons span').removeClass('active');
    $('#slidebox_buttons span').eq(clickedSlide).addClass('active');
    currentSlide = clickedSlide;
    resetSlideshowTimer();
}