
// singleton to provide SlideShow private namespace

var SlideShow = SlideShow ? SlideShow : function()
{
    // private vars
    var changeTimer=null;
    var transisitionTimer=null;
    var curImage=0;
    var opacity=100;
    var transitionTimeMs=0;
    var displayTimeMs=0;
    var imgPath="";
    var numImgs=0;      // number of images
    var fadeFPS = 20;   // fade frame rate per second
    var images = [];
    var botImage;
    var topImage;
    var divSlideShow;
    var fadeDelayMs;

    // define private functions
    
    function changeSlide()
    {
        curImage--;
        // if we are at end of slide deck
        if (curImage<0)
        {
            curImage=numImgs-1;   // reset index
	        // reset the starting opacity for fade in
	        opacity=0;
	        // set the top slide to appear
            images[curImage].style.display="inline";
            // start the reset transistion timer - use 20fps frame rate
            transisitionTimer = window.setTimeout("SlideShow._callback('rS')",fadeDelayMs);
        }
        else    // else just go to next slide
        {
            images[curImage].style.display="inline";
	        // reset the starting opacity for next fade out
	        opacity=100;
            // start the transistion timer - use 20fps frame rate
            transisitionTimer = window.setTimeout("SlideShow._callback('fS')",fadeDelayMs);
        }
    }

    // fade current slide to show next slide (background)
    function fadeSlide()
    {	
        // timer is done
	    transisitionTimer = null;
        // apply both IE and non-IE opacity methods
	    images[curImage+1].style.filter="alpha(opacity=" + opacity + ")";
	    images[curImage+1].style.opacity = opacity/100.0;
	    // fade based on transition delay
	    // we want complete transition in transitionTimeMs/1000 seconds
	    // and we see fadeFPS decrements per second
	    // so we want (fadeFPS * transitionTimeMs/1000) total decrements
	    // so each decrement is 100/(fadeFPS * transitionTimeMs/1000)
	    // which is 100000/(fadeFPS * transitionTimeMs)
	    var decr = 100000/(fadeFPS * transitionTimeMs);
	    opacity -= decr;
	    // if we are done
	    if (opacity<=0)
	    {
	        // make it totally invisible
       	    images[curImage+1].style.display="none";
            // start timer for next change
            changeTimer=window.setTimeout("SlideShow._callback('cS')",displayTimeMs)
        }
        else    // continue fade
        {
            // setup for next iteration
            transisitionTimer = window.setTimeout("SlideShow._callback('fS')",fadeDelayMs);
        }
    }

    // resets the slide deck with fade to top slide
    function resetSlides()
    {	
        // timer is done
	    transisitionTimer = null;
        // apply both IE and non-IE opacity methods
	    images[curImage].style.filter="alpha(opacity=" + opacity + ")";
	    images[curImage].style.opacity = opacity/100.0;
	    // fade based on transition delay
	    var incr = 100000/(fadeFPS * transitionTimeMs);
	    opacity += incr;
	    // see if we are done
	    if (opacity>=100)
	    {
	        // bring back all the slides
	        for (var i=0;i<numImgs;i++)
	        {
       	        images[i].style.filter="alpha(opacity=100)";
	            images[i].style.opacity = 1.0;
        	    images[i].style.display="inline";
	        }
            // start timer for next change
            changeTimer=window.setTimeout("SlideShow._callback('cS')",displayTimeMs);
        }
        else    // continue fade
        {
            // setup for next iteration
            transisitionTimer = window.setTimeout("SlideShow._callback('rS')",fadeDelayMs);
        }
    }
    
    function cascadedstyle(el, cssproperty, csspropertyNS)
    {
        if (el.currentStyle) //if IE5+
        {
            return el.currentStyle[cssproperty];
        }
        else if (window.getComputedStyle)	//if NS6+
        {
            var elstyle=window.getComputedStyle(el, "");
            return elstyle.getPropertyValue(csspropertyNS);
        }
    }

    // NOW PUBLIC FUNCTIONS
    var Public = 
    {
        // uses specified img as slideshow space
        // the way it works: we create a stack of N img elements, one for each slide
        // only the top one shows first, then with each slide transition,
        // the topmost visible img goes opaque, until the last (bottom) one is shown.
        // after that, the sequence starts over, by ramping back up the top image opacity
        // to 100, then all other images are reset to 100, and the whole sequence starts over
        makeSlideShow: function(divID,picList,displayTimeSecs,transitionTimeSecs,iPath)
        {
            var div = document.getElementById(divID);

            // get the container div's dimensions
            if (div.style.height=='') height = cascadedstyle(div, "height", "height");
            else height = div.style.height;
            
            if (div.style.width=='') width = cascadedstyle(div, "width", "width");
            else width = div.style.width;

            // stop any timers that were already running
            if (transisitionTimer!=null)
            {
                clearTimeout(transisitionTimer);
                transisitionTimer=null;
            }
            if (changeTimer!=null)
            {
                clearInterval(changeTimer);
                changeTimer=null;
            }
            // create img elements, one for each slide
            numImgs = picList.length;
            for (var i=0;i<numImgs;i++)
            {
                images[i] = document.createElement("img");
                if (i==(numImgs-1)) images[i].style.display="inline";
                else images[i].style.display="none";
                images[i].style.zIndex = i;
                images[i].style.position="absolute"
                images[i].style.top="0px";
                images[i].style.left="0px";
                images[i].style.width=width;
                images[i].style.height=height;
                // we are creating the images in reverse order
                images[i].src=iPath+'/'+picList[(numImgs-i)-1];
                div.appendChild(images[i]);
            }
            
            // init the state vars
            opacity=100;
            // save the div element
            divSlideShow = div;
            // init the image index
            curImage=numImgs-1;
            // save display time
            displayTimeMs=1000*displayTimeSecs;
            // save the transition time in msec
            transitionTimeMs = 1000*transitionTimeSecs;
            // compute fade loop delay
            fadeDelayMs = parseInt(1000/fadeFPS);
            // start the slide change timer
            changeTimer=window.setTimeout("SlideShow._callback('cS')",displayTimeMs);
        },

        //public hook for callbacks
        _callback: function(arg)
        {
            switch (arg)
            {
                case 'cS':
                    changeSlide();
                    break;
                case 'fS':
                    fadeSlide();
                    break;
               case 'rS':
                    resetSlides();
                    break;
            }
        },
        nsVersion: 1    // just an end of array placeholder really
    }
return Public;
}();

