var currentImageIndex = 0;

function showPopup(imageIndex, imageID, prevButtonID, nextButtonID)
{
	currentImageIndex = imageIndex;
	document.getElementById(imageID).src = productImages[currentImageIndex];

	enableDisableButtons(prevButtonID, nextButtonID)

	document.getElementById('imagePopup').style.display = 'inline';
}

function closePopup()
{
	document.getElementById('imagePopup').style.display = 'none';
}

function prevImage(imageID, prevButtonID, nextButtonID)
{
	currentImageIndex--;
	document.getElementById(imageID).src = productImages[currentImageIndex];

	enableDisableButtons(prevButtonID, nextButtonID);
}

function nextImage(imageID, prevButtonID, nextButtonID)
{
	currentImageIndex++;
	document.getElementById(imageID).src = productImages[currentImageIndex];

	enableDisableButtons(prevButtonID, nextButtonID);
}

function enableDisableButtons(prevButtonID, nextButtonID)
{
	var prevButton = document.getElementById(prevButtonID);
	var nextButton = document.getElementById(nextButtonID);

	if(currentImageIndex == 0)
		prevButton.style.visibility = 'hidden';
	else
		prevButton.style.visibility = 'visible';

	if(currentImageIndex == (productImages.length - 1))
		nextButton.style.visibility = 'hidden';
	else
		nextButton.style.visibility = 'visible';
}