var FADE_SPEED = 10;
var FADE_AMOUNT = -0.01;
var PAUSE_TIME = 3000;

var alpha = 1;

var slideshowContainer;
var slideshow;
var tempImg;
var currentImage = 0;   
    
onloadCallback = initSlideShow;

//This is the animation order (slide show loop occurs between [ ] )
//Start->LoadInitialImage-> [LoadNextImage(in background)->Pause->FadeOut->FadeIn]
function initSlideShow()
{
    slideshowContainer = document.getElementById('slideshow');
    slideshowContainer.innerHTML = '';
    slideshow = new Image();
                       
    loadNextImage(function()
    {
        slideshow = this;
        setOpacity(slideshow);
        slideshowContainer.appendChild(slideshow);
        
        loadNextImage();
        setTimeout(fade, PAUSE_TIME);
     }); 
}

function setOpacity(img)
{
    //IE
    if (typeof(img.style.filter) != 'undefined') img.style.filter = 'alpha(opacity=' + (alpha * 100) + ')'; 
    
    //Standard
    else img.style.opacity = alpha; 
}

//This both fades in, and fades out based on the value of FADE_AMOUNT
function fade()
{     
    alpha = alpha + FADE_AMOUNT;
    setOpacity(slideshow);

    if (alpha <= 0) // FadeOut
    {
        FADE_AMOUNT = -FADE_AMOUNT;
        setNewImage();
    }
    else if (alpha >= 1) //FadeIn
    {
        FADE_AMOUNT = -FADE_AMOUNT;
        loadNextImage();
        setTimeout(fade, PAUSE_TIME);
    }
    else setTimeout(fade, FADE_SPEED); //Fading
}

function loadNextImage(callback)
{     
    tempImg = new Image();
    if (typeof(callback) != 'undefined') tempImg.onload = callback;
    
    //Store the temp current before changing it, due to multi-threaded callbacks
    var tempCurrent = currentImage;
    currentImage = currentImage + 1;
    if (currentImage == slideshowImages.length) currentImage = 0;
    
    tempImg.src = currentPath + slideshowImages[tempCurrent];        
}   

//This replaces the old slideshow image with the new one
//NOTE: This simulates a blocking function, in that it won't set the new image, until the image is loaded
function setNewImage()
{
    if (tempImg.imageLoaded == false) setTimeout(setNewImage, 1);
    else
    {
        setOpacity(tempImg);
        slideshowContainer.removeChild(slideshow);
        slideshowContainer.appendChild(tempImg);
        slideshow = tempImg;
        fade();
    }
}