function previewPane (ident, array, string) {

	// store the array and identifier in publicly accessible variables
	this.prevArray = array;
	this.identifier = string;
	
	// initiate a position variable to store the place in the array
	this.position = 0;
	
	this.prevBox = document.getElementById(this.identifier);
	
	this.timer;
	this.ident = ident;
	
	
	
	
	
	// preload images in one thread to speed loading of page.
	 function preloadImg (imageSrcArr)
	{
	
		var images = Array();
	
		for (x = 0; x < imageSrcArr.length; x++)
		{
		
			images[x] = new Image();
		
			images[x].src = imageSrcArr[x];
	
	
		}
	}
	
	
	
	
	
	
	// function to display the currently selected information
	function displayResult() {
		
		document.getElementById(this.identifier + "h1").innerHTML = this.prevArray[this.position][0];
		
		document.getElementById(this.identifier + "h2").innerHTML = this.prevArray[this.position][1];
		
		document.getElementById(this.identifier + "h3").innerHTML = this.prevArray[this.position][2] + ",<br /><br />" + this.prevArray[this.position][3];
		
		document.getElementById(this.identifier + "link").href = "event.php?id=" + this.prevArray[this.position][5];
	
		document.getElementById(this.identifier + "img").style.background = "black url(../" + this.prevArray[this.position][4] + ") no-repeat center top";
		
		
	}
	this.displayResult = displayResult;
	
	
	
	
	
	
	
	
	//init function to insert the initial elements
	
	function init() {
	
		// preload images //
		/// sort images from array into separate array for preloading
		var imageArray = Array();
		
		for (var x = 0; x < this.prevArray.length; x++) {
		
			imageArray[x] = this.prevArray[x][4];
		}
		
		/// preload the images.
		preloadImg(imageArray);
	
	
	
		// create elements
		
		//box to put the preview text in
		textdiv = document.createElement('div');
		textdiv.id = this.identifier + "textbox";
		
			//title
			h1 = document.createElement('h1');
			h1.id = this.identifier + "h1";
		
			// description
			h2 = document.createElement('h2');
			h2.id = this.identifier + "h2";
		
			// date and venue
			h3 = document.createElement('h3');
			h3.id = this.identifier + "h3";
		
			// link to description page
			a = document.createElement('a');
			a.id = this.identifier + "link";
			a.innerHTML = "more info";
		
		//box on the background of which the image will be placed
		picdiv = document.createElement('div');
		picdiv.id = this.identifier + "img";
		
		//specify the navigation tools with appropriate onclick specifiers
		nav = document.createElement('h1');
		nav.id = this.identifier + "nav";
		
		nav.innerHTML = "<a href = \"#\" onclick=\"" + this.identifier + ".showPrev(); return false;\"><</a><a href = \"#\" onclick=\"" + this.identifier + ".showNext(); return false;\">></a>";
		
		
		
		
		
		//append elements to the text box
		textdiv.appendChild(h1);
		textdiv.appendChild(h2);
		textdiv.appendChild(h3);
		textdiv.appendChild(a);
		
		//append nav tools to the pic box
		picdiv.appendChild(nav);
		
		//append all elements to whatever element with the id identifier
		this.prevBox.appendChild(textdiv);
		this.prevBox.appendChild(picdiv);
		
		
		
		//display current array position data
		this.displayResult();
		
		this.startTimer();
		
		
	}
	this.init = init;
	
	
	
	
	
	

	
	// Choose next image - if at the end of the array, go to the beginning of the array.
	function showNext()
	{
		
		if ((this.position) == this.prevArray.length - 1)
		{
			this.position = 0;
	
		}
		else
		{
			this.position = this.position + 1;
		}
	
		this.displayResult();	


	}
	this.showNext = showNext;
	
	
	
	
	
	
	
	// Choose previous image - if at the start of the array, go to the end of the array.
	function showPrev()
	{
		
		if ((this.position) == 0)
		{
			this.position = this.prevArray.length - 1;
	
		}
		else
		{
			this.position = this.position - 1;
		}
	
		this.displayResult();	


	}
	this.showPrev = showPrev;
	
	this.startTimer = function () {
	
		this.timer = window.setInterval(this.ident + '.showNext();', 6000);
		
	
	}
	
}