/*YKCREATIONS Site Code*/

$(document).ready(function(){

	//$("#noscriptstyle").remove();

	//scroll content
	$("#content_list").scrollable({
		size: 1,
		mouseWheel: false
	});

	var content_list = $("#content_list").scrollable();

	//scroll navigation
	$("#nav_container ul").scrollable({
		size: 8,
		loop: false
	});

	var nav = $("#nav_container ul").scrollable();

	//move to next page on next click
	$("#nav #next").click(function(){
		nav.nextPage();
	});

	//move to prev page on prev click
	$("#nav #prev").click(function(){
		nav.prevPage();
	});

	//keep an index of all nav items. reset to 0
	nav_container_ul_li_a_index = 0;

	$("#nav_container ul li").each(function(){
		//get the image file name. ie adds a space, get rid of it if it's there
		image_name = $(this).html().replace(" ", "");
		
		//set the grayscaled version as the background
		$(this).css("background", "url('/includes/php/grayscale.php?image=../images/thumbnails/"+image_name+".png')");

		//on top of that, add a color version, that is invisible for now
		$(this).html("<div class=\"color_image\"></div>");
		color_image_url = "/includes/images/thumbnails/"+image_name+".png";
		$(this).children(".color_image").css("backgroundImage", "url('"+color_image_url+"')");

		//show color when mouse over, fade to grayscale when out
		$(this).hover(function(){
			$(this).children(".color_image").hide();
			$(this).children(".color_image").addClass("color_image_over");
			$(this).children(".color_image").fadeIn("fast");
		}, function(){
			$(this).children(".color_image").fadeOut("fast", function(){
				$(this).children(".color_image").removeClass("color_image_over");
				$(this).children(".color_image").show();
			});
			
		});
		
		//set the index of each element so it can reference the content, then increment it
		$(this).attr("seek_to", nav_container_ul_li_a_index);
		nav_container_ul_li_a_index += 1;

		//scroll to the corresponding content according to index
		$(this).click(function(){
			seek_to = $(this).attr("seek_to");
			content_list.seekTo(seek_to);
			return false;
		});

	});

	//add a hover for prev button
	$("#prev").hover(function(){
		$(this).addClass("prev_over");
	}, function(){
		$(this).removeClass("prev_over");
	});

	//add a hover for next button
	$("#next").hover(function(){
		$(this).addClass("next_over");
	}, function(){
		$(this).removeClass("next_over");
	});

	//if the text overflows, make a nice scrollbar for it
	$(".content_text").jScrollPane();

	//for each content div, add the image as a background, then add the element that indicated the external link
	//that element is invisible for now
	$(".content_image").each(function(){
		image_name = $(this).html().replace(" ", "");
		$(this).css("background", "url('/includes/images/full/"+image_name+".png') no-repeat");
		$(this).html("<div class=\"external_link\"></div>");
		
		//add external link indicator when mouse is over, remove it when out
		$(".external_link").hover(function(){
			$(this).addClass("external_link_bg");
		}, function(){
			$(this).removeClass("external_link_bg");
		});

		//get the link from the title, then make the image link to it. Open in a new page
		$(this).children(".external_link").attr("external_link", $(this).parent().find("h2 a").attr("href"));
		$(this).children(".external_link").click(function(){
			window.open($(this).attr("external_link"), "_blank");
		});

	});

	//replace a tag in content with a script to open in a new window
	$("h2").each(function(){
		$(this).attr("external_link", $(this).children("a").attr("href"));
		//delete a tag
		$(this).html($(this).children("a").html());
		$(this).click(function(){
			window.open($(this).attr("external_link"), "_blank");
		});
		$(this).hover(function(){
			$(this).addClass("h2_over");
		}, function(){
			$(this).removeClass("h2_over");
		});
	});


	//remove the a tag from the contact button - meant for non-javascript users
	$("#ques_quote_bt").html($("#ques_quote_bt a").html());

	//for the contact button, load the appropriate page and script, then show it
	$("#ques_quote_bt").click(function(){
		$("#contact").load("/includes/php/contact.php", function(){
			$.getScript("/includes/js/jquery.contact.js", function(){
				$("#contact").expose({
						speed: 500,
						opacity: 0.8,
						color: "#000",
						onClose: function(){
							$("#contact form").slideUp("normal");
						}
				});
				$("#contact form").slideDown("slow", function(){
					//focus the first element when done sliding down
					$(".element:first").focus();
				});
				

				//make the form elements stand out when each is focused, and make them normal again when blurred

				$(".element").focus(function(){
					$(this).addClass("element_selected");
				});
	
				$(".element").blur(function(){
					$(this).removeClass("element_selected");
				});
			});
		});
	});

	//contact button hover effect
	contact_button_original_image = $("#ques_quote_bt img").attr("src");
	$("#ques_quote_bt img").hover(function(){
		$(this).attr("src", "/includes/images/ques_quote_bt_over.png");
	}, function(){
		$(this).attr("src", contact_button_original_image);
	});

	//preload images

	$("#preload").append("<img src='/includes/images/ques_quote_bt_over.png' />");


});