var imagearray = new Array();
var Imageinterval = 6000;
var ImageTransition = 100;
var CurrentImage = 0;
var NextImage = 1;
var Intervalid = "", Transitionid = "";
var CurrImageOpac = 1;
var NextImageOpac = 0;
var OpacCounter = 0;
var IE = "Microsoft Internet Explorer";

var imagepath = "images/Photos/";


function SetupSlideShow() {

    imagearray = document.getElementById("SlideShow").getElementsByTagName("img");
    
    for (var i = 0; i < imagearray.length; i++) 
    {
        if (i == 0) 
        {
            imagearray[i].style.opacity = 1;
            CurrentImage = i;
            NextImage = i+1;
        }
        else 
        {
            imagearray[i].style.opacity = 0;
            
        }
    }
    start();
}

function start() {
Transitionid = setInterval(Switchimage, Imageinterval);
}

function stop() {
    clearInterval(Transitionid);
}

function Switchimage() {
    var Nextid = 0;
    
    CurrImageOpac = 1;
    NextImageOpac = 0;

    if (Intervalid == "") {

    Intervalid = setInterval(OpacIncrease, ImageTransition);
   
    }

    /*Nextid = imagearray.length - (CurrentImage + NextImage);
    
    CurrentImage = NextImage;
    NextImage = Nextid;
    
    Only works for 3 images or above.
    
    */
}

function changeimageid() {
    
        CurrentImage = NextImage;

        Nextid = (CurrentImage + 1);
        if (Nextid >= imagearray.length) {
            Nextid = 0;
        }
        NextImage = Nextid;
}

function OpacIncrease() {

        
    if (OpacCounter >= 11) {
        clearInterval(Intervalid);
        OpacCounter = 0;
        Intervalid = "";
        changeimageid();
    }
    else {


        if (navigator.appName != IE) {
            imagearray[NextImage].style.opacity = (NextImageOpac += 0.1); //fade in the next image
            imagearray[CurrentImage].style.opacity = (CurrImageOpac -= 0.1); //fade out the current image
           
        }
        else {
            //'alpha(opacity = ' + (value * 100) + ')';
            imagearray[NextImage].style.filter = "alpha(opacity = " + (NextImageOpac += 0.1) * 100 + ");"; //fade in the next image
            imagearray[CurrentImage].style.filter = "alpha(opacity = " + (CurrImageOpac -= 0.1) * 100 + ");"; //fade out the current image
        }
        OpacCounter++;
    }

}

function clickimage(imageid) {
    stop();

    if ((imageid + 1) > imagearray.length) {
        NextImage = 0;
    }
    else {
        NextImage = (imageid);
    }
    Switchimage();
    start();
}