//creating a array of the image object



var image = new Array();

var Largeimage = new Array();



for (i = 0; i <= 21; i++) {

    image[i] = "images/site/instantgallery/tvImages/" + i + ".png"

    Largeimage[i] = "images/site/instantgallery/large/" + i + ".jpg"

}



//variable that will increment through the images

var num = 0



// set the delay between images

var timeDelay = 2000



//the ordinal of the large image

var currentImage = 0;



var i = 0;



//Preload Images

//Preload the images in the cache so that the images load faster

//create new instance of images in memory 

var imagePreload = new Array()

for (i = 0; i < image.length; i++) {

    imagePreload[i] = new Image()

    // set the src attribute

    imagePreload[i].src = image[i]

}

//var LargeimagePreload=new Array()

//for (i=0;i<Largeimage.length;i++)

//{

//    LargeimagePreload[i]=new image()

// set the src attribute

//    LargeimagePreload[i].src=Largeimage[i]

//}



//create a random number to stop at in the flicker

var randomnumber = Math.floor(Math.random() * image.length)

//randomnumber = 44



function slideshowAutomatic() {

    LargeImageOrdinal = num;

    num = num + 1;





    if (num == eval(image.length)) {

        num = 0;

        randomnumber = Math.floor(Math.random() * image.length) //between 0 and image.length

        ///randomnumber = 44

    }







    var funcString = 'swapToNextImage(' + num + ')';



    if (eval(num) == eval(randomnumber)) {

        document.getElementById('slideShow').style.cursor = "pointer";

        currentImage = Largeimage[LargeImageOrdinal]

        setTimeout(funcString, 5000);

    }

    else {

        document.getElementById('slideShow').style.cursor = "auto";

        currentImage = "undefined";

        setTimeout(funcString, 100);

    }

}



function swapToNextImage(ordinal) {

    document.getElementById('slideShow').src = image[ordinal];

    if (eval(ordinal) == eval(randomnumber)) {

        //currentImage = Largeimage[ordinal]

        setTimeout("slideshowAutomatic()", 50);

    }

    else {

        //currentImage = "undefined";

        setTimeout("slideshowAutomatic()", 50);



    }



}



// allImagesLoaded()

// Checks if all the images are loaded in the document

// It Does this by looping through all the images and checks the attribute .complete

// If .complete is false then we set the return variable to 0

function allImagesLoaded() {



    // return variable

    var imagesloaded = 1;



    // All images are saved in an array called document.images. Very usefull

    var images = parent.document.images;

    // Loop through all the images

    for (var i = 1; i <= images.length; i++) {

        // If the image isnt loaded we set the return varible to 0

        if (images[i].complete == false) {

            imagesloaded = 0;

        }

    }



    // This will return 0 if one or more images are not loaded and 1 if all images are loaded.

    return imagesloaded;

}



//need to apply currentImage as source to the image in the LargeImageDiv making LargeImageDiv invisible and LoadingDiv visible in the parent document

//Then run the allImagesLoaded() function but ensuring that it checks parent.document.images

//if the images have loaded make the LargeImageDiv in parent document visible and LoadingDiv invisible



function ImageDivHandlers() {

    if (currentImage != "undefined") {

        //alert('make LargeImageDiv invisible and LoadingDiv visible and start loading ' + currentImage)



        toggleBox('imageDetailDiv', 1);





        var detailImage = document.getElementById('DetailImage')

        detailImage.src = 0;



        var detailImageHeight = 0;

        var detailImageWidth = 0;



        parent.document.getElementById('imageLoadingDiv').style.height = detailImageHeight + 'px';

        parent.document.getElementById('imageLoadingDiv').style.width = detailImageWidth + 'px';



        parent.document.getElementById('imageDetailDiv').style.height = detailImageHeight + 'px';

        parent.document.getElementById('imageDetailDiv').style.width = detailImageWidth + 'px';



        //alert( detailImageHeight + ' ' + detailImageWidth)





        if (allImagesLoaded() == 0) {

            setTimeout("ImageDivHandlers()", 200)

        }

        else {

            parent.toggleBox('imageLoadingDiv', 0);

        }

    }





}



function showLargeImage() {

    if (currentImage != "undefined") {

        parent.toggleBox('imageLoadingDiv', 1);

        ImageDivHandlers()

    }

}



function toggleBox(szDivID, iState) // 1 visible, 0 hidden
{

    if (document.layers)	   //NN4+
    {

        document.layers[szDivID].visibility = iState ? "show" : "hide";

        //fadeFunction(szDivID, iState);

    }

    else if (document.getElementById)	  //gecko(NN6) + IE 5+
    {

        var obj = document.getElementById(szDivID);

        obj.style.visibility = iState ? "visible" : "hidden";

        //fadeFunction(szDivID, iState);

    }

    else if (document.all)	// IE 4
    {

        document.all[szDivID].style.visibility = iState ? "visible" : "hidden";

        //fadeFunction(szDivID, iState);

    }

}


function changeMainImage(imgordinal) {

    var detailImage = document.getElementById('DetailImage')
    
    detailImage.src = "images/site/instantgallery/large/0.jpg";
    
    toggleBox('imageDetailDiv', 1);

    detailImage.src = Largeimage[imgordinal];
}

function defaultMainImage() {

    var detailImage = document.getElementById('DetailImage')

    detailImage.src = "images/site/instantgallery/large/0.jpg";
}