// slideshow globals

var curSlide = "slide1";  // Current visible slide id
var nextSlide = "1";      // Next visible slide index to gallery array
var slide1Opacity = 0;    // Slide #1 current opacity setting
var slide2Opacity = 0;    // Slide #2 current opacity setting
var opIncrement = 5;      // Opacity change increment %
var maxCycles = 3;        // Maximum number of slideshow cycles (0 = no limit)
var cycleCount = 0;       // Current cycle count
var showObject = null;    // Init slideshow DIV object variable
var s1BoxObject = null;   // Init slide1 DIV object
var s2BoxObject = null;   // Init slide2 DIV object
var s1Object = null;      // Init slide1 object
var s2Object = null;      // Init slide2 object
var t1BoxObject = null;   // Init title1 DIV object
var t2BoxObject = null;   // Init title2 DIV object
var t1Object = null;      // Init title1 object
var t2Object = null;      // Init title2 object
var switchFlag = 0;	  // Switched slides flag
var timeoutID = null;     // ID for timeout handler
var timer = 0;            // Init transition delay timer
var pauseFlag = 0;        // Init pause start/stop flag


// preload images
var myImages = new Array;
  for (i=0;i<gallery.length;i++) {
   myImages[i] = new Image;
   myImages[i].src = gallery[i];  // Comment out this line to avoid pre-loading all image files.
   }


 function startShow() {
   switchFlag = 0;
   timeoutID = null;
   timer = 0;
   pauseFlag = 0;
   cycleCount = 0;
   nextSlide = 1;
   curSlide = "slide1";
   if (document.getElementById) { // no show on very old and some mobile browsers
   showObject = document.getElementById("slideshow");
   showObject.innerHTML = "<div id=\"imageBox1\"></div><div id=\"titleBox1\"></div><div id=\"imageBox2\"></div><div id=\"titleBox2\"></div>";
   s1BoxObject = document.getElementById("imageBox1");
   s2BoxObject = document.getElementById("imageBox2");
   s1BoxObject.innerHTML = "<img src=\"" + gallery[0] + "\" width=\"" + slideWidth + "\" height=\"" + slideHeight + "\" id=\"slide1\">\n";
   s2BoxObject.innerHTML = "<img src=\"" + gallery[1] + "\" width=\"" + slideWidth + "\" height=\"" + slideHeight + "\" id=\"slide2\">\n";
   s1Object = document.getElementById("slide1");
   s2Object = document.getElementById("slide2");
   t1BoxObject = document.getElementById("titleBox1");
   t2BoxObject = document.getElementById("titleBox2");
   t1BoxObject.innerHTML = "<div id=\"title1\"></div>\n";
   t2BoxObject.innerHTML = "<div id=\"title2\"></div>\n";
   t1Object = document.getElementById("titleBox1");
   t2Object = document.getElementById("titleBox2");
   statsBox = document.getElementById("status");
   showObject.style.width = String(slideWidth) + 'px';
   showObject.style.height = String(slideHeight) + 'px';
   s1BoxObject.style.width = String(slideWidth) + 'px';
   s1BoxObject.style.height = String(slideHeight) + 'px';
   s2BoxObject.style.width = String(slideWidth) + 'px';
   s2BoxObject.style.height = String(slideHeight) + 'px';
   s1Object.style.width = String(slideWidth) + 'px';
   s1Object.style.height = String(slideHeight) + 'px';
   s2Object.style.width = String(slideWidth) + 'px';
   s2Object.style.height = String(slideHeight) + 'px';
   slide1Opactity = 100;
   slide2Opactity = 0;
   s1Object.src = gallery[0];		// fetch image file for Slide 1
   if (titles.length > 0) { t1Object.innerHTML = titles[0]; }    // fetch title 1 text
   s2Object.src = gallery[1];		// fetch image file for Slide 2
   if (titles.length > 0) { t2Object.innerHTML = titles[1]; }     // fetch title 2 text
   lightup(s2Object,slide2Opactity);  // initialize 2nd slide opacity first to make it "invisible"
   lightup(t2Object,slide2Opactity);  // initialize 2nd title opacity, too
   lightup(s1Object,slide1Opactity);  // then initialize 1st slide opacity
   lightup(t1Object,slide1Opactity);  // then initialize 1st title opacity
   timeoutID = setTimeout('doIdle()', idleTime * 1000);
   if (showStats) { stats(); } // display variables data
   } // endif (document.getElementById)
 } // end startShow()

function lightup(imageobject, opacity){
 if ((document.getElementById) && !(document.all)) { imageobject.style.opacity=opacity/100; }
 if ((document.getElementById) && (document.all)) { 
	imageobject.style.filter = 'alpha(opacity=' + opacity + ')';
     } // endif IE

} // end lightup()

function doIdle() {
    if (pauseFlag == 0) {                         // Are we paused?
       timeoutID = setTimeout('fader()', delay);  // No! Begin fade/transition
      } else {
       timeoutID = setTimeout('doIdle()', 20);    // Yes! Check here again (soon!)
    } // endif pauseFlag   
 } // end doIdle

function fader() {
    if (pauseFlag == 0) {			  // Are we paused?
     switchFlag = 0;				  // No! Continue processing transition.  Init switchFlag
     if (curSlide == "slide1") {		  // Is Slide 1 Current/Top?
     slide1Opactity -= opIncrement;		  // Yes! Reduce its opacity by opIncrement
     slide2Opactity += opIncrement;		  // Increase Slide 2 opacity by opIncrement
     if (slide1Opactity <= 0) {			  // Is Slide 1 completely transparent?
        curSlide = "slide2";			  // Yes! Switch current slide
        slide1Opactity = 0;			  // Insure legal min opacity 1
        slide2Opactity = 100;			  // Insure legal max opacity 2
        nextSlide++;				  // Bump next slide #
        if (nextSlide == gallery.length) { nextSlide = 0; cycleCount++; }  // Check for start of slide files list
        s1Object.src = gallery[nextSlide];	  // Change source file of Slide 1
	if (titles.length > 0) { t1Object.innerHTML = titles[nextSlide]; }
        switchFlag = 1;				  // Show we switched slides
      } // endif slide1Opactity <= 0
     lightup(s1Object,slide1Opactity);		  // Update Slide 1 opacity on screen
     lightup(t1Object,slide1Opactity);		  // Update Title 1 opacity on screen
     lightup(s2Object,slide2Opactity);		  // Update Slide 2 opacity on screen
     lightup(t2Object,slide2Opactity);		  // Update Title 2 opacity on screen
   } else {					  // Slide 2 is current/top.  Do same for it.
     slide1Opactity += opIncrement;
     slide2Opactity -= opIncrement;
     if (slide2Opactity <= 0) {
        curSlide = "slide1";  			  // Switch current slide
        slide1Opactity = 100;			  // Insure legal max opacity 1
        slide2Opactity = 0;			  // Insure legal min opacity 2
        nextSlide++;				  // Bump next slide #
        if (nextSlide == gallery.length) { nextSlide = 0; cycleCount++; }
        s2Object.src = gallery[nextSlide];
	if (titles.length > 0) { t2Object.innerHTML = titles[nextSlide]; }
        switchFlag = 1;
     } // endif slide2Opactity <= 0
     lightup(s1Object,slide1Opactity);
     lightup(t1Object,slide1Opactity);
     lightup(s2Object,slide2Opactity);
     lightup(t2Object,slide2Opactity);
   } // endif curSlide == "slide2"

   } // endif pauseFlag

   if ((cycleCount < maxCycles) || (maxCycles == 0)) { // Have we completed slideshow cycles?
      if (switchFlag == 0) {			       // No! Check switchFlag
        timeoutID = setTimeout('fader()', delay);      // No switch this time, so keep fading!
          } else {
        timeoutID = setTimeout('doIdle()', idleTime * 1000);  // We switched! Use doIdle() for idleTime setting;
      } // endif switchFlag
    } // endif cycleCount

   if (showStats) { stats(); }				// display variables data

 } // end fader()

  function pauseShow() {
     pauseFlag = 1;
     return true;
   }

  function resumeShow() {
     pauseFlag = 0;
     return true;
  }

    function stats() {
         sMessage = '<p>slide1Opactity = ' + slide1Opactity + '<br>slide2Opactity = ' + slide2Opactity;
         sMessage += '<br>nextSlide = ' + nextSlide;
         sMessage += '<br>cycleCount = ' + cycleCount;
         sMessage += '<\/p>';
         statsBox.innerHTML = sMessage;
      } // end stats()