// ---- imagefader.js
/*
Author: Chris Jackson
Date: 5/12/2008
Description: Script loops through xml file, switching through images with a fade between
Structure: fadeImageOut() -> swithImage() -> fadeImageIn() -> fadeImageOut(), etc
Dependencies: /includes/_jQuery/_Library/jquery.1.2.js
*/

/*
Author: Chris Jackson
Date: 5/12/2008
Last Updated: 8/11/2008
* Update to preloadarray made page load weight less by only loading 5 images off the bat, then
loading another image each time one of the cached images is shown.
Description: Script loops through xml file, switching through images with a fade between
Structure: fadeImageOut() -> swithImage() -> fadeImageIn() -> fadeImageOut(), etc
Dependencies: /includes/_jQuery/_Library/jquery.1.2.js
*/

/***********************************
Global settings
/***********************************/ 

var opacity = 100; // Opacity
var opacityDec = 10; // Amount opacity changes by
var interval = 40; // Time between opacity change
var holdTime = 3000; // Time to hold image before switching
var imgXmlSrc2 = "/data-center/_includes/dcTour.xml";  // XML file location
var photoImgId2 = 'photoimg2'; // ID of image to swap
var imageWidth = 461;
var imageHeight = 260;

var imgFileName2, imgAltText2;

var imgIndex = 0;
var theimg2, initialImg2;
var initialImgArray2 = new Array();
//var $ = jQuery.noConflict();
var imgArray2 = new Array();
var imgPreloadArray2 = new Array();

$(document).ready(function () {
  if (document.getElementById(photoImgId2)) {
    theimg2 = document.getElementById(photoImgId2);
    // Store initial image, which is picked randomly
    initialImg2 = theimg2.src;
    // Start first fade, after initial hold time
    setTimeout("fadeImageOut()", holdTime);
    $.ajax({
      url: imgXmlSrc2,
      dataType: "xml",
      success: function (xml) {
        $('images', xml).each(function () {
          $('image', this).each(function () {
            // Loop through each image, adding to multidimensional array
            imgFileName2 = '/data-center/_images/_dcTour/' + $('img_filename', this).text();
            imgAltText2 = $('img_alt', this).text();
            // If it is the same as the initial image, don't add, we'll add it to the end later
            if (initialImg2.indexOf(imgFileName2) == -1) {
              imgArray2.push(Array(imgFileName2, imgAltText2));
            } else {
              initialImgArray2 = Array(imgFileName2, imgAltText2);
            }
            /*					if (document.images) {
            imgPreloadArray2[preloadIndex] = new Image(175,75);
            imgPreloadArray2[preloadIndex].src = imgFileName2;
            preloadIndex++;
            }
            */
          });
          // Add initial image to end of the array
          imgArray2.push(initialImgArray2);
        });
        // Preload Image
        initialPreload();
      }
    });
  }
});

var preloadIndex = 3;

function initialPreload() {
  for (var i = 0; i <= 4; i++) {
    imgPreloadArray2[i] = new Image(imageWidth, imageHeight);
    imgPreloadArray2[i].src = imgArray2[i][0];
  }
}

function preloadImages() {
  if ((preloadIndex - 1) <= imgArray2.length) {
    preloadIndex++;
    imgPreloadArray2[preloadIndex] = new Image(imageWidth, imageHeight);
    imgPreloadArray2[preloadIndex].src = imgArray2[preloadIndex][0];
  }
}


function switchImage() {
  // Switch image, setting alt text
  theimg2.src = imgArray2[imgIndex][0];
  theimg2.alt = imgArray2[imgIndex][1];
  // If at end of count, restart, otherwise increment
  if (imgIndex == (imgArray2.length - 1)) {
    imgIndex = 0;
  } else {
    imgIndex++;
  }
  // Image switched, fade it in
  fadeImageIn();
  // Preload next image
  preloadImages();
}

function fadeImageOut() {
  // Fail gracefully
  try {
    // Fade image until it is completely faded out
    if (opacity >= opacityDec) {
      opacity -= opacityDec;
      setOpacity(theimg2, opacity);
      // Fade again after interval
      setTimeout("fadeImageOut()", interval);
    } else {
      // Image is completely faded, switch it
      switchImage();
    }
  } catch (err) {
  }
}

function fadeImageIn() {
  // Fade image in until it hits 100
  if (opacity <= (100 - opacityDec)) {
    opacity += opacityDec;
    setOpacity(theimg2, opacity);
    // Fade again after interval
    setTimeout("fadeImageIn()", interval);
  } else {
    // Image faded in, hold for set time, then call fade out
    setTimeout("fadeImageOut()", holdTime);
  }
}

// Generic function, sets opacity using browser specific markup
function setOpacity(obj, opacity) {
  opacity = (opacity == 100) ? 99.999 : opacity;

  // IE/Win
  obj.style.filter = "alpha(opacity:" + opacity + ")";

  // Safari<1.2, Konqueror
  obj.style.KHTMLOpacity = opacity / 100;

  // Older Mozilla and Firefox
  obj.style.MozOpacity = opacity / 100;

  // Safari 1.2, newer Firefox and Mozilla, CSS3
  obj.style.opacity = opacity / 100;
}
