var imgUrls = [];
var nextImgIndex = 3; // Images before index 3 are not relevant
var prevImgIndex = 2;
var bigImage = null;

function swapImage(url){
	showLoader();
	bigImage.src = url;
	updateIndexes(url);
}

function prevImage(){
  if (prevImgIndex > 2) {
		showLoader();
		bigImage = document.images[1];
		bigImage.src = imgUrls[prevImgIndex];
		nextImgIndex = prevImgIndex + 1;
		prevImgIndex--;
	}
}

function nextImage(){
  if (nextImgIndex < imgUrls.length) {
		showLoader();
		bigImage = document.images[1];
		bigImage.src = imgUrls[nextImgIndex];
		prevImgIndex = nextImgIndex - 1;
		nextImgIndex++;
	}
}

function updateIndexes(url) {
  for (var i=0;i<imgUrls.length;i++) {
    if (url.replace("s72", "s512") + "?imgmax=64&crop=1" == imgUrls[i]) {
      nextImgIndex = i+1;
      prevImgIndex = i-1;
    }
  }
}

function showLoader(){
  var loader = document.getElementById("loader");
  bigImage = document.images[1];
  bigImage.style.visibility = "hidden";
	loader.style.visibility = "visible";
}

function hideLoader(){
	var loader = document.getElementById("loader");
	bigImage = document.images[1];
	bigImage.style.visibility = "visible";
	loader.style.visibility = "hidden";
}

function initImgArray(){
	for (var i = 0; i < document.images.length; i++) {
		imgUrls.push(document.images[i].src.replace("s72", "s512"));
	}
  bigImage = document.images[1];
  bigImage.onload = function(){
		hideLoader();
	};

}