//<![CDATA[
$(function() {
	var hrefEncodedUrl = encodeURIComponent(document.URL);
	var pubEncodedUrl = encodeURIComponent(encodeURIComponent("http://" + location.hostname + "/"));

	//change opacity of stripe on hover
    $("div#photo_set").hover(function() {
        $("div#photo_set_stripe").css("opacity", 1);
    },
    function() {
        $("div#photo_set_stripe").css("opacity", 0.8);
    });

	//current_photo needs to be accessible from outside
	var current_photo = 1;

    //open lightbox on photo set click
    $("div#photo_set").click(function(evt) {
        evt.preventDefault();

		//add to DOM necessery elements for slideshow
		$("body").prepend("<div id='lightbox_bg'><\/div>").prepend('<div id="gotdSlideshow-215-story1315-slideshow" class="gotd_slideshow"><div id="slideshow_header"><a href="" class="left_arrow"></a><p></p><a href="" class="right_arrow"></a><a href="" class="lightbox_close" title="Close">Close</a></div><div id="slideshow_content"></div><div class="bottom-bar"><a href="" class="send-via-email">send this pic via email</a><div class="twitter-button"></div><div id="facebook-button" class="facebook-button"></div></div></div>');
		$("div.bottom-bar div.facebook-button").html('<fb:like class=" fb_edge_widget_with_comment fb_iframe_widget" href="' + hrefUrl + '" width="90" height="30" colorscheme="light" show_faces="false" layout="button_count" ref="facebook-button"></fb:like>');
		if (typeof FB  != "undefined") FB.XFBML.parse(document.getElementById('facebook-button'));
		$("div.bottom-bar div.twitter-button").html('<script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script><a href="https://twitter.com/share" class="twitter-share-button" data-url="' + makeTinyUrl(hrefUrl) + '" data-counturl="' + makeTinyUrl(hrefUrl) + '" data-text="' + twitterText + '" data-related="anywhere:The Javascript API" data-count="horizontal">Tweet</a>');

		//temp
		$("div.gotd_slideshow").css("display","block");
		var body_height = $("body").outerHeight() + 140;

        //140 is margin-top + margin-bottom
        $("div#lightbox_bg").css("height", body_height + "px");
        var top_pos = $(window).height() / 2 - 286;
        var left_pos = $(window).width() / 2 - 173;
        $("div.gotd_slideshow").css("top", top_pos).css("left", left_pos);

		//add images to the slideshow
		for (a=0; a<gotd_images.length; a++) {
			$("div#slideshow_content").append('<a href=""><img src="'+gotd_images[a].imageUrl+'" alt="'+gotd_images[a].imageAltText+'" title="'+gotd_images[a].imageAltText+'" /><span class="photographer">'+gotd_images[a].photographer+'</span></a>');
		}

        //close lightbox on lightbox background click, or close button click
        $("div#lightbox_bg, a.lightbox_close").click(function(evt) {
            evt.preventDefault();
            $("div#lightbox_bg").remove();
			$("div.gotd_slideshow").remove();
			$(document).unbind("keydown");
        });

        //how many pictures do we have?
        var how_many = $("div#slideshow_content a").length;
        $("div#slideshow_header p").html("1 of " + how_many);

        //var current_photo = 1;
        $("a.left_arrow").click(function(evt) {
            evt.preventDefault();
            if (current_photo == 1) {
                $("div#slideshow_content a:nth-child(" + current_photo + ")").css("display", "none");
                current_photo = how_many;
                $("div#slideshow_content a:nth-child(" + current_photo + ")").css("display", "block");
                $("div#slideshow_header p").html(current_photo + " of " + how_many);
            }
            else if (current_photo > 1) {
                $("div#slideshow_content a:nth-child(" + current_photo + ")").css("display", "none");
                current_photo = current_photo - 1;
                $("div#slideshow_content a:nth-child(" + current_photo + ")").css("display", "block");
                $("div#slideshow_header p").html(current_photo + " of " + how_many);
            }
        });

        $("a.right_arrow, div#slideshow_content a").click(function(evt) {
            evt.preventDefault();
            if (current_photo == how_many) {
                $("div#slideshow_content a:nth-child(" + current_photo + ")").css("display", "none");
                current_photo = 1;
                $("div#slideshow_content a:nth-child(" + current_photo + ")").css("display", "block");
                $("div#slideshow_header p").html(current_photo + " of " + how_many);
            }
            else if (current_photo < how_many) {
                $("div#slideshow_content a:nth-child(" + current_photo + ")").css("display", "none");
                current_photo++;
                $("div#slideshow_content a:nth-child(" + current_photo + ")").css("display", "block");
                $("div#slideshow_header p").html(current_photo + " of " + how_many);
            }
        });

		$(document).keydown(function(e){
	    	if (e.keyCode == 37) {
		       	if (current_photo == 1) {
	                $("div#slideshow_content a:nth-child(" + current_photo + ")").css("display", "none");
	                current_photo = how_many;
	                $("div#slideshow_content a:nth-child(" + current_photo + ")").css("display", "block");
	                $("div#slideshow_header p").html(current_photo + " of " + how_many);
	            }
	            else if (current_photo > 1) {
	                $("div#slideshow_content a:nth-child(" + current_photo + ")").css("display", "none");
	                current_photo--;
	                $("div#slideshow_content a:nth-child(" + current_photo + ")").css("display", "block");
	                $("div#slideshow_header p").html(current_photo + " of " + how_many);
	            }
		       return false;
		    }

	    	if (e.keyCode == 39) {
				if (current_photo == how_many) {
	                $("div#slideshow_content a:nth-child(" + current_photo + ")").css("display", "none");
	                current_photo = 1;
	                $("div#slideshow_content a:nth-child(" + current_photo + ")").css("display", "block");
	                $("div#slideshow_header p").html(current_photo + " of " + how_many);
	            }
	            else if (current_photo < how_many) {
	                $("div#slideshow_content a:nth-child(" + current_photo + ")").css("display", "none");
	                current_photo++;
	                $("div#slideshow_content a:nth-child(" + current_photo + ")").css("display", "block");
	                $("div#slideshow_header p").html(current_photo + " of " + how_many);
	            }
				return false;
			}

			//close on escape button press
			if (e.keyCode == 27) {
				$("div#send-pic-form").remove();
				$("div#lightbox_bg").remove();
				$("div.gotd_slideshow").remove();
				$(document).unbind("keydown");
			}
		});

		//click on send to a friend via email
		$("div.bottom-bar a.send-via-email").live("click",function(evt){
			evt.preventDefault();

			//hide slideshow, show pic, show form
			$("div.gotd_slideshow").css("display","none");

			var current_image_src = $("div#slideshow_content a:nth-child(" + current_photo + ") img").attr("src");
			var current_image_altText = $("div#slideshow_content a:nth-child(" + current_photo + ") img").attr("alt");
			$("body").prepend('<div id="send-pic-form"><a href="" class="close">Close</a><img src="'+current_image_src+'" alt="'+gotd_images[current_photo - 1].imageAltText+'" title="'+gotd_images[current_photo - 1].imageAltText+'" /><form><h3>From</h3><input type="text" value="Your name" name="Your name" /><input type="text" value="Your email" name="Your email" /><h3>To</h3><input type="text" value="Recipients name" name="Recipients name" /><input type="text" value="Recipients email" name="Recipients email" /><h3>Add message</h3><textarea name="Add your message here (optional)">Add your message here (optional)</textarea><input type="submit" value="Send" /><input type="reset" value="Reset" /></form></div>');

			//align it
			var top_pos = $(window).height() / 2 - 270;
	        var left_pos = $(window).width() / 2 - 322;

	        $("div#send-pic-form").css("top", top_pos).css("left", left_pos);

			//close it
			$("div#send-pic-form a.close").click(function(evt){
				evt.preventDefault();
				$("div#send-pic-form").remove();
				$("div.gotd_slideshow").remove();
				$("div#lightbox_bg").remove();
				$(document).unbind("keydown");
				//$("div.gotd_slideshow").css("display","block");
			});

			//on lightbox_bg click close everything
			$("div#lightbox_bg").unbind("click").click(function(){
				$("div#send-pic-form").remove();
				$("div.gotd_slideshow").remove();
				$("div#lightbox_bg").remove();
				$(this).unbind("click").click(function(evt) {
		            evt.preventDefault();
		            $("div#lightbox_bg").remove();
		            $("div.gotd_slideshow").css("display", "none");
		            $("div#slideshow_content a").css("display", "none");
		            $("div#slideshow_content a:first-child").css("display", "block");
		        });
				$("div.bottom-bar a.send-via-email").die();
				$(document).unbind("keydown");
			});

			$("div#send-pic-form a.close.sent").live("click",function(evt){
				evt.preventDefault();
				$("div#send-pic-form").remove();
	            $("div.gotd_slideshow").css("display","block");
			});

			$("div#send-pic-form input").focus(function(){
				if ($(this).attr("value") == $(this).attr("name"))
					$(this).attr("value","");
				$(this).css("border-color","#ccc");
				$("div#send-pic-form p.error_msg").remove();
				$("div#send-pic-form textarea").css("height","168px");
			});

			$("div#send-pic-form input").blur(function(){
				if ($(this).attr("value") == "")
					$(this).attr("value",$(this).attr("name"));
			});

			$("div#send-pic-form textarea").focus(function(){
				if ($(this).val() == $(this).attr("name"))
					$(this).val("");
			});

			$("div#send-pic-form textarea").blur(function(){
				if ($(this).val() == "")
					$(this).val($(this).attr("name"));
			});

			function validateEmail($email) {
				var emailReg = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/;
				if( !emailReg.test( $email ) ) {
					return false;
				} else {
					return true;
				}
			}

			var YourName = $("div#send-pic-form input[name='Your name']");
			var YourEmail = $("div#send-pic-form input[name='Your email']");
			var RecipientsName = $("div#send-pic-form input[name='Recipients name']");
			var RecipientsEmail = $("div#send-pic-form input[name='Recipients email']");

			function validateForm () {
				//validate Your Name
				if (YourName.val() == YourName.attr("name")) {
					$("div#send-pic-form textarea").css("height","148px").after("<p class='error_msg'>Please fill out your name</p>");
					YourName.css("border-color","#c33");
					return;
				}

				//validate Your Email
				if (YourEmail.val() == YourEmail.attr("name")) {
					//alert ("Please fill out your email address");
					$("div#send-pic-form textarea").css("height","148px").after("<p class='error_msg'>Please fill out your email address</p>");
					YourEmail.css("border-color","#c33");
					return;
				}

				if (!validateEmail(YourEmail.val())) {
					//alert ("Please enter your email in right format");
					$("div#send-pic-form textarea").css("height","148px").after("<p class='error_msg'>Please enter your email in right format</p>");
					YourEmail.css("border-color","#c33");
					return;
				}

				//validate Recipients name
				if (RecipientsName.val() == RecipientsName.attr("name")) {
					//alert ("Please fill out recipients name");
					$("div#send-pic-form textarea").css("height","148px").after("<p class='error_msg'>Please fill out recipients name</p>");
					RecipientsName.css("border-color","#c33");
					return;
				}

				//validate Recipients email
				if (RecipientsEmail.val() == RecipientsEmail.attr("name")) {
					//alert ("Please fill out your email address");
					$("div#send-pic-form textarea").css("height","148px").after("<p class='error_msg'>Please fill out your email address</p>");
					RecipientsEmail.css("border-color","#c33");
					return;
				}

				if (!validateEmail(RecipientsEmail.val())) {
					//alert ("Please enter recipients email in right format");
					$("div#send-pic-form textarea").css("height","148px").after("<p class='error_msg'>Please enter recipients email in right format</p>");
					RecipientsEmail.css("border-color","#c33");
					return;
				}

				return true;
			}

			//send form
			$("input[type='submit']").click(function(evt){
				evt.preventDefault();
				if (validateForm()) {
					var html = "<p class='sending'>sending...</p>";
					var loadUrl = "/template/custom/page3/sendPicByEmail.jsp";
					var TextMessage = $("div#send-pic-form form textarea");

	                $("div#send-pic-form form").css("background-color","#333").html(html).load(loadUrl, {
	                    ImageUrl: current_image_src,
	                    YourName: YourName.val(),
	                    YourEmail: YourEmail.val(),
	                    RecipientsName: RecipientsName.val(),
	                    RecipientsEmail: RecipientsEmail.val(),
	                    TextMessage: TextMessage.val()
	                }, function () {
	                    $(this).css("background-color","#F4F4F4");
						$("div#send-pic-form a.close:first-child").unbind("click").bind("click",function(evt){
							evt.preventDefault();
							$("div#send-pic-form").remove();
				            $("div.gotd_slideshow").css("display","block");
						});

						$("div#lightbox_bg").unbind("click").bind("click",function(){
							$("div#send-pic-form").remove();
				            $("div.gotd_slideshow").css("display","block");
							$(this).unbind("click").bind("click",function(){
								$("div#lightbox_bg").remove();
								$("div.gotd_slideshow").remove();
								$(document).unbind("keydown");
							});
						});
					});
				}
			});		
		});
    });	//end click on photo_set
});
//]]>