var image_array = new Array(

    "1.jpg",

    "2.jpg",

    "3.jpg",

    "4.jpg",

    "5.jpg",

    "6.jpg",

	"7.jpg",

	"8.jpg",

    "9.jpg",

    "10.jpg",

    "11.jpg",

    "13.jpg",

    "14.jpg",

	"15.jpg",

    "16.jpg",

    "17.jpg",

    "18.jpg",

    "19.jpg",

    "20.jpg",

	"21.jpg",

	"22.jpg",

    "23.jpg",

    "24.jpg",

    "25.jpg",

    "26.jpg",

    "27.jpg",

	"28.jpg",

    "29.jpg",

    "30.jpg"

); // List all image files in this array



var image_dir = "gallery/"; // Place all images in this directory;



var total_images = image_array.length;

var images_per_page = 9;

var total_pages = total_images/images_per_page;



if (document.images) {

	var i;

	image_preload = new Array();

	for (i = 0; i < total_images; i++) {

	    image_preload[i] = new Image();

		image_preload[i].src = "" + image_dir + image_array[i];

	}

}



var image_id = "image";

var gallery_id = "gallery";



var thumb_width = 65;

var thumb_height =55;



function switchImage(image_index) {

	document.getElementById(image_id).innerHTML = "<img src=\"" + image_dir + image_array[image_index] + "\"/>";

}



function writeThumbnail(image_index) {

	var returnstring = "";

	returnstring += "<td class=\"image-thumb\">";

	returnstring += "<a href=\"javascript:switchImage(" + image_index + ")\">";

	returnstring += "<img src=\"" + image_dir + image_array[image_index] + 

	        "\" width=\"" + thumb_width + "\" height=\"" + thumb_height + "\"/>";

	returnstring += "</a></td>";

	return returnstring;

}



function writeGallery(page_index) {

	var page = 0;

	var image = 0;

	var image_index = 0;

	var returnstring = "<table cellpadding=\"0\" cellspacing=\"0\" border=\"0\">";

	while (page < page_index) {

		image_index += images_per_page;

		page++;

	}

	returnstring += "<tr>";

	for (image = 0; image < images_per_page; image++) {

		if (image_index + image < total_images) {

		    returnstring += writeThumbnail(image_index + image);

		} else {

			returnstring += "<td class=\"image-thumb\">&nbsp;</td>";

		}

		if ((image%3) == 2) {

			returnstring += "</tr><tr>";

		}

	}

	while (image < images_per_page) {

		returnstring += "<td></td>";

		if ((image%3) == 2) {

			returnstring += "</tr>";

		}

		image++;

	}

	returnstring += "</tr><tr><td colspan=\"3\">";

	for (page = 0; page < total_pages; page++) {

	    returnstring += "<a href=\"javascript:writeGallery(" + page + ")\">" + (parseInt(page)+1) + "</a> ";

	}

	returnstring += "</td></tr></table>";

	document.getElementById(gallery_id).innerHTML = returnstring;

}