var images = new Array("1.jpg","2.jpg","3.jpg","4.jpg","5.jpg","6.jpg","21.jpg","94.jpg","8.jpg"); var descriptions = new Array("Title A|This is the description A","Title B|This is the description B","Title C|This is the description C","Title D|This is the description D","Title E|This is the description E","Title F|This is the description F","Title G|This is the description G","Title H|This is the description H","Title I|This is the description I"); 
/* 
	start the current_pos at 1 because onLoad current_pos would be 0 
	if you change this to zero, and click NEXT, nothing will happen.
*/
var current_pos = 0;

function setDescription(pos)
{
  /*  Get the Description of the image selected  */ 
	var lgimage_desc = document.getElementById("lgimage_desc");
	
	var string = descriptions[pos].split("|");
	var text = "<b>"+ string[0] +"</b><br>\n" + string[1];
	
	lgimage_desc.innerHTML = text;
}


function initiate_gallery( )
{
	/* Get the first 5 images from the images Array */
	for (var x=0; x<5; x++)
	{
		// get each thumbnail
		var tempimage = document.getElementById("image" + (x+1));
		tempimage.src= "photos/photoAlbum/thumbnails/" + images[x];

		// set large image to the 3rd item.
		if (x == 2)	{ set_large_image(x); setDescription(x); }
	}
	
	//getImageArray();
}

function centerImage(clickedImagePos)
{
  /* center the clicked image */
	

	switch(clickedImagePos)
  {
    case 1: current_pos=current_pos-2; break;
		case 2: current_pos=current_pos-1; break;
		case 3: current_pos=current_pos; break;
		case 4: current_pos=current_pos+1; break;
		case 5: current_pos=current_pos+2; break;
  }

  if (current_pos > images.length) {current_pos = current_pos - images.length;}
	else if (current_pos < 0) {current_pos = current_pos + images.length;}
	
	var subcounter = 1;
	for (var x=current_pos; x<current_pos+5; x++)
	{
		var tempimage = document.getElementById("image"+subcounter);
		if (x >= images.length)
		{
			// we have reached the end of the array
			tempimage.src="photos/photoAlbum/thumbnails/" +images[(x - images.length)];
			if (subcounter == 3)	{ set_large_image((x-images.length)); setDescription(x-images.length); }
		}
		else
		{
			tempimage.src="photos/photoAlbum/thumbnails/" +images[x];
			if (subcounter == 3)  { set_large_image(x); setDescription(x);}
		}

		subcounter++;
  }
	
	//getImageArray();
}

function set_large_image(position)
{
	var largeimage = document.getElementById("lgimage");
	largeimage.src= "photos/photoAlbum/" + images[position];	
}

function next_image()
{	
	if (current_pos == 8)  current_pos = 0;
	else  ++current_pos;
	
	
	// Move all the images to the left.
	var subcounter = 1;
	for (var x=current_pos; x<current_pos+5; x++)
	{
		var tempimage = document.getElementById("image"+subcounter);
		if (x >= images.length)
		{
			// we have reached the end of the array
			tempimage.src="photos/photoAlbum/thumbnails/" +images[(x - images.length)];
			if (subcounter == 3)	{ set_large_image((x-images.length)); setDescription(x-images.length); }
		}
		else
		{
			tempimage.src="photos/photoAlbum/thumbnails/" +images[x];
			if (subcounter == 3)  { set_large_image(x); setDescription(x);}
		}

		subcounter++;
	}
	//getImageArray();
}

function prev_image()
{

	if (current_pos == 0) current_pos = 8;
	else --current_pos;	
	
	// move all images to the right.
	var subcounter = 1; 
	for (var x=current_pos; x <= current_pos+4; x++)
	{
		var tempimage = document.getElementById("image"+subcounter);
		if (x < 0)
		{
			// we have reached the end of the array
			tempimage.src="photos/photoAlbum/thumbnails/" +images[(images.length + x)];
			if (subcounter == 3) {set_large_image((images.length +x)); setDescription(images.length +x);}
		}
		else if (x >= images.length)
		{
			// we have reached the end of the array
			tempimage.src="photos/photoAlbum/thumbnails/" +images[(x - images.length)];
			if (subcounter == 3)	{ set_large_image((x-images.length)); setDescription(x-images.length); }
		}			
		else
		{
			tempimage.src="photos/photoAlbum/thumbnails/" +images[x];
			if (subcounter == 3) {set_large_image(x); setDescription(x);}
		}

		subcounter++;
	}
	//getImageArray();
}

function getImageArray()
{
	// Display Image src of the images showing.
	 var displayimage = document.getElementById("output");
	 var image1 = document.getElementById("image1");
 	 var image2 = document.getElementById("image2");
	 var image3 = document.getElementById("image3");
	 var image4 = document.getElementById("image4");
	 var image5 = document.getElementById("image5");

   var text;
	 text = "image 1: " + image1.src + " ( "+(current_pos)+" )<br>";
	 
	 if (current_pos+1 >= images.length) text +="image 2: " + image2.src + " ( "+(current_pos+1-images.length)+" )<br>";
	 else text +="image 2: " + image2.src + " ( "+(current_pos+1)+" )<br>";
	 
	 if (current_pos+2 >= images.length) text +="<span style='font-weight:bold'>image 3: " + image3.src + "</span> ( "+(current_pos+2-images.length)+" )<br>";
   else text +="<span style='font-weight:bold'>image 3: " + image3.src + "</span> ( "+(current_pos+2)+" )<br>";

	 if (current_pos+3 >= images.length) text +="image 4: " + image4.src + " ( "+(current_pos +3-images.length)+" )<br>";
   else text +="image 4: " + image4.src + " ( "+(current_pos +3)+" )<br>";
   
	 if (current_pos+4 >= images.length) text +="image 4: " + image4.src + " ( "+(current_pos +4-images.length)+" )<br>";
	 else text +="image 5: " + image5.src + " ( "+(current_pos +4)+" )<br>";
	 

   displayimage.innerHTML = text;
}