var fullBase;
var tnBase;
var tnImages
var fullImage;
var fullTitle;
var pageTitle;
var tnImages;
var tnTitles;
var fullIx;
var tnIx;
var tnCount;
var eventInfo;
var imageInfo;

function ImageInfo(dir, name, title) {
    this.dir = dir;
    this.name = name;
    this.title = title;
};

function EventInfo(dir, title) {
    this.dir = dir;
    this.title = title;
};

function initImages(full, tn, events, images, fullname) {
  if (!images || !images.length) {
    alert("Empty ImageInfo array, cannot initialise.");
    return;
  }
  eventInfo = events;
  imageInfo = images;
  
  fullBase = full;
  tnBase = tn;
  tnCount = 3;  // Max 3 thumbnails visible

  // Load up thumbnail images
  tnImages = new Array(tnCount+3);  // load some invisible thumbs
  tnTitles = new Array(tnCount);
  for (var i=0; i<tnImages.length; i++) {
      if (i < tnCount) {
         tnImages[i] = getElement('tni'+i);
         tnTitles[i] = getElement('tnt'+i);
      } else {
         tnImages[i] = new Image();
      }
      loadImage(tnBase, imageInfo[i], tnImages[i], tnTitles[i]);
  }
  tnIx = 0;
  showNextPrev();

  // Initially show full version of the first thumbnail
  fullImage = getElement(fullname);
  fullTitle = getElement(fullname+'Title');
  pageTitle = getElement(fullname+'Heading');
  showFullImage(0);
}


function loadImage(base, imInfo, imObj, tiObj) {
    if (imObj) {
        var url = base +imInfo.dir +'/'+imInfo.name;
        imObj.src = url;
        imObj.alt = imInfo.title;
        imObj.name = imInfo.title;
    }
    if (tiObj) {
        tiObj.innerHTML = imInfo.title;
    }
}


function showFullImage(num) {
    var ix = tnIx + num;
    loadImage(fullBase, imageInfo[ix], fullImage, fullTitle);
    for (var i=0; i<eventInfo.length; i++) {
        if (eventInfo[i].dir == imageInfo[ix].dir) {
            pageTitle.innerHTML = eventInfo[i].title;
            break;
        }
    }
}


function scrollNext() {
    if (tnIx + tnCount < imageInfo.length) {
        tnIx += 1;
        for (var i=0; i<tnImages.length; i++) {
            if ((tnIx + i) < imageInfo.length) {
                loadImage(tnBase, imageInfo[tnIx + i], tnImages[i], tnTitles[i]);
            }
        }
        showNextPrev();
    }
}

function scrollPrev() {
    if (tnIx > 0) {
        tnIx -= 1;
        for (var i=0; i<tnImages.length; i++) {
            if ((tnIx + i) < imageInfo.length) {
                loadImage(tnBase, imageInfo[tnIx + i], tnImages[i], tnTitles[i]);
            }
        }
        showNextPrev();
    }
}

function showNextPrev() {
  if (tnIx <= 0) {
    showElement('ScrollPrev', false);
  } else {
    showElement('ScrollPrev', true);
  }
  
  if (tnIx + tnCount >= imageInfo.length) {
    showElement('ScrollNext', false);
  } else {
    showElement('ScrollNext', true);
  }
}


function showElement(id, show) {
  var ele = getElement(id);
  if (show) {
    ele.style.visibility = 'visible';
  } else {
    ele.style.visibility = 'hidden';
  }
  
}

function getElement(id) {
  var ele = document.getElementById(id);
  if (!ele && document.all) {
    ele = document.all[id];
  }
  if (!ele) {
    alert('Unable to get document element:'+id);
  }
  return ele;
}