// FlipFade image fade script for Otter Nurseries website
// Author: Richard Adams

// Note: When adding new images make sure they're added to the preload list below,

// Preload images to avoid flickering etc.
if (document.images) {
  picp1 = new Image();
  picp1.src='images/NavBar/Nav_Plants_01.jpg';
  picp2 = new Image();
  picp2.src='images/NavBar/Nav_Plants_02.jpg';

  pich1 = new Image();
  pich1.src='images/NavBar/Nav_Home_01.jpg';
  pich2 = new Image();
  pich2.src='images/NavBar/Nav_Home_02.jpg';

  pico1 = new Image();
  pico1.src='images/NavBar/Nav_Outdoor_01.jpg';
  pico2 = new Image();
  pico2.src='images/NavBar/Nav_Outdoor_02.jpg';

  pict1 = new Image();
  pict1.src='images/NavBar/Nav_Treat_01.jpg';
  pict2 = new Image();
  pict2.src='images/NavBar/Nav_Treat_02.jpg';

  pics1 = new Image();
  pics1.src='images/NavBar/Nav_Shopper_01.jpg';
  pics2 = new Image();
  pics2.src='images/NavBar/Nav_Shopper_02.jpg';
}

// Configuration variables
var maxImg = 2; // Number of images per section
var cycleDelay = 4 * 1000; // Delay between fades in (mili)seconds
var opStep = 5; // Opactity step in 100ths
var opDelay = 75; // Fade delay per step, ((100 / opStep) * opDelay) MUST be reasonably lower than cycleDelay
var navImages = new Array('Plants', 'Treat', 'Outdoor', 'Shopper', 'Home'); // Specifies sections and order of fades (1, 4, 2, 5, 3)

// Internal variables
var opCurrent = 0;
var imgcount = 0;
var currentimg = new Array();
var fadeObject = '';

for (var i=0; i<navImages.length; i++) { currentimg[navImages[i]] = 1 }

function cycleImages() {
imgfade(navImages[imgcount]);
imgcount++;
if (imgcount >= navImages.length) { imgcount = 0 }
setTimeout('cycleImages()', cycleDelay)
}

function imgfade(section) {
if (document.getElementById) { fadeObject = document.getElementById('img'+section); var ebg = document.getElementById('bg'+section); }
if (!fadeObject) { return }
currentimg[section]++;
if (currentimg[section] > maxImg) { currentimg[section] = 1 }
var imgsrc = 'images/NavBar/Nav_'+section+'_0'+currentimg[section]+'.jpg';

// Set background to src of current (foreground) image
ebg.style.backgroundImage = 'url('+fadeObject.src+')';

// Set opacity of image to zero
changeOpacity(0);

// Change src of image
fadeObject.src = imgsrc;

// Fade image in
setTimeout('doFade()', opDelay * 5);
}

function doFade() {
if (opCurrent<=100) {
  changeOpacity(opCurrent);
  opCurrent += opStep;
  setTimeout('doFade()', opDelay);
  }
else { opCurrent = 0 }
}

function changeOpacity(opacity) {
fadeObject.style.opacity = (opacity / 100);
fadeObject.style.MozOpacity = (opacity / 100);
fadeObject.style.KhtmlOpacity = (opacity / 100);
fadeObject.style.filter = "alpha(opacity=" + opacity + ")";
}