window.onload = init;

	var pix = new Array(6);
	pix[0] = ["xmas1.png", "xmas2.png", "xmas3.png", "xmas4.png", "xmas5.png", "coney7.png", "xmas1.jpg", "enormous festive decorations near 5th Avenue and a cold blue sky"]
	pix[1] = ["empire1.png", "empire2.png", "empire3.png", "empire4.png", "empire5.png", "empire6.png", "empire1.jpg", "gold spires, seen from what  ought still to be the world's tallest building"]
	pix[2] = ["chopper1.png", "chopper2.png", "chopper3.png", "chopper4.png", "chopper5.png", "chopper6.png", "chopper1.jpg", "from an exhilarating helicopter ride around the bay - look, it\'s an aircraft carrier..."]
	pix[3] = ["coney1.png", "coney2.png", "coney3.png", "coney4.png", "coney5.png", "coney6.png", "coney1.jpg", "the scary carney at Coney Island, enormous rottweilers not pictured"]
	pix[4] = ["grabbag1.png", "grabbag2.png", "grabbag3.png", "grabbag4.png", "grabbag5.png", "grabbag6.png", "grabbag1.jpg", "the nemos on tour, fatness and oddness abound"]
	pix[5] = ["street1.png", "street2.png", "street3.png", "street4.png", "street5.png", "street6.png", "street1.jpg", "those dark canyons..."]

function init()
{
	// image preloading for first main images

	var imageObj = new Image();  			 // create object

	var preloader = new Array(6);
	preloader[0] = ["xmas1.jpg"];
	preloader[1] = ["empire1.jpg"];
	preloader[2] = ["chopper1.jpg"];
	preloader[3] = ["coney1.jpg"];
	preloader[4] = ["grabbag1.jpg"];
	preloader[5] = ["street1.jpg"];

	for(var i=0; i<=6; i++)
		{imageObj.src=('resources/images/photos/' + preloader[i]);}

	var categs = document.getElementById('categories').getElementsByTagName('li');
	var thumbs = document.getElementById('thumbnails').getElementsByTagName('img');
	var mainimg = document.getElementById('main');

	fadeIn(mainimg, 0);									// initiate fading set of functions

	var z = categs.length-1
	for(var i=z; i>=0; i--)
		{
		categs[i].counter = i;
		categs[i].onclick = swap;						// assigns swap function to each category
		}

	var z = thumbs.length-1
	for(var i=z; i>=0; i--)
		{thumbs[i].onclick = Mainswap;}					// assigns Mainswap function to each thumbnail
}

function swap()											// first array needs variable of category; nested array is number of thumb or photo
{
	var x = this.counter;

	var cappara = document.getElementById('caption');
	var captext = document.createTextNode(pix[x][7]);
	cappara.removeChild(cappara.lastChild);
	cappara.appendChild(captext);

	var mainimg = document.getElementById('main');
	fadeIn(mainimg, 0);									// initiate fading set of functions

	mainimg.src = ('resources/images/photos/' + pix[x][6]);		// set Main image src to sixth part of array

	var thumbs = document.getElementById('thumbnails').getElementsByTagName('img');
	var z = thumbs.length-1
	for(var i=z; i>=0; i--)
		{thumbs[i].src = ('resources/images/thumbs/' + pix[x][i]);}

	this.className = 'seen';							 // sets link's class to 'seen', for a:visited equivalent
}

function Mainswap()
{
	var imgpath = this.src.replace(/png/,'jpg').replace(/thumbs/, 'photos');		// reg exp messes with path to find appropriate fullsize image

	var mainimg = document.getElementById('main');
	fadeIn(mainimg, 0);									// initiate fading set of functions

	mainimg.src = imgpath;
}

function fadeIn(mainimg,opacity)						// Repeatedly calls the setOpacity function, increasing opacity by 5% until full
{
	if (opacity <= 99.999)
		{
		setOpacity(mainimg, opacity);
		opacity += 5;
		var fader = setTimeout(function(){fadeIn(mainimg, opacity)}, 50);
		}
}

function setOpacity(mainimg, opacity)
{
	  // IE/Win
	  mainimg.style.filter = "alpha(opacity:"+opacity+")";

	  // Safari<1.2, Konqueror
	  mainimg.style.KHTMLOpacity = opacity/100;

	  // Older Mozilla and Firefox
	  mainimg.style.MozOpacity = opacity/100;

	  // Safari 1.2, newer Firefox and Mozilla, CSS3
	  mainimg.style.opacity = opacity/100;
}