var startVideos;
var contentStart;
var videoSource;
var filmState = 0;

function changeContent(id){
	var ajaxRequest; 
	try{
		// Opera 8.0+, Firefox, Safari
		ajaxRequest = new XMLHttpRequest();
	} catch (e){
		// Internet Explorer Browsers
		try{
			ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");
		} catch (e) {
			try{
				ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");
			} catch (e){
				// Something went wrong
				alert("Your browser broke!");
				return false;
			}
		}
	}
// check if the script is trying to open a video or just simply wipe the area clean (i.e. close it)
if (id != 'close' && id != 'credits'){
	videoSource = eval("video" + id);
	
	// if you have set the relevent video var to 'none' then it will not generate the flash code, instead it will look for the equivilent altVideo var and use that.
	if (videoSource != 'none') {
		contentStart = "<div style=\"height:44px;\"></div><object classid=\"clsid:d27cdb6e-ae6d-11cf-96b8-444553540000\" codebase=\"http:\/\/download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,0,0\" width=\"450\" height=\"282\" id=\"film\" align=\"middle\">	<param name=\"allowScriptAccess\" value=\"sameDomain\" />	<param name=\"flashvars\" value=\"video=http://www.iamguy.co.uk/videos/" + eval("video" + id) + ".flv\" /><param name=\"allowFullScreen\" value=\"true\" />	<param name=\"movie\" value=\"flash/film.swf\" /><param name=\"quality\" value=\"high\" /><param name=\"bgcolor\" value=\"#ffffff\" />	<embed src=\"flash/film.swf\" quality=\"high\" bgcolor=\"#ffffff\" width=\"450\" height=\"282\" name=\"film\" align=\"middle\" allowScriptAccess=\"sameDomain\" allowFullScreen=\"true\" flashvars=\"video=http://www.iamguy.co.uk/videos/" + eval("video" + id) + ".flv\" type=\"application/x-shockwave-flash\" pluginspage=\"http:\/\/www.macromedia.com/go/getflashplayer\" />	</object><p class='title'>";
	} else {
		contentStart = eval("altVideo" + id) + "<p style=\"clear:both\"></p>";
	}
}

// the business end of the script - when the server first responds it loads the loading graphic, then when the server reports the page is fully loaded it changes to show the video.
ajaxRequest.onreadystatechange = function (){
	if (id != 'close' && id != 'credits') {
		if (ajaxRequest.readyState == 1) {
			document.getElementById('rightCol').innerHTML = "<img src='images/loading.gif' alt='loading' style='position:relative; left:164px; top:100px;' />"; // change the position of the loading graphic here.
		}
		if(ajaxRequest.readyState == 4){
			document.getElementById('rightCol').innerHTML = contentStart + "<img class=\"vidTitle\" src=\"images/titles/" + eval("title" + id) + "\" /><p>" + eval("description" + id) + "</p>" + contentEnd;
		}
	} else {
		if (id == 'close') {
			document.getElementById('rightCol').innerHTML = "";
		} else {
			document.getElementById('rightCol').innerHTML = credits;
		}
	}
}
ajaxRequest.open("GET", "index.php", true);
ajaxRequest.send(null); 
}

// function to display more films in the navigation
function moreFilms() {
	if (filmState == 0) {
		document.getElementById('films').innerHTML = "";
		for (var i=1; i <= videos; i++)
			{
			document.getElementById('films').innerHTML = document.getElementById('films').innerHTML + "<a href=\"javascript:changeContent('" + i + "')\">" + eval("strap" + i) + "</a><br />";
			}
		document.getElementById('more').innerHTML = "<a href=\"javascript:moreFilms()\">- less</a>";
		filmState = 1;
	} else {
		document.getElementById('films').innerHTML = "";
		// change 'i <= #' to equal the number of videos you would like to show on initial load
		for (var i=1; i <= 6; i++)
			{
			document.getElementById('films').innerHTML = document.getElementById('films').innerHTML + "<a href=\"javascript:changeContent('" + i + "')\">" + eval("strap" + i) + "</a><br />";
			}
		document.getElementById('more').innerHTML = "<a href=\"javascript:moreFilms()\">+ more</a>";
		filmState = 0;
	}
}

// two alternate closing tags - one includes a cross to let people close the video, the other is blank. Simply uncomment the one you want and make sure the other is commented

//var contentEnd = "</p><p style='float:right;' class='cross'><a href=\"javascript:changeContent('close');\">X</a></p>";
var contentEnd = "";