/* Slideshow */

var transition = 0;

var transitions = [
    ['#slide-1', '#slide-2'],
    ['#slide-2', '#slide-3'],
    ['#slide-3', '#slide-4'],
    ['#slide-4', '#slide-5'],
    ['#slide-5', '#slide-6'],
    ['#slide-6', '#slide-7'],
    ['#slide-7', '#slide-8'],
    ['#slide-8', '#slide-1']
]

/*

 1. #slideshow starts loading image
 2. #slideshow finishes loading image, onload event fires
 3. onload event calls fadeFromBlack
 4. fadeFromBlack calls startSlideShow when finished
 4. startSlideShow sets callback for fadeToBlack in 5 secs
 5. fadeToBlack calls changeImage when finished
 6. changeImage changes the src attribute of #slideshow

 */
            
function pause()
{
    setTimeout(nextSlide, 5000);
}
          
function startSlideShow()
{
    pause();
}

function nextSlide()
{
    var current = transitions[transition][0];
    var next = transitions[transition][1];
    
    $(current).fadeOut(1500);
    $(next).fadeIn(1500, pause);
    
    transition = transition + 1;
    if (transition >= transitions.length)
    {
        transition = 0;
    }
}