// JavaScript Document

var imgIndex = 0;
var images = new Array ();
var captions = new Array ();
var numbers = new Array ();

/*%%%%%%%%%%%%*/

function getObjectByID(id) {
  // Cross-browser function to return the object with the specific id
  if (document.all) { // IE
    return document.all[id];
  } else { // Netscape
    return document.getElementById(id);
  }
}

/*%%%%%%%%%%%%*/

function setImage(index) {
  getObjectByID('project-image').src = images[index];
  getObjectByID('image-caption').innerHTML = captions[index];
  imgIndex = index;
  refreshNav();
}

/*%%%%%%%%%%%%*/

function nextImage() {
  if (imgIndex >= images.length - 1) {
    imgIndex = 0;
    setImage(imgIndex);
  } else {
    imgIndex += 1;
    setImage(imgIndex);
  }
}

/*%%%%%%%%%%%%*/

function prevImage() {
  if (imgIndex <= 0) {
    imgIndex = images.length -1;
    setImage(imgIndex);
  } else {
    imgIndex += -1;
    setImage(imgIndex);
  }
}

/*%%%%%%%%%%%%*/

function addImage(imgPath, imgCaption) {
  var len = images.length;
  images[len] = imgPath;
  captions[len] = imgCaption;
  numbers[len] = len + 1;
}

/*%%%%%%%%%%%%*/

function refreshNav() {
  var navString = '\n';
  var i;

  for (i = 0; i < images.length; i++) {
    if (i>0) {navString += ' '}
    if (i == imgIndex) {
      navString += '<li>' + '<span style="text-decoration:overline">0' + numbers[i].toString() + '</span>.' + '</li>\n';
    } else { // Make all other numbers links
      navString += '<li><a href="javascript:void(setImage(' + i + '));">' + '0' + numbers[i].toString() + '.' + '</a></li>\n';
    }
  }
  getObjectByID('image-nav').innerHTML = navString;
}
