// Author    : Chris Smith
// Copyright : 2009 Silver Maple Studio
// Date      : 30 July 2009
// Filename  : slideshow_automatic.js

// Global Variables

var slideshowId = 'show';    /* change this to the ID of the slideshow list */
var imgTextId = 'imgText';     /* change this to the ID of the slideshow image text */
var mySlideshowPtr;          /* this is a pointer variable to the slide show image list */
var myImageTextObj;          /* this is a pointer/object that points to the html code that defines the image text region */
var mySlideshowImages;       /* Array of Img Objects */
var currentImage;            /* Image index that tracks the current image to be shown */
var previousImage;           /* Image index that tracks the previous image that will be shown */

var d = document;            /* document pointer */
var crossFadeTimer;          /* timer used to initiate or continue the cross fade */

var curOpacityPercent;       /* Current Image Opacity Percentage used in crossFade */
var prevOpacityPercent;      /* Previous Image Opacity Percentage used in crossFade */



/* ---------------- All Functions are defined below ----------------------------*/

/* *****************************************************
   *             Function setOpacity                   *
   ***************************************************** */

// Purpose: The purpose of this function is to set the opacity of an image object.
//          The selected image is chosen by the imageIndex variable that is passed
//          to the function.  This allows to fade out one image and fade in another.
//
// Inputs: imageIndex - selects which image object to modify the opacity of.
//         percentOpacity - sets the opacity of an image, where 100% opacity is
//                          an image that is fully faded up (totally visible)
//                          and 0% opacity is an image that is fully faded
//                          out (not visible).
//
// Output: Opacity update of the image that is indexed by imageIndex

function setOpacity(imageIndex, percentOpacity) {

    var imgObj = mySlideshowImages[imageIndex];

    if (imgObj.style) {
        if (imgObj.style.MozOpacity != null) {
            /* Mozilla's pre-CSS3 proprietary rule */
            imgObj.style.MozOpacity = (percentOpacity / 100) - 0.001;
        }
        else if (imgObj.style.opacity != null) {
            imgObj.style.opacity = (percentOpacity / 100) - 0.001;
        }
        else if (imgObj.style.filter != null) {
            imgObj.style.filter = "alpha(opacity=" + percentOpacity + ")";
        }
    }
}

/* *****************************************************
   *             Function slideshowInit()              *
   ***************************************************** */

function slideshowInit() {

    
    if (d.getElementById) {

        mySlideshowPtr = d.getElementById(slideshowId);
        mySlideshowImages = new Array;
        myImageTextObj = d.getElementById(imgTextId);
        mySlideshowImages = mySlideshowPtr.getElementsByTagName("img");




        for (var ctr = 0; ctr < mySlideshowImages.length; ctr++) {
            mySlideshowImages[ctr].style.zIndex = 3;
         
            setOpacity(ctr, 0);
            mySlideshowImages[ctr].style.display = 'block';
            mySlideshowImages[ctr].style.visibility = 'visible';
        }

        currentImage = 0;
        previousImage = mySlideshowImages.length - 1;

        setOpacity(currentImage, 100);

        myImageTextObj.innerHTML = '<p>' + mySlideshowImages[currentImage].alt + '</p>';
        

        prevOpacityPercent = 0;
        curOpacityPercent = 100;

        startSlideshow(); // Start Slide Show Automatically

    }
}

function startSlideshow() {

    crossFadeTimer = window.setTimeout("crossFade()", 500);
    
    
}





function crossFade() {
   
   myImageTextObj.innerHTML = '<p>' + mySlideshowImages[currentImage].alt + '</p>';
   if (curOpacityPercent < 100) {
        prevOpacityPercent -= 10;
        curOpacityPercent += 10;
        setOpacity(previousImage, prevOpacityPercent);
        setOpacity(currentImage, curOpacityPercent);

        crossFadeTimer = window.setTimeout("crossFade()", 25); // Wait duration
    }
    else {
        previousImage = currentImage;
        currentImage++;
        if (currentImage >= mySlideshowImages.length) {
            currentImage = 0;
        }
        prevOpacityPercent = 100;
        curOpacityPercent = 0;
        mySlideshowImages[previousImage].style.zIndex = 3;
        mySlideshowImages[currentImage].style.zIndex = 4;
        crossFadeTimer = window.setTimeout("crossFade()", 2500); // Wait 2.5 seconds
    }
}