var currentSlide = 1;
var slideTimeout;       // timeout instead of interval because wait time isn't constant

// transition to the specified slide
function transitionSlide(nextSlide) {
    // fade current text out
    $('#imgSlideText' + currentSlide).fadeOut(1000);

    // then fade current scene out, next scene in, current nav out, next nav in, current info out
    $('#imgSlideScene' + currentSlide).delay(1000).fadeOut(1000);
    $('#imgSlideScene' + nextSlide).delay(1000).fadeIn(1000);
    $('#hlSlideNav' + currentSlide).delay(1000).fadeTo(1000, 0.25);
    $('#hlSlideNav' + nextSlide).delay(1000).fadeTo(1000, 1);
    $('#pnlSlideInfo' + currentSlide).delay(1000).fadeOut(500);

    // then next info in
    $('#pnlSlideInfo' + nextSlide).delay(1500).fadeIn(500);

    // then fade next text in
    $('#imgSlideText' + nextSlide).delay(2000).fadeIn(1000);

    // pass the torch
    currentSlide = nextSlide;
    slideTimeout = setTimeout('advanceSlide()', 8000); // 8 - 3 = 5
}

// called via timeout, causes transition to next sequential slide
function advanceSlide() {
    var nextSlide = currentSlide + 1;
    if (nextSlide > 3) {
        nextSlide = 1;
    }

    transitionSlide(nextSlide);
}

$(document).ready(function () {
    // set nav visibilities
    $('.slide-nav a').css('opacity', 0.25);
    $('#hlSlideNav1').css('opacity', 1);

    // show first info
    $('#pnlSlideInfo1').show();

    // show first scene, fade in first text
    $('#imgSlideScene1').show();
    $('#imgSlideText1').fadeIn(1000);

    // begin auto-transitions
    slideTimeout = setTimeout('advanceSlide()', 6000); // 6 - 1 = 5

    $('.slide-nav a').click(function () {
        // some string mojo to get the number of the clicked nav
        var id = $(this).attr('id');
        var num = parseInt(id.charAt(id.length - 1));

        // stop auto-transitions
        clearTimeout(slideTimeout);

        // stop all animations and reset visibilities
        $('.slide-canvas img').stop(true, true);
        $('.slide-canvas img').hide();
        $('.slide-nav a').stop(true, true);
        $('.slide-nav a').css('opacity', 0.25);
        $('.slide-info div').stop(true, true);
        $('.slide-info div').hide();

        // show scene and nav and info, fade in text
        $('#imgSlideScene' + num).show();
        $('#hlSlideNav' + num).css('opacity', 1);
        $('#pnlSlideInfo' + num).show();
        $('#imgSlideText' + num).fadeIn(1000);

        // pass the torch
        currentSlide = num;
        slideTimeout = setTimeout('advanceSlide()', 6000); // 6 - 1 = 5

        return false;
    });
});