cycle through images on gallery

// var images = [
//   {source:"http://s24.postimg.org/vb31y1l1h/dotted_pic.jpg", caption:"dotty dotyy"},
//   {source:"http://s7.postimg.org/hjzet1w7v/purple_pic.jpg", caption:"purple purple"},
//   {source:"http://s2.postimg.org/oiepouf9l/gold_pic.jpg", caption:"gold gold"},
//   {source:"http://s17.postimg.org/3q6eww7tb/splashy_pic.jpg", caption:"splashy"}
// ];
var images = [];
var imageIndex = 0;
var $mainImage = $(".thumb-large img");
var $mainCaption = $(".thumb-large-descrip p");
var $thumbnails = $(".thumbnails img");

function showImage(index) {
  $mainImage.attr({src: images[index].source});
  $mainCaption.text(images[index].caption);
}

function findImageIndex(imageSource) {
  for(var i = 0; i < images.length; i += 1) {
    if (images[i].source === imageSource) {
      return i;
    }
  }
  return -1;
}

// Load array with image data from html.
var imageCount = $thumbnails.length;

for(var i = 0; i < imageCount; i += 1) {
  images.push({
    source: $thumbnails[i].src, 
    caption: $thumbnails[i].alt
  });
}

// Show initial image. 
showImage(imageIndex);

// Handle click on thumbnail image.
$(".thumb-image").click(function() {
    imageIndex = findImageIndex($(this).attr("src"));
    showImage(imageIndex);
});

// Handle left arrow click.
$(".left-arrow").click(function() {
  if (imageIndex === 0) {
    imageIndex = images.length -1;
  }
  else {
    imageIndex -= 1;
  }

  showImage(imageIndex);
});

// Handle right arrow click.
$(".right-arrow").click(function() {
  if (imageIndex === images.length -1) {
    imageIndex = 0;
  }
  else {
    imageIndex += 1;
  }

  showImage(imageIndex);
});