var installs;

function ImageWithCaption(imageURL, captionHTML, thumbCell, moveThumbHighlightingWithinGroup) {
  this.image = new Image();
  this.image.src = imageURL;
  this.captionHTML = captionHTML;  
}

function ImageCollection(moveThumbHighlightingWithinGroup, groupThumbnailCell) {
  this.imageArray = new Array();
  this.position = 0;
  this.moveThumbHighlightingWithinGroup = moveThumbHighlightingWithinGroup;
  this.groupThumbnailCell = groupThumbnailCell;

  this.AddImage = function(imageURL, captionHTML) {
    newCaptionedImage = new ImageWithCaption(imageURL, captionHTML);
    this.imageArray.push(newCaptionedImage);
  } 

  this.LoadImageByIndex = function(targetImageName, targetCaptionName, index) {
    oldPosition = this.position;

    targetImage = document.getElementById(targetImageName);
    this.position = index;
    targetImage.src = this.imageArray[this.position].image.src;

    if (this.moveThumbHighlightingWithinGroup == true) {
      oldThumbnailCell = document.getElementById(oldPosition + "thumbCell");
      oldThumbnailCell.className = "inactiveThumb";
      
      thumbnailCell = document.getElementById(this.position + "thumbCell");
      thumbnailCell.className = "activeThumb";
    } else {
      this.ActivateGroupThumbcell();
    }

    targetText = document.getElementById(targetCaptionName);
    targetText.innerHTML = this.imageArray[this.position].captionHTML;
  }
 
  this.NextImage = function(targetImageName, targetCaptionName) {
    oldPosition = this.position;

    targetImage = document.getElementById(targetImageName);

    if (this.position < this.imageArray.length - 1) {
      this.position = this.position + 1;
      targetImage.src = this.imageArray[this.position].image.src;
    } else {
      this.position = 0;
      targetImage.src = this.imageArray[this.position].image.src;
    }

    if (this.moveThumbHighlightingWithinGroup == true) {
      oldThumbnailCell = document.getElementById(oldPosition + "thumbCell");
      oldThumbnailCell.className = "inactiveThumb";

      thumbnailCell = document.getElementById(this.position + "thumbCell");
      thumbnailCell.className = "activeThumb";
    }

    targetText = document.getElementById(targetCaptionName);
    targetText.innerHTML = this.imageArray[this.position].captionHTML;
  }

  this.PreviousImage = function(targetImageName, targetCaptionName) {
    oldPosition = this.position;

    targetImage = document.getElementById(targetImageName);
    
    if (this.position > 0){
      this.position = this.position - 1;
      targetImage.src = this.imageArray[this.position].image.src;
    } else {
      this.position = this.imageArray.length - 1;
      targetImage.src = this.imageArray[this.position].image.src;
    }
    
    if (this.moveThumbHighlightingWithinGroup == true) {
      oldThumbnailCell = document.getElementById(oldPosition + "thumbCell");
      oldThumbnailCell.className = "inactiveThumb";
      
      thumbnailCell = document.getElementById(this.position + "thumbCell");
      thumbnailCell.className = "activeThumb";
    }

    targetText = document.getElementById(targetCaptionName);
    targetText.innerHTML = this.imageArray[this.position].captionHTML;
  }

  this.DeactivateGroupThumbcell = function() {
    thumbnailCell = document.getElementById(this.groupThumbnailCell);
    thumbnailCell.className = "inactiveThumb";
  }

  this.ActivateGroupThumbcell = function() {
    thumbnailCell = document.getElementById(this.groupThumbnailCell);
    thumbnailCell.className = "activeThumb";
  }
}

function loadInitialCaption(imageName, targetCaptionName, imageCollection) {
targetImage = document.getElementById(imageName);
  targetImage.src = imageCollection.imageArray[0].image.src;

  targetText = document.getElementById(targetCaptionName);
  targetText.innerHTML = imageCollection.imageArray[0].captionHTML;
}

function SwitchActiveGroup(newGroup, targetImageName, targetCaptionName) {
  activeGroup.DeactivateGroupThumbcell();

  activeGroup = newGroup;
  
  activeGroup.LoadImageByIndex(targetImageName, targetCaptionName, 0);
}