$(document).ready(function() {


		
		var loop_toggle = 1;
		
		
		/*
		--------------------------------------------------------------
		Setup the home images
		--------------------------------------------------------------
		*/
		
		var num_home_images = $("#homepage_images").children("img").size();
		var home_image_list = $("#homepage_images").children("img");
		var curr_home_image = 0;
		//console.log(num_home_images);
		if ($('#homepage_images').length) {
			
			// Hide all of the homepage images
			$("#homepage_images").children("img").hide();
			
			// Show the first gallery image
			$(home_image_list[0]).show();
			
			// Start the loop
			startGalleryLoop();
		}
		
		/*
		--------------------------------------------------------------
		Setup the home images
		--------------------------------------------------------------
		*/
		
		
		
		
		
		/*
		--------------------------------------------------------------
		Setup the gallery images
		--------------------------------------------------------------
		*/
		
		var num_gallery_images = $("#gallery_images").children("img").size();	
		var gallery_image_list = $("#gallery_images").children("img");
		var gallery_thumb_list = $("#thumbs").children("img");
		var curr_gallery_image = 0;
		var counter = 0;
		
		// Fade the previous and next buttons
		$("#prev").fadeTo(0, .67);
		$("#next").fadeTo(0, .67);
		$("#play").fadeTo(0, .67);
		$("#pause").fadeTo(0, .67);
		
		$("#thumbs").children("img").each(
			function(){
				
				//access to form element via $(this)
				var newPos = counter * 88;
				
				$(this).css("left",newPos);
				
				$(this).css("visibility","visible");
				
				// Save the initial x pos
				$(this).attr({initX:newPos});
				counter++;
			}
		);
		
		// Loop throught the thumbnails
		//$(gallery_nav_list[curr_gallery_image]).children().css("color","#B5B5B5");
		
		if ($('#gallery_images').length) {  
		
			$("#gallery_images").children("img").css("visibility","visible");
			
			// Hide all of the gallery images
			$("#gallery_images").children("img").hide();
			
			// Fade all of the gallery images
			$("#thumbs").children("img").fadeTo(0, .67);
			
			// Show the first gallery image
			$(gallery_image_list[0]).show();
			
			// Set the selected attribute
			$(gallery_thumb_list[0]).attr({selected:"true"});
			
			// Show the selected thumb
			$(gallery_thumb_list[0]).fadeTo(0, 1);
			
			// Highlight the first gallery nav
			//$("#gallery_nav").children("ul").children("li:first").children("a").css("color","#6E6E6E");
			
			// Start the loop
			startGalleryLoop();
		} 
		
		/*
		--------------------------------------------------------------
		Setup the gallery images
		--------------------------------------------------------------
		*/
	
		
		
		
		
		
		/*
		--------------------------------------------------------------
		Timers
		--------------------------------------------------------------
		*/
		
		function startGalleryLoop() {
			
			$(this).everyTime(5000, "gallery_loop", function() {
															 
				if (num_home_images > 1) {
					
					// Create a variable to save the new position
					var newPos = curr_home_image + 1;
					
					// Check the new number and set back to zero
					// if it's greater than the number of images
					if (newPos == num_home_images) newPos = 0;
		
					// Swap out the projects			
					if (loop_toggle == 1) swapProjects(newPos);
				}
											 
				
				if (num_gallery_images > 1) {
				
					// Save the new pos
					new_pos = curr_gallery_image + 1;
					
					// Check the new pos
					if (new_pos == num_gallery_images) new_pos = 0;
					
					// Swap the images
					if (loop_toggle == 1) swapGalleryProjects(new_pos);
				}
			});
		}
		
		function stopGalleryLoop() {
			
			// Stop the timer
			$(this).stopTime("gallery_loop");
		}
		
		/*
		--------------------------------------------------------------
		Timers
		--------------------------------------------------------------
		*/
		
		
		
		
		
		/*
		--------------------------------------------------------------
		Functions
		--------------------------------------------------------------
		*/
		
		// Function used to swap projects
		function swapProjects(pos) {
			
			// Fade out the current image
			$(home_image_list[curr_home_image]).fadeOut("slow");
			
			// Fade in the new image
			$(home_image_list[pos]).fadeIn("slow");
			
			// Save the new position
			curr_home_image = pos;
		}
		
		function swapGalleryProjects(pos) {
			
			// Fade out the current image
			$(gallery_image_list[curr_gallery_image]).fadeOut("slow");
			
			// Show the thumb
			$(gallery_thumb_list[curr_gallery_image]).fadeTo("slow", .67);
			
			// Set the selected attribute
			$(gallery_thumb_list[curr_gallery_image]).attr({selected:"false"});
			
			// Fade in the new image
			$(gallery_image_list[pos]).fadeIn("slow");
			
			// Show the thumb
			$(gallery_thumb_list[pos]).fadeTo("slow", 1);
			
			// Set the selected attribute
			$(gallery_thumb_list[pos]).attr({selected:"true"});
			
			// Save the new position
			curr_gallery_image = pos;
			
			var obj = $("#thumb_slider").offset();
			var slideX = Number(obj.left-57);
			var objX = Number($(gallery_thumb_list[pos]).attr("initX"));
			
			
			//console.log(slideX + " : " + objX + " : " + Number(objX+slideX));
			
			if (objX+slideX < 0) {
				
				moveProjects(pos,"back");
			}
			
			if (objX+slideX >= 616) {
				
				moveProjects(pos,"normal");
			}
			
			
		}
		
		function moveProjects(pos, type) {
			
			var posX;

			if (type == "normal") {
				posX = -(88 * pos);
			} else {
				posX = Number(-(88 * pos) + 528);
				if (posX > 0) posX = 0;
			}

			$('#thumb_slider').stop().animate({ "left" : (posX + 'px') }, 500);
		}
		
		/*
		--------------------------------------------------------------
		Functions
		--------------------------------------------------------------
		*/
		
		
		
		
		
		/*
		--------------------------------------------------------------
		Mouse Event Functions
		--------------------------------------------------------------
		*/
		
		
		// Thumb over event
		$("#thumbs").children("img").mouseover(function(){
			
			if ($(this).attr("selected") != "true") {
			
				// Show the image
				$(this).fadeTo("fast", 1);
			
			}
		
		// Thumb out event
		}).mouseout(function(){
			
			if ($(this).attr("selected") != "true") {
			
				// Show the image
				$(this).fadeTo("fast", .67);
			
			}
		});
		
		// Gallery nav click event
		$("#thumbs").children("img").click(function() {
			
			// Find the position of the nav
			var pos = $("#thumbs").children("img").index($(this));
			
			// Stop the timer
			stopGalleryLoop();
			
			// Swap the gallery images
			swapGalleryProjects(pos);
			
			// Restart the timer
			if (loop_toggle == 1) startGalleryLoop();
		});
		
		// Thumb over event
		$("#prev").mouseover(function(){

			// Show the image
			$(this).fadeTo("fast", 1);
		
		// Thumb out event
		}).mouseout(function(){

			// Show the image
			$(this).fadeTo("fast", .67);

		});
		
		// Gallery nav click event
		$("#prev").click(function() {
			
			// Save the new pos
			new_pos = curr_gallery_image - 1;
			
			// Check the new pos
			if (new_pos == -1) new_pos = Number(num_gallery_images-1);
			
			// Stop the timer
			stopGalleryLoop();
			
			// Swap the gallery images
			swapGalleryProjects(new_pos);
			
			// Restart the timer
			if (loop_toggle == 1) startGalleryLoop();
		});
		
		// Thumb over event
		$("#next").mouseover(function(){

			// Show the image
			$(this).fadeTo("fast", 1);
		
		// Thumb out event
		}).mouseout(function(){

			// Show the image
			$(this).fadeTo("fast", .67);

		});

		// Gallery nav click event
		$("#next").click(function() {
			
			// Save the new pos
			new_pos = curr_gallery_image + 1;
			
			// Check the new pos
			if (new_pos == num_gallery_images) new_pos = 0;
			
			// Stop the timer
			stopGalleryLoop();
			
			// Swap the gallery images
			swapGalleryProjects(new_pos);
			
			// Restart the timer
			if (loop_toggle == 1) startGalleryLoop();
		});
		
		// Thumb over event
		$("#play").mouseover(function(){

			// Show the image
			$(this).fadeTo("fast", 1);
		
		// Thumb out event
		}).mouseout(function(){

			// Show the image
			$(this).fadeTo("fast", .67);

		});

		// Gallery nav click event
		$("#play").click(function() {
								  
			//console.log("play clicked");
			
			// Swap the buttons
			$(this).css("visibility","hidden");
			$("#pause").css("visibility","visible");
			
			loop_toggle = 1;
			
			// Start the timer
			startGalleryLoop();
		});
		
		// Thumb over event
		$("#pause").mouseover(function(){

			// Show the image
			$(this).fadeTo("fast", 1);
		
		// Thumb out event
		}).mouseout(function(){

			// Show the image
			$(this).fadeTo("fast", .67);

		});

		// Gallery nav click event
		$("#pause").click(function() {
			
			// Swap the buttons
			$(this).css("visibility","hidden");
			$("#play").css("visibility","visible");
			
			loop_toggle = 0;
			
			// Start the timer
			stopGalleryLoop();
		});



		
		/*
		--------------------------------------------------------------
		Mouse Event Functions
		--------------------------------------------------------------
		*/
		
	});
