function displayLarge(id) {
	var d = document.getElementById(id);
	var root = d.src.split("/");
	var imageRoot = root[root.length - 1];
	imageRoot = imageRoot.substring(0, imageRoot.length - 4);
	
	var KeyVal = {
		Key: 0
		, Value: 1
		, CaptionTitle: 2
		, CaptionText: 3
		, ImageType: 4
	}
	
	var imageName; 
	var captionTitle;
	var captionText;
	
	for(iRowPointer in imageMap) {
		if (imageMap[iRowPointer][KeyVal.Value] == imageRoot) {
			var extension = ".jpg";
			if (imageMap[iRowPointer][KeyVal.ImageType] == 1) {
				extension = ".gif";
			}
			imageName = imageMap[iRowPointer][KeyVal.Key] + extension;
			captionTitle = imageMap[iRowPointer][KeyVal.CaptionTitle];
			captionText = imageMap[iRowPointer][KeyVal.CaptionText];
			break;
		}
	}

	parent.document.getElementById("largeImage").src = "images/LargeImages/" + imageName; 
	parent.document.getElementById("portfolioBodyBold").innerHTML = captionTitle;
	parent.document.getElementById("portfolioBodyText").innerHTML = captionText;
}

 $(document).ready(function(){
	
	// Contact Form

	$("#submit").mouseover(function() {
		$(this).attr("src", "images/submit_light.gif");
	});

	$("#submit").mouseout(function() {
		$(this).attr("src", "images/submit.gif");
	});

	$("#submit").click(function() {
		$(this).attr("src", "images/submit_light.gif");
		var warning = "";
		if ($("#fullname").attr("value").length < 1) {
			warning = "A full name must be included.\n\r";
		}
		if ($("#email").attr("value").length < 1) {
			warning += "An e-mail address must be included.\n\r";		
		}

		if (warning.length > 0) {
			alert(warning);
			return false;
		}
	});

	$("#fullname").blur(function(){
		var value = $(this).attr("value");
		if (value.length < 1) { 
			alert("You must type in a full name.");
		} 
	});

	$("#email").blur(function(){
		var value = $(this).attr("value");
		value = value.replace(/^\s+|\s+$/g,'');
		
		var pattern = /^([a-zA-Z0-9_.-])+@(([a-zA-Z0-9-])+.)+([a-zA-Z0-9]{2,4})+$/;

		if (value.length < 1) { 
			alert("You must type in an e-mail address.");
			$(this).attr("value", "");
		} else if (!pattern.test(value)) {
			alert("You must type in a correctly formatted e-mail address.");	
			$(this).attr("value", "");
		}
	});

	// Portfolio Pages
	
	var brochures165x165;
	var annualReports165x165;
	var packaging165x165;
	var invitations165x165;
	var photography165x165;
	var web165x165;

	var brochures165x165Light;
	var annualReports165x165Light;
	var packaging165x165Light;
	var invitations165x165Light;
	var photography165x165Light;
	var web165x165Light;

	if ($("#portfolioBox").length == 1) {
		brochures165x165 = $('<img />').attr('src', 'images/brochures165x165.jpg');
		annualReports165x165 = $('<img />').attr('src', 'images/annualReports165x165.jpg');
		packaging165x165 = $('<img />').attr('src', 'images/packaging165x165.jpg');
		invitations165x165 = $('<img />').attr('src', 'images/invitations165x165.jpg');
		photography165x165 = $('<img />').attr('src', 'images/photography165x165.jpg');
		web165x165 = $('<img />').attr('src', 'images/web165x165.jpg');

		brochures165x165Light = $('<img />').attr('src', 'images/brochures165x165Light.jpg');
		annualReports165x165Light = $('<img />').attr('src', 'images/annualReports165x165Light.jpg');
		packaging165x165Light = $('<img />').attr('src', 'images/packaging165x165Light.jpg');
		invitations165x165Light = $('<img />').attr('src', 'images/invitations165x165Light.jpg');
		photography165x165Light = $('<img />').attr('src', 'images/photography165x165Light.jpg');
		web165x165Light = $('<img />').attr('src', 'images/web165x165Light.jpg');
	}

	var location = window.location.href;
	var patternPortfolio = /portfolio/i;
	var largeImage;
	var captionTitle;
	var captionText;
	if (patternPortfolio.test(location)) {
		var queryStringArray = window.location.href.split("?");
		if (queryStringArray.length > 1) {
			queryStringArray = queryStringArray[queryStringArray.length - 1].split("=");
			if (queryStringArray[0] == "item") {
				var source = queryStringArray[queryStringArray.length - 1];
				var imageName;
				for(iRowPointer in imageMap) {
					if (imageMap[iRowPointer][0] == source) {
						imageName = imageMap[iRowPointer][0] + ".jpg";
						captionTitle = imageMap[iRowPointer][2];
						captionText = imageMap[iRowPointer][3];
						break;
					}
				}
				largeImage = $('<img />').attr('src', 'images/LargeImages/' + imageName);
				if ($("#largeImage").length == 1) {
					$("#largeImage").attr("src", largeImage.attr("src"));
					$("#portfolioBodyBold").html(captionTitle);
					$("#portfolioBodyText").html(captionText);
				}
			}
		}
	}
	
	$(".imageNav").mouseover(function(event){
		event.preventDefault();
		var src = $(this).attr("src");
		src = src.replace(".jpg", "Light.jpg");
		$(this).attr("src", src);
	});	
	
	$(".imageNav").mouseout(function(event){
		event.preventDefault();
		var src = $(this).attr("src");
		src = src.replace("Light", "");
		$(this).attr("src", src);
	});

	$(".imageNavCenter").mouseover(function(event){
		event.preventDefault();
		var src = $(this).attr("src");
		src = src.replace(".jpg", "Light.jpg");
		$(this).attr("src", src);
	});	
	
	$(".imageNavCenter").mouseout(function(event){
		event.preventDefault();
		var src = $(this).attr("src");
		src = src.replace("Light", "");
		$(this).attr("src", src);
	});

	$(".imageNavRight").mouseover(function(event){
		event.preventDefault();
		var src = $(this).attr("src");
		src = src.replace(".jpg", "Light.jpg");
		$(this).attr("src", src);
	});	
	
	$(".imageNavRight").mouseout(function(event){
		event.preventDefault();
		var src = $(this).attr("src");
		src = src.replace("Light", "");
		$(this).attr("src", src);
	});
	
	var movement;
	var total = 0;
	function moveDownwards() {
		var thumbDiv = document.getElementById("sourcePage").contentWindow.document.getElementById("portfolioThumbs");
		var y = thumbDiv.offsetTop;
		var yDestination = 400;
		var interval = 10;

		if (y == 0) return;
		
		if(y < yDestination) {
			y = y + interval;
		}

		total += y;
		thumbDiv.style.top = y + 'px';
		if (y + interval < yDestination) {
			movement = window.setTimeout(moveDownwards,100);
		}
	}

	function moveUpwards() {
		var thumbDiv = document.getElementById("sourcePage").contentWindow.document.getElementById("portfolioThumbs");
		var y = thumbDiv.offsetTop;
		var yDestination = -400;
		var interval = 10;

		
		var locationArray = window.location.href.split("/");
		var location = locationArray[locationArray.length - 1];
		location = location.replace("portfolio", "");
		location = location.replace(".php", "");
		
		if (location == "Photography") {
			if (y == -170) {
				return;
			}
		} else {
			if (y == -120) {
				return;
			}
		}
		
		if(y > yDestination) {
			y = y - interval;
		}
		total += y;
		thumbDiv.style.top = y + 'px';

		if (y - interval > yDestination) {
			movement = window.setTimeout(moveUpwards,100);
		}
	}

	function stopDownwardMotion() {
		clearTimeout(movement);
	}

	function stopUpwardMotion() {
		clearTimeout(movement);
	}


// Scrolling functionality
	$("#arrowUp").click(function(event){
		event.preventDefault(); 
		moveUpwards();
	}); 

	$("#arrowUp").mouseout(function(event){
		event.preventDefault();
		stopDownwardMotion();
	}); 

	$("#arrowDown").click(function(event){
		event.preventDefault(); 
		moveDownwards();
	}); 

	$("#arrowDown").mouseout(function(event){
		event.preventDefault(); 
		stopUpwardMotion();
	}); 

// Home Page
	var homePageImage1;
	var homePageImage2;
	var homePageImage3;
	var homePageImage4;
	
	function switchHomePageImage() {
		var homePageImageSrc = $("#homePageMainImage").attr("src");
		var imageNumber = homePageImageSrc.replace("images/coverPicture", "");
		imageNumber = imageNumber.replace(".jpg", "");
		var newHomePageImage;
		if (imageNumber < 4) {
			imageNumber++;
		} else {
			imageNumber = 1;
		}
		newHomePageImage = eval("homePageImage" + imageNumber);
		$("#homePageMainImage").attr("src", newHomePageImage.attr("src"));
	}

	function toggleHomePageImage() {
		window.setInterval(switchHomePageImage, 7000);
	}

	if ($("#homePageMainImage").length == 1) {
		homePageImage1 = $('<img />').attr('src', 'images/coverPicture1.jpg');
		homePageImage2 = $('<img />').attr('src', 'images/coverPicture2.jpg');
		homePageImage3 = $('<img />').attr('src', 'images/coverPicture3.jpg');
		homePageImage4 = $('<img />').attr('src', 'images/coverPicture4.jpg');
		toggleHomePageImage();
	}

// Design Pages
	$("#LightGreenArrowLarge").mouseover(function(event){
		event.preventDefault();
		$("#greenArrow").attr("src", "images/ViewArrowDark.gif");
	});

	$("#LightGreenArrowLarge").mouseout(function(event){
		event.preventDefault();
		$("#greenArrow").attr("src", "images/ViewArrowLight.gif");
	});

	function togglePrintDesignProcess(id) {
		var div = $("<div></div>");
		div.attr("class", "bodyTextProcess");
		switch(id) {
		
			case "designLi1":
				div.html("This is the initial consultation where we meet and you tell us about your company and what you hope to achieve with our help.");
				break;
			case "designLi2":
				div.html("In order to understand your needs we listen carefully. This helps us to decide how we can effectively create the visual impact you need.");
				break;
			case "designLi3":
				div.html("You give us the assets that need to be incorporated into the project, such as: images, logos and text.");
				break;
			case "designLi4":
				div.html("We come up with 2 to 3 different visual solutions to the project. We present them to you and you choose 1 of the approaches.");
				break;
			case "designLi5":
				div.html("We create a full layout using the approved idea.");
				break;
			case "designLi6":
				div.html("Generally there are minor changes and tweaks that need to be made and this is the stage where we make the adjustments.");
				break;
			case "designLi7":
				div.html("We receive final approval from you to proceed to the print vendor.");
				break;
			case "designLi8":
				div.html("At this stage we send the piece to the print vendor, receive the \"blues\" (the test version) of the project back from them, and say \"Yes please print\".");
				break;
			case "designLi9":
				div.html("Printed Piece Received!");
				break;
		}
		$("#" + id).append(div);
	}

	function toggleWebDesignProcess(id) {
		var div = $("<div></div>");
		div.attr("class", "bodyTextProcess");
		switch(id) {
			case "designLi1":
				div.html("This is the initial consultation where we meet and you tell us about your company. We'll work with you to find out what you hope to achieve with your website.");
				break;
			case "designLi2":
				div.html("Just like a building, a website benefits from draft work about how it is to assembled. We'll diagram specifications to design how your site will work.");
				break;
			case "designLi3":
				div.html("Once you've provided us with assets that you want included, such as images for logos, we'll create wireframes that indicate how a website is to guide a visitor.");
				break;
			case "designLi4":
				div.html("We come up with 2 to 3 different visual solutions to the project. We present them to you and choose 1 of the approaches for the look and feel of the site.");
				break;
			case "designLi5":
				div.html("We create a full layout for each of the web pages using the approved idea.");
				break;
			case "designLi6":
				div.html("Some sites require information to be changed frequently. For these sites, a restricted set of pages is built that enables the site's owner to update information.");
				break;
			case "designLi7":
				div.html("We include strategies for improving the likelihood that potential customers will find your site when they type certain key words into a search engine such as Google.");
				break;
			case "designLi8":
				div.html("We start building your site based on all the decisions made leading up to this point about look and feel, architecture, the technologies to be used, et cetera.");
				break;
			case "designLi9":
				div.html("We test the site to ensure that all contracted functionality works as expected, the design is as planned, and that the appearance is consistent across all major browsers. There is also user acceptance testing by the client to confirm that the site meets expectations.");
				break;
			case "designLi10":
				div.html("We deploy the completed website to a webhosting account.");
				break;
		}
		$("#" + id).append(div);
	}

	$(".designLiLink").click(function(event){
		event.preventDefault();
		var parent = $(this).parent();
		var id = parent.attr("id");
		var patternDiv = /<div/i;
		if (patternDiv.test($("#" + id).html())) {
			$("#" + id + " > div").remove();
		} else {	
		
			var location = window.location.href;
			var patternPrint = /print/i;
			if (patternPrint.test(location)) {
				togglePrintDesignProcess(id);
			} else {
				toggleWebDesignProcess(id);
			}
		}
	});
});