var FadeDurationMS=1000; 
function SetOpacity(object,opacityPct) { 
  // IE. 
  object.style.filter = 'alpha(opacity=' + opacityPct + ')'; 
  // Old mozilla and firefox 
  object.style.MozOpacity = opacityPct/100; 
  // Everything else. 
  object.style.opacity = opacityPct/100; 
}
function ChangeOpacity(msDuration,msStart,fromO,toO) {
  var element=document.getElementById(pictureID); 
  var msNow = (new Date()).getTime(); 
  var opacity = fromO + (toO - fromO) * (msNow - msStart) / msDuration; 
  if (opacity>=100) { 
    SetOpacity(element,100); 
    element.timer = undefined; 
  } 
  else if (opacity<=0) { 
    SetOpacity(element,0); 
    element.timer = undefined; 
  } 
  else { 
    SetOpacity(element,opacity); 
    element.timer = window.setTimeout("ChangeOpacity(" + msDuration + "," + msStart + "," + fromO + "," + toO + ")",10); 
  }
} 
function FadeInImage(newImage,direction) {
  var thisItem = new Array;
  var posiArray = new Array;
  var foreground=document.getElementById(pictureID);
  if (foreground.timer) window.clearTimeout(foreground.timer);
  if (backgroundID) {
    var background=document.getElementById(backgroundID);
    if (background) {
      if (background.src) {
        foreground.src = background.src;
        if(direction == 'previous') {
          if(slidePos == listItems.length - 1) {
            thisItem = listItems[0];
            posiArray = thisItem.getElementsByTagName('span')[0].innerHTML.split(" ");
          }
          else {
            thisItem = listItems[slidePos + 1];
            posiArray = thisItem.getElementsByTagName('span')[0].innerHTML.split(" ");
          }
        }
        else {
          if(slidePos > 0) {
            thisItem = listItems[slidePos - 1];
            posiArray = thisItem.getElementsByTagName('span')[0].innerHTML.split(" ");
          }
          else {
            thisItem = listItems[listItems.length - 1];
            posiArray = thisItem.getElementsByTagName('span')[0].innerHTML.split(" ");
          }
        }
        foreground.style.borderTop = posiArray[0]+" solid " + fillColour;
        foreground.style.borderLeft = posiArray[1]+" solid " + fillColour;
        foreground.style.borderBottom = posiArray[2]+" solid " + fillColour;
        foreground.style.borderRight = posiArray[3]+" solid " + fillColour;
        SetOpacity(foreground,100);
      }
      background.src = 'data/' + gallery + '/' + newImage;
      background.style.backgroundColor = fillColour;
      background.style.backgroundImage = 'url(' + 'data/' + gallery + '/' + newImage + ')'; 
      background.style.backgroundRepeat = 'no-repeat';
      thisItem = listItems[slidePos];
      var backPosCache = thisItem.getElementsByTagName('span')[0].innerHTML.split(" ");
      var positionStr = backPosCache[1] + ' ' + backPosCache[0];
      background.style.backgroundPosition = positionStr;
      var startMS = (new Date()).getTime(); 
      foreground.timer = window.setTimeout("ChangeOpacity(" + FadeDurationMS + "," + startMS + ",100,0)",10); 
    } 
  } 
  else {
    foreground.src = 'data/' + gallery + '/' + newImage; 
  } 
}

function changeDuration() {
  if(Duration == 0) {
    prevDuration = document.form.duration.options[document.form.duration.selectedIndex].value;
  }
  else {
    Duration = document.form.duration.options[document.form.duration.selectedIndex].value;
  }
}

function pauseSlideShow() {
  if(slidePos != listItems.length) {
    if(Duration == 0) {
      if(lastImage > 0) {
        restartSlideShow();
      }
      else {
        document.getElementById('playpause').innerHTML = 'Play&nbsp;|&nbsp;<a href="javascript:pauseSlideShow();" class=red>Pause</a>';
        Duration = prevDuration;
        for (i = 0; i < document.form.duration.options.length; i++){
          if(document.form.duration.options[i].value == prevDuration) {
            document.form.duration.selectedIndex = i;
          }
        }
        slidePos++;
        document.form.duration.disabled = true;
        RunSlideShow();
      }
    }
    else {
      clearTimeout(timerID);
      prevDuration = Duration;
      Duration = 0;
      document.form.duration.disabled = false;
      //if(slidePos == listItems.length - 1) {
      if(lastImage > 0) {
        document.getElementById('playpause').innerHTML = '<a href="javascript:restartSlideShow();" class=red>Play</a>&nbsp;|&nbsp;Pause';
        document.getElementById('image_step').innerHTML = imageNav();
      }
      else {
        slidePos--;
        document.getElementById('playpause').innerHTML = '<a href="javascript:pauseSlideShow();" class=red>Play</a>&nbsp;|&nbsp;Pause';
        document.getElementById('image_step').innerHTML = imageNav();
      }
    }
  }
}

function stepPrevious() {
  slidePos--;
  if(slidePos != listItems.length - 1) {document.getElementById('playpause').innerHTML = '<a href="javascript:pauseSlideShow();" class=red>Play</a>&nbsp;|&nbsp;Pause';}
  document.getElementById('image_step').innerHTML = imageNav();
  var thisItem = listItems[slidePos];
  var nextImage = thisItem.getElementsByTagName('h6')[0].innerHTML;
  FadeInImage(nextImage,'previous');
  DisplayMeta(thisItem);
  // Cache the next image to improve performance.
  if(slidePos > 1) {
    thisItem = listItems[slidePos - 2];
    nextImage = thisItem.getElementsByTagName('h6')[0].innerHTML;
    if (slideCache[nextImage] == null) { 
      slideCache[nextImage] = new Image; slideCache[nextImage].src = 'data/' + gallery + '/' + nextImage;
    }
  }
}

function stepNext() {
  slidePos++;
  if(slidePos == listItems.length - 1) {document.getElementById('playpause').innerHTML = '<a href="javascript:restartSlideShow();" class=red>Play</a>&nbsp;|&nbsp;Pause';}
  document.getElementById('image_step').innerHTML = imageNav();
  var thisItem = listItems[slidePos];
  var nextImage = thisItem.getElementsByTagName('h6')[0].innerHTML;
  FadeInImage(nextImage,'next');
  DisplayMeta(thisItem);
  // Cache the next image to improve performance.
  if(slidePos < listItems.length - 1) {
    thisItem = listItems[slidePos + 1];
    nextImage = thisItem.getElementsByTagName('h6')[0].innerHTML;
    if (slideCache[nextImage] == null) { 
      slideCache[nextImage] = new Image; slideCache[nextImage].src = 'data/' + gallery + '/' + nextImage;
    }
  }
}

function restartSlideShow() {
  slidePos = 0;
  Duration = document.form.duration.options[document.form.duration.selectedIndex].value;
  document.getElementById('playpause').innerHTML = 'Play&nbsp;|&nbsp;<a href="javascript:pauseSlideShow();" class=red>Pause</a>';
  document.form.duration.disabled = true;
  RunSlideShow();
}

function imageNav() {
  if(Duration == 0) {
    if(slidePos == 0) {
      var image_step = ' | Previous | <a href="javascript:stepNext();" class=red>Next</a>';
    }
    else {
      if(slidePos == listItems.length - 1) {
        var image_step = ' | <a href="javascript:stepPrevious();" class=red>Previous</a> | Next';
      }
      else {
        var image_step = ' | <a href="javascript:stepPrevious();" class=red>Previous</a> | <a href="javascript:stepNext();" class=red>Next</a>';
      }
    }
  }
  else {
    var image_step = '';
  }
  return image_step;
}

function DisplayMeta(thisItem) {
  document.getElementById('info').innerHTML = thisItem.getElementsByTagName('p')[0].innerHTML;
  var detailStr = thisItem.getElementsByTagName('h3')[0].innerHTML;
  detailStr = '<b>' + detailStr + '</b><br><br>' + thisItem.getElementsByTagName('h4')[0].innerHTML;
  detailStr = detailStr + '<br>' + thisItem.getElementsByTagName('h5')[0].innerHTML;
  document.getElementById('detail').innerHTML = detailStr;
}

var fillColour = '#FFFFFF';
var pictureID = '';
var backgroundID = '';
var slideList = 0;
var listItems = '';
var slideCache = new Array();
var posArray = new Array();
var slidePos = 0;
var lastImage = 0
var looping = 1;
var timerID = 0;
var Duration = 0;
var prevDuration = 0;
var gallery = '';

function StartSlideShow(picture,picbackground,image) {
  gallery = 'gallery' + document.form.galleryID.value;
  pictureID = picture;
  backgroundID = picbackground;
  prevDuration = document.form.duration.options[document.form.duration.selectedIndex].value;
  Duration = prevDuration;
  document.form.duration.disabled = true;
  slideList = document.getElementById('slidelist');
  listItems = slideList.getElementsByTagName('li');
  if(image === undefined) {
    var thisItem = listItems[0];
  }
  else {
    if(image > listItems.length) {image = listItems.length;}
    slidePos = image - 1;
    Duration = 0;
    document.form.duration.disabled = false;
    if(image == listItems.length) {
      document.getElementById('playpause').innerHTML = '<a href="javascript:restartSlideShow();" class=red>Play</a>&nbsp;|&nbsp;Pause';
    }
    else {
      document.getElementById('playpause').innerHTML = '<a href="javascript:pauseSlideShow();" class=red>Play</a>&nbsp;|&nbsp;Pause';
    }
    var thisItem = listItems[slidePos];
  }
  document.getElementById('image_step').innerHTML = imageNav();
  var firstImage = thisItem.getElementsByTagName('h6')[0].innerHTML;
  var firstStyle = thisItem.getElementsByTagName('span')[0].innerHTML;
  posArray = firstStyle.split(" ");
  var foreground = document.getElementById(pictureID);
  foreground.src = 'data/' + gallery + '/' + firstImage;
  foreground.style.borderTop = posArray[0]+" solid " + fillColour;
  foreground.style.borderLeft = posArray[1]+" solid " + fillColour;
  foreground.style.borderBottom = posArray[2]+" solid " + fillColour;
  foreground.style.borderRight = posArray[3]+" solid " + fillColour;
  RunSlideShow();
}

function RunSlideShow() {
  document.getElementById('image_step').innerHTML = imageNav();
  if(Duration > 0) {
    var thisItem = listItems[slidePos];
    var nextImage = thisItem.getElementsByTagName('h6')[0].innerHTML;
    FadeInImage(nextImage,'next');
    DisplayMeta(thisItem);
    timerID = setTimeout("RunSlideShow()",Duration*1000);
    if(slidePos < listItems.length - 1) {
      lastImage = 0;
      slidePos++;
      // Cache the next image to improve performance.
      thisItem = listItems[slidePos];
      nextImage = thisItem.getElementsByTagName('h6')[0].innerHTML;
      if (slideCache[nextImage] == null) { 
        slideCache[nextImage] = new Image; slideCache[nextImage].src = 'data/' + gallery + '/' + nextImage;
      }
    }
    else {
      //slidePos = listItems.length - 1;
      lastImage = 1;
      if(looping > 0) {
        clearTimeout(timerID);
        timerID = setTimeout("restartSlideShow()",Duration*1000);
      }
      else {
        Duration = 0;
        document.form.duration.disabled = false;
        document.getElementById('playpause').innerHTML = '<a href="javascript:restartSlideShow();" class=red>Play</a>&nbsp;|&nbsp;Pause';
        document.getElementById('image_step').innerHTML = imageNav();
      }
    }
  }
  
}
