$(document).ready(function(){
	$("#navigation a.subpage").live('click', function () {
		$(this).siblings('ul').toggle();
		return false;
	});

	// Provide Custom navigation Colors
	$("#navigation a span").live('hover', function () {
		// Determine if string is hash or rgb
		if ($(this).attr('rel').length == 6) {
			var hoverColor = '#'+$(this).attr('rel');
		} else {
			var hoverColor = $(this).attr('rel');
		}
		var background = $(this).css('background-color');
		$(this).attr('rel', background);
		$(this).css("background-color", hoverColor);
	}, function() {
		var background = $(this).attr('rel');
		var hoverColor = $(this).css('background-color');
		$(this).attr('rel', hoverColor);
		$(this).css("background-color", background);
	});

	
	// This is the JS for the photo page.
	if ($("#photos").length) {
		// If No Photos Exist show no images error message
		if ($("#photos img").length == 0) {
			$("#content").show();
			$("#caption").hide();
		}

		// Create an array of photos. This is current Redundent.
		var photos = [];
		var a = 1;
		$("#photos img").each(function(i) {
			photos[a] = [];
			photos[a]["url"] = this.src;
			photos[a]["caption"] = this.alt;
			photos[a]["background"] = $(this).css('background-color');
			a++;
		});
		// End

		// Holds the current image being shown.
		var currentImage = 1;
		// When the delay is 0 the slideshow runs.
		var delay = 0;

		// Slideshow
		if (photos.length != 2) {
			setInterval( function(){
				if (delay == 0) {
					if (photos.length == currentImage) {
						currentImage = 0;
					}
					currentImage++;
					nextImage(currentImage, photos);
				}
			}, 5000);
		}
		// End Slideshow

		// Click to change the background.
		$("body:not(#navigation span, #caption, #logo, #show_gallery, #hide_gallery)").click (function() {
			// Make sure the thumbs aren't being displayed
			if ($("#thumbs").css('display') != 'block') {
				if (photos.length == currentImage) {
					currentImage = 0;
				}
				// Disable the slideshow so people can see the image they actually click on.
				// We set an interval here so the slideshow will ping back on after 5 seconds.
				delay = 1;
				setInterval( function() {
					delay = 0;
				}, 5000);
				// End

				// increment the current Image
				currentImage++;
				nextImage(currentImage, photos);
			}
		});
		// End change background

		// Thumbnails -> Select Picture
		if (photos.length != 2) {
		$("#thumbs img").click(function() { 
			currentImage = $(this).attr('alt');

			delay = 1;
			setInterval( function() {
				delay = 0;
			}, 5000);

			if (photos[currentImage]["caption"].length == 0) {
				$("#caption").hide();
			} else {
				$("#caption").show();
				$("#caption").html(photos[currentImage]["caption"]);
			}
			//$("body").css('background', 'url(' + photos[currentImage]["url"] + ') no-repeat 50% 50% fixed ' + photos[currentImage]["background"]);
			var ele = "#wrap_" + currentImage;

			$('.wrap').css('z-index', '-1');
			$(ele).css('z-index', '-10');

			$(".wrap").each(function(i) {
				if ($(this).css('display') == 'block') {
					$(this).fadeOut();
				}
			});

			$("#thumbs img").css('filter', 'alpha(opacity=70)');
			$("#thumbs img").css('opacity', '0.7');
			$("#thumbs #"+currentImage).css('filter', 'alpha(opacity=100)');
			$("#thumbs #"+currentImage).css('opacity', '1');

			$(ele).css('background', 'url(' + photos[currentImage]["url"] + ') no-repeat 50% 50% fixed ' + photos[currentImage]["background"]);
			$(ele).show();

		});
		}
		// End

		// if the Image is the first one, wait for the image to load -> load image.
		if (currentImage == 1) {

			$("#wrap_1").css('background', 'url(themes/35/images/progress.gif) no-repeat 50% 50% fixed ' + photos[currentImage]["background"]);
			if (photos[currentImage]['caption'] == '') {
				$("#caption").hide();
			} else {
				$("#caption").html(photos[currentImage]["caption"]);
			}

			$("#photos img:first").ready(function (){
				$("#wrap_1").css('background', 'url(' + photos[currentImage]["url"] + ') no-repeat 50% 50% fixed ' + photos[currentImage]["background"]);
				$("#wrap_1").fadeIn();
			});
			$("#thumbs #1").css('filter', 'alpha(opacity=100)');
			$("#thumbs #1").css('opacity', '1');
		}
	}
	// End

	function nextImage(currentImage, photos) {
		if (photos[currentImage]["caption"].length == 0) {
			$("#caption").hide();
		} else {
			$("#caption").show();
			$("#caption").html(photos[currentImage]["caption"]);
		}

		var ele = "#wrap_" + currentImage;
		var lastEle = currentImage-1;
		if (lastEle == 0) {
			lastEle = photos.length-1;
		}
		lastEle = "#wrap_" + lastEle;

		$("#thumbs img").css('filter', 'alpha(opacity=70)');
		$("#thumbs img").css('opacity', '0.7');
		$("#thumbs #"+currentImage).css('filter', 'alpha(opacity=100)');
		$("#thumbs #"+currentImage).css('opacity', '1');

		$(lastEle).css('z-index', '-1');
		$(ele).css('z-index', '-10');

		$(lastEle).fadeOut("slow");
		$(ele).css('background', 'url(' + photos[currentImage]["url"] + ') no-repeat 50% 50% fixed ' + photos[currentImage]["background"]);
		$(ele).show();

	}

	$("#show_gallery").click(function() {
		$("#instructions").hide();
		$("#thumbs").fadeIn("slow");
	});

	$("#hide_gallery").click(function() {
		$("#thumbs").fadeOut();
		$("#instructions").show();
	});

	$(".submit").click(function() {
		var error = '';
		$("form .required").each(function(i) {
			if ($(this).attr("value") == '') {
				error += "<p>The field '" + $(this).attr('rel') + "' is required</p>";
			}
		});
		
		if (error.length > 0) {
			$(".errors").html(error);
			return false;
		}
	});
});