function myreplace(s){
  if (/width=480/.test(s)) s=s.replace(/width=480/g,'width=120');
  else if (/width=120/.test(s)) s = s.replace(/width=120/g, 'width=480');
  s = s.replace(/&/g, '&');
  return s;
}


function swapImage(id) {
    var img1 = new Image();
    var img2 = new Image();
    img1.src = document.getElementById('PICTURE1').src;
    img2.src = document.getElementById('IMG' + id).src;
    document.getElementById('PICTURE1').src = img2.src.replace('width=120', 'width=480');
    document.getElementById('IMG' + id).src = img1.src.replace('width=480', 'width=120');
    imgarray[id - 2] = img1.src.replace('width=480', 'width=120');
}

function showImage(id) {
    var src = document.getElementById('PICTURE' + id).innerHTML;
    document.getElementById('MAINPICTURE').src = myreplace(src);
    imgCounter = id - 1;
    document.getElementById("imageCount").innerHTML = "Showing image " + (imgCounter + 1) + " of " + imgArray.length;
}    

function populateImgArray()
{
	
	var counter = 1;
	//var img = new Image();
	var img;
	for (counter=1;counter<=20;counter++)
	{
		
		if (document.getElementById("PICTURE" + counter) != null) 
		{
		    img = document.getElementById("PICTURE" + counter).innerHTML;
			img = myreplace(img);
			imgArray[counter-1] = img;
		}
		else 
		{
			counter = 20;
		}
	}

	

	document.getElementById("imageCount").innerHTML = "Showing image " + (imgCounter+1) + " of " + imgArray.length;
}


function nextImage()
{
	if (imgArray.length > 0)
	{
		var tempImageSRC;
		var tempMainImageSRC;
		if ((imgCounter + 1) == (imgArray.length))
		{
			alert("You have reached the end of the images");
		}
		else
		{
			imgCounter = (imgCounter + 1);	
			tempImageSRC = imgArray[imgCounter];
			document.getElementById("MAINPICTURE").src = tempImageSRC; 
			document.getElementById("imageCount").innerHTML = "Showing image " + (imgCounter+1) + " of " + imgArray.length;
		}
	}
	else
	{
		alert("No images");
	}
}


function previousImage()
{
	if (imgArray.length > 0)
	{
		var tempImageSRC;
		var tempMainImageSRC;
		if (imgCounter == 0)
		{
			alert("You have reached the start of the images");
		}
		else
		{
			imgCounter = (imgCounter - 1);	
			tempImageSRC = imgArray[imgCounter];
			document.getElementById("MAINPICTURE").src = tempImageSRC; 
			document.getElementById("imageCount").innerHTML = "Showing image " + (imgCounter+1) + " of " + imgArray.length;
		}
	}
	else
	{
		alert("No images");
	}
}

function getImageCount()
{
	return imgArray.length;
}

function getCounter()
{
	return imgCounter;
}