var Portfolio = {

	/*	Multi Carousel Portfolio Slideshow with image preloader and AJAX details loader
			image preloader for smoother thumbnails
			AJAX enables loading the large images only on demand
			jQuery for pop-up layer transition
			Martin Latter 20 Nov 2009 */

	itemArr : [
		// separate image directory /urls/ added in second brief - not what was first intended
		[ // 0 - advertising
			{imgName: "/advertising/agency-ad-small.jpg", captionTitle: "Agency Expo", captionText: "National press ad design template to promote exhibition", captionLink: "agencyad_advertising_snippet"},
			{imgName: "/advertising/pro-porta-ad-small.jpg", captionTitle: "Proporta.com ", captionText: "Ad designs to promote iPod accessories", captionLink: "proporta_advertising_snippet"},
			{imgName: "/advertising/pro-porta-ad-2-small.jpg", captionTitle: "Proporta.com ", captionText: "Ad designs to promote iPod accessories", captionLink: "proporta2_advertising_snippet"},
			{imgName: "/advertising/SHORELINE-ad-small.jpg", captionTitle: "Shoreline Refrigeration", captionText: "Range of press ads to promote medical refrigeration sector", captionLink: "shoreline_advertising_snippet"}
		],

		[ // 1 - brochures
			{imgName: "/brochures/agency-expo-1-small.jpg", captionTitle: "Agency Expo", captionText: "Range of promotional show brochures and programmes", captionLink: "agencyexpo_brochure_snippet"},
			{imgName: "/brochures/bve-1-small.jpg", captionTitle: "BVE", captionText: "Range of promotional show brochures and programmes", captionLink: "bve_brochure_snippet"},
			{imgName: "/brochures/davison-1-small.jpg", captionTitle: "Davison", captionText: "Prospectus design for Davison Girls High School", captionLink: "davison_brochure_snippet"},
			{imgName: "/brochures/f-hills-1-small.jpg", captionTitle: "Forest Hills Developments", captionText: "Sales brochure for exclusive green building development", captionLink: "foresthills_brochure_snippet"},
			{imgName: "/brochures/global-1-small.jpg", captionTitle: "Global Security", captionText: "Brochure design for a security management company", captionLink: "global_brochure_snippet"},
			{imgName: "/brochures/gp-1-small.jpg", captionTitle: "Garden Pride", captionText: "Range of newsletters, mailers and leaflets", captionLink: "gardenpride_brochure_snippet"},
			{imgName: "/brochures/kb-1-small.jpg", captionTitle: "Kleinwort Benson Private Banking", captionText: "An innovative modern mailer design and approach for a targeted database", captionLink: "kleinwort_brochure_snippet"},
			{imgName: "/brochures/msm-1-small.jpg", captionTitle: "Mid Sussex Council", captionText: "A series of magazine designs for Council community magazine", captionLink: "midsussexmatters_brochure_snippet"},
			{imgName: "/brochures/nh-1-small.jpg", captionTitle: "Nursing Hygiene Supplies", captionText: "Corporate sales brochures and catalogue designs", captionLink: "nursinghygiene_brochure_snippet"},
			{imgName: "/brochures/whigh-1-small.jpg", captionTitle: "Worthing High School", captionText: "Prospectus for Worthing High School", captionLink: "whs_brochure_snippet"},
			{imgName: "/brochures/smarys-1-small.jpg", captionTitle: "St Marys Hall", captionText: "Radical re-design of current school magazine layout", captionLink: "smh_brochure_snippet"}
		],

		[ // 2 - websites
			{imgName: "/websites/GP-website-small.jpg", captionTitle: "Garden Pride Garden Centre", captionText: "New e-commerce site design and build", captionLink: "gardenpride_websites_snippet"},
			{imgName: "/websites/BVE-website-small.jpg", captionTitle: "Broadcast Video Expo", captionText: "New website interface designs", captionLink: "bve_websites_snippet"},
			{imgName: "/websites/creche-on-loc-website-small.jpg", captionTitle: "Creche on location", captionText: "New website design and build", captionLink: "creche_websites_snippet"},
			{imgName: "/websites/danescroft-website-small.jpg", captionTitle: "Danescroft Commercial Developments", captionText: "Web interface designs", captionLink: "danescroft_websites_snippet"},
			{imgName: "/websites/just-hosp-website-small.jpg", captionTitle: "Just Hospitality Catering", captionText: "Website design and build", captionLink: "justhospitality_websites_snippet"},
			{imgName: "/websites/royal-norfolk-website-small.jpg", captionTitle: "The Royal Norfolk Hotel", captionText: "New website design and build with room and event booking system", captionLink: "norfolk_websites_snippet"},
			{imgName: "/websites/TPS-website-small.jpg", captionTitle: "The Production Show", captionText: "New website interface designs", captionLink: "tps_websites_snippet"}
		],

		[ // 3 - e-marketing
			{imgName: "/e-marketing/GP-e-news-small.jpg", captionTitle: "Garden Pride Garden Centre", captionText: "Garden Pride e-newsletter", captionLink: "gardenpride_e-marketing_snippet"},
			{imgName: "/e-marketing/KBPB-e-news-small.jpg", captionTitle: "Kleinwort Benson", captionText: "Kleinwort Benson Private Banking e-newsletter", captionLink: "kleinwort_e-marketing_snippet"},
			{imgName: "/e-marketing/KBPB-e-news-small.jpg", captionTitle: "Kleinwort Benson", captionText: "Kleinwort Benson Private Banking e-newsletter", captionLink: "kleinwort_e-marketing_snippet"}
		],

		[ // 4 - identity
			{imgName: "/identity/agency-logo-small.jpg", captionTitle: "Agency Expo", captionText: "New brand identity for national Estate Agency exhibition", captionLink: "agencyexpo_identity_snippet"},
			{imgName: "/identity/BVE-logo-small.jpg", captionTitle: "Broadcast Video Expo", captionText: "New brand identity for large national exhibition", captionLink: "bve_identity_snippet"},
			{imgName: "/identity/charmandean-logo-small.jpg", captionTitle: "The Charmandean Centre", captionText: "Refreshed brand identity for multi-use conference centre", captionLink: "charmandean_identity_snippet"},
			{imgName: "/identity/creche-logo-small.jpg", captionTitle: "Creche on location ", captionText: "New brand identity for mobile creche company", captionLink: "creche_identity_snippet"},
			{imgName: "/identity/danescroft-logo-small.jpg", captionTitle: "Danescroft Commercial Developments", captionText: "New brand identity London based ", captionLink: "danescroft_identity_snippet"},
			{imgName: "/identity/evolute-logo-small.jpg", captionTitle: "Evolute Marine Design", captionText: "New brand identity", captionLink: "evolute_identity_snippet"},
			
			{imgName: "/identity/shoreline-logo-small.jpg", captionTitle: "Shoreline Refrigeration ", captionText: "Refreshed brand/style identity", captionLink: "shoreline_identity_snippet"},
			{imgName: "/identity/TPS-logo-small.jpg", captionTitle: "The Production Show", captionText: "New brand identity for BVE sister show", captionLink: "tps_identity_snippet"},
			{imgName: "/identity/well-fit-logo-small.jpg", captionTitle: "Primary Care Trust", captionText: "New brand identity for new health sub division agency", captionLink: "wellfit_identity_snippet"}
		]
	],

	imgDir : "../images/portfolio/",
	imgWidth : 250,
	imgHeight : 200,

		// and set event handlers in loader function

	/********************************************/

	arrUsed : 0,
	contentLastPointer : 0,
	contentMidPointer : 1,
	contentCurrentPointer : 2,

	loader : function() {

			// set section image placeholders - 0 = first
		document.getElementById("section1").onclick = function() {Portfolio.changeContent(0);};
		document.getElementById("section2").onclick = function() {Portfolio.changeContent(1);};
		document.getElementById("section3").onclick = function() {Portfolio.changeContent(2);};
		document.getElementById("section4").onclick = function() {Portfolio.changeContent(3);};
		document.getElementById("section5").onclick = function() {Portfolio.changeContent(4);};
		//document.getElementById("section6").onclick = function() {Portfolio.changeContent(0);};

		document.getElementById("back").onclick = function() {Portfolio.nextContent(1);};
		document.getElementById("forward").onclick = function() {Portfolio.nextContent(0);};
		//document.getElementById("back").setAttribute("onclick", "Portfolio.nextContent(1)"); // doesn't work in IE6

		var imArrLen = Portfolio.itemArr.length; // has to reference fully when called externally (private)

		for (var i = 0; i < imArrLen; i++) {
			for (var j = 0; j <  Portfolio.itemArr[i].length; j++) {  // inner array - needs to be dynamic for array's variable content length
				Portfolio.itemArr[i][j].img = new Image(Portfolio.imgWidth, Portfolio.imgHeight);
				Portfolio.itemArr[i][j].img.src = Portfolio.imgDir + Portfolio.itemArr[i][j].imgName;
			}
		}

		Portfolio.displayContent(); // for initial title display
	},

	displayContent : function()  {
		document.getElementById("imgcurrent").setAttribute("src", this.itemArr[this.arrUsed][this.contentCurrentPointer].img.src);
		document.getElementById("imgmid").setAttribute("src", this.itemArr[this.arrUsed][this.contentMidPointer].img.src);
		document.getElementById("imglast").setAttribute("src", this.itemArr[this.arrUsed][this.contentLastPointer].img.src);
		document.getElementById("captiontitle").innerHTML = this.itemArr[this.arrUsed][this.contentCurrentPointer].captionTitle;
		document.getElementById("captiontext").innerHTML = this.itemArr[this.arrUsed][this.contentCurrentPointer].captionText;
		this.loadContent(this.itemArr[this.arrUsed][this.contentCurrentPointer].captionLink + ".html", "snippetcontainer", this.itemArr[this.arrUsed][this.contentCurrentPointer].captionLink);

		//var fadeinHandlerStr = "FadeIn('#" + this.itemArr[this.arrUsed][this.contentCurrentPointer].captionLink + "')";
		//document.getElementById("captionlink").setAttribute("onclick", fadeinHandlerStr); // normal browsers
		document.getElementById("captionlink").onclick = function() {
			FadeIn('#' + Portfolio.itemArr[Portfolio.arrUsed][Portfolio.contentCurrentPointer].captionLink); // malaevolent IE6
		};

		//document.getElementById("imgcurrent").setAttribute("onclick", fadeinHandlerStr);
		document.getElementById("imgcurrent").onclick = function() {
			FadeIn('#' + Portfolio.itemArr[Portfolio.arrUsed][Portfolio.contentCurrentPointer].captionLink); // IE6, we love you
		};
	},

	nextContent : function(n) {

		var uBound = (this.itemArr[this.arrUsed].length - 1); // irritating JS encapsulation, var in fn can't be set at start

		if (n) { // forward
			this.contentCurrentPointer++;
			this.contentMidPointer++;
			this.contentLastPointer++;
			if (this.contentCurrentPointer > uBound) {this.contentCurrentPointer = 0;}
			if (this.contentMidPointer > uBound) {this.contentMidPointer = 0;}
			if (this.contentLastPointer > uBound) {this.contentLastPointer = 0;}
		}
		else { // reverse
			this.contentCurrentPointer--;
			this.contentMidPointer--;
			this.contentLastPointer--;
			if (this.contentCurrentPointer < 0) {this.contentCurrentPointer = uBound;}
			if (this.contentMidPointer < 0) {this.contentMidPointer = uBound;}
			if (this.contentLastPointer < 0) {this.contentLastPointer = uBound;}
		}
		this.displayContent();
	},

	changeContent : function(n) {

		this.arrUsed = n;
		var sectionLen = this.itemArr.length;

		for (var i = 1; i < sectionLen+1; i++) {
			document.getElementById("section" + i).style.color = "#fff";
		}
		document.getElementById("section" + (n + 1)).style.color = "#ae5073";
		this.contentLastPointer = 0;
		this.contentMidPointer = 1;
		this.contentCurrentPointer = 2;
		this.displayContent();
	},

	loadContent : function(url, div, closeref) {

		var xmlhttp;

		if (typeof XMLHttpRequest != "undefined") {
			try {xmlhttp = new XMLHttpRequest();}
			catch (xhrError) {}
		}
		else if (window.ActiveXObject) {
			try {xmlhttp = new ActiveXObject("MSXML2.XMLHttp");} // IE5 is Microsoft.XMLHTTP
			catch (xhrError) {alert("AJAX functionality is not supported (or trusted ActiveX has been disabled) in this version of Internet Explorer.");}
		}

		xmlhttp.onreadystatechange = function() {
			if (xmlhttp.readyState == 4 || xmlhttp.readyState == "complete") {  // deliberate typo for FF
				document.getElementById(div).innerHTML = xmlhttp.responseText;
				//document.getElementById("cross").setAttribute("onclick", "FadeOut('#" + closeref + "')");
				document.getElementById("cross").onclick = function() {
					FadeOut("#" + closeref) // IE6
				};
				xmlhttp = null; // avoid memory leaks
			}
		};

		xmlhttp.open("GET", "snippets/" + url, true);
		try {
			xmlhttp.send(null);
		}
		catch(e) {alert('file security exception')} // catch security exceptions
	}
};

var ajaxSnippetImgRotCounter = 1; // global, should be unique-enough				
function imgRotator(img1, img2, img3, dir) {
	// MSL: this crazy kludge results from why everything needs to be planned and specified exactly at the start of a complex and not changed 3/4 way through!  This will make updating much harder.  Style over functionality....
	var imgArr = [img1, img2];
	if (arguments.length == 4) {imgArr[2] = img3;}
	imgArrLen = imgArr.length - 1;
	document.getElementById('ajaxSnippetImgRot').src = imgArr[ajaxSnippetImgRotCounter];
	(dir == '+') ? ajaxSnippetImgRotCounter++ : ajaxSnippetImgRotCounter--;
	if (ajaxSnippetImgRotCounter > imgArrLen) {ajaxSnippetImgRotCounter = 0;}
	if (ajaxSnippetImgRotCounter < 0) {ajaxSnippetImgRotCounter = imgArrLen;}
}

function FadeIn(id) {
	$(id).fadeIn(500);
}

function FadeOut(id) {
	$(id).fadeOut(500);
}

window.onload = Portfolio.loader;
window.onunload = function() {Portfolio = null;};