$(document).ready(function() {
						   
	
	// Clear & Refill fields
	//autoFill($("#realname"), "Name");

	function autoFill(id, v){
		$(id).css({ color: "#b2adad" }).attr({ value: v }).focus(function(){
			if($(this).val()==v){
				$(this).val("").css({ color: "#333" });
			}
		}).blur(function(){
			if($(this).val()==""){
				$(this).css({ color: "#b2adad" }).val(v);
			}
		});
	}
	
	
	
	
		// Hide stuff
	$("#writeyourownInfo").hide();
	
	
	
	
	///////////////////////////////////////////////////////
	// SEND A CARD PAGE ///////////////////////////////////
	///////////////////////////////////////////////////////
	
	// 1. Change color
	
	$("#color label").click(function () {						 	
		$("#color label").removeClass("checked");
		$(this).addClass("checked");
	});
	$(".red").click(function () {						 	
		$("#content").css("background-position","left");
		$("#preview-reason .reson-color").text("Red");
	});
	$(".yellow").click(function () {						 	
		$("#content").css("background-position","right");
		$("#preview-reason .reson-color").text("Yellow");
		
	});
	
	

	


	// 2A. Click on premade messages in left column. Update preview and textarea
	$("#pre-made-messages li").click(function () {	
		var premademessage = $("label",this).text();	
		
		
		showAndHidePreview();
		
		$("#preview-card h1").text(premademessage);
		$("#sendcard #writeyourown").attr("value", premademessage);
		
		// Hide and uncheck "save in card achive" and reset number
		$("#writeyourownInfo").hide();
		$("input#archive").attr("checked", false);
		$(".write-your-own span#char").text("100");
		$(".write-your-own span#char-text").text("character limit");
	
	
	
	});
	
	
	
	


	
	
	
	// 2B. Typing in the "Write your own field"
	$("#sendcard #writeyourown").keyup(function () {	
		
		var charLength = $(this).val().length;
		charLength = (100 - charLength);									 
		var writeyourown = $(this).val();										
		 
		showAndHidePreview();
		
		$("#writeyourownInfo").slideDown();
		
		
		// uncheck pre-made messages
		$("#pre-made-messages input").attr("checked", false);
		
		// update character count
		$(".write-your-own span#char").text(charLength);
		$(".write-your-own span#char-text").text("characters left");		 
		 if (charLength < 0) {
			  $(".write-your-own span#char").addClass("overlimit");
		 } else {
			 $(".write-your-own span#char").removeClass("overlimit");
		 }
		 
		 // update preview message
		$("#preview-card h1").text(writeyourown);
		 
	});
	
	
	
	// 3. Typing in "sender" and "reason" fields. Update preview. 
	$("#sendcard #sender_name").keyup(function () {	
		showAndHidePreview();
		var sendertext = $(this).val();										
		$(".sender-text").text(sendertext);	
		$("span.sender-text").removeClass("notfilledin");
		$("#sender_name").css("border-color","#CFCFCF");
	});
	
	$("#sendcard #sending_reason").keyup(function () {	
		showAndHidePreview();
		var reasontext = $(this).val();										
		$(".reason-text").text(reasontext);	 
		$("span.reason-text").removeClass("notfilledin");
		$("#sending_reason").css("border-color","#CFCFCF");
	});
	
	
	// 3 (alt). Clicking on [Enter info on left] text in preview. 
	$("span.sender-text").click(function () {	
		$("#sender_name").focus();
		$("#sender_name").css("border-color","#000");
	});
	
	$("span.reason-text").click(function () {	
		$("#sending_reason").focus();
		$("#sending_reason").css("border-color","#000");
		
	});
	
	
	
	
	// 4. terms and conditions
	$("input#termsconditions-modal").click(function () {	
		$("input#termsconditions").attr("checked", true);
	
		// close modal
		tb_remove();		
	});
	
	
	
	
	// 5. Validate new card submission
	
	
	// reset alert borders if fixed
	$("#pre-made-messages li").click(function () {
		$("#pre-made-messages").css("border","none");
		$("#writeyourown").css("border-color","#CFCFCF");
	});
	
	$("#writeyourown").keyup(function () {
		if ($(this).val() != "") {
			$("#pre-made-messages").css("border","none");
			$(this).css("border-color","#CFCFCF");
		}
	});
	
	$("#sender_name, #sender_email, #recipient_email, #sending_reason").keyup(function () {
		if ($(this).val() != "") {
			$(this).css("border-color","#CFCFCF");
		}
	});
	
	
	
	$("form#coL_preview_FORM").submit(function() {
	
		var $returnvalue = true;
		var $alertmessage = "";
		
		// reset alerts
		$("#writeyourown").css("border-color","#CFCFCF");
		$("#send-receive-info input").css("border-color","#CFCFCF");
		
		
		// has a color been chosen?
		if ($("input.choose-color").is(":checked")) {} else {
			$alertmessage = "Choose a color! \n";
			var $returnvalue = false;
		}
			
		
		// has a message been chosen or written?
		if ($("#writeyourown").val() == "") {
			if ($("input.premade").is(":checked")) {} else {
				$("#writeyourown").focus();
				$("#writeyourown").css("border-color","red");
				$("#pre-made-messages").css("border","2px solid red").css("padding","3px 1px 3px 3px");
				$alertmessage = $alertmessage + "Choose a message or write your own! \n";
				var $returnvalue = false;
			}
		}
		
		
		// entered their name?
		if ($("#sender_name").val() == "") {
				$("#sender_name").css("border-color","red");
				$("#sender_name").focus();
				$alertmessage = $alertmessage + "Enter the sender's name. \n";
				var $returnvalue = false;
		}
		
		// entered their email?
		if ($("#sender_email").val() == "") {
				$("#sender_email").css("border-color","red");
				$("#sender_email").focus();
				$alertmessage = $alertmessage + "Enter the sender's email address. \n";
				var $returnvalue = false;
		}
		
		// entered recipient email?
		if ($("#recipient_email").val() == "") {
				$("#recipient_email").css("border-color","red");
				$("#recipient_email").focus();
				$alertmessage = $alertmessage + "Enter the recipient's email address. \n";
				var $returnvalue = false;
		}
		
		
		// entered reason?
		if ($("#sending_reason").val() == "") {
				$("#sending_reason").css("border-color","red");
				$("#sending_reason").focus();
				$alertmessage = $alertmessage + "Enter the reason they're receiving this card. \n";
				
				var $returnvalue = false;
		}
		
		// terms and conditions
		if ($("input#termsconditions").is(":checked")) {} else {
				
				//$("#terms span").css("border","1px solid red");
				$("#terms span").focus();
				$alertmessage = $alertmessage + "You MUST check the Terms and Conditions box. \n";
				
				var $returnvalue = false;
		}
		
		
	
		
		if ($alertmessage != "") {
			alert($alertmessage);
		}
		return $returnvalue;
	
		
	});
	
	
	
	// Function that shows preview and hides placeholder
	 function showAndHidePreview() {
		 
		 $("#preview-placeholder").hide();
		 $("#preview-card").show();
		 $("#preview-reason").show();
		 
	 }
	
	
	
	
	///////////////////////////////////////////////////////
	// Left Column form (all pages except Send A Card) ////
	///////////////////////////////////////////////////////
	
	
	
	// click a color
	$("#coL_non_preview_FORM #color label.red").click(function () {	
		$(".getArchiveMessageColor").attr("value", "r");
		this.form.submit();
	});
	
	$("#coL_non_preview_FORM #color label.yellow").click(function () {	
		$(".getArchiveMessageColor").attr("value", "y");
		this.form.submit();
	});
	
	
	// click a premade message
	$("#coL_non_preview_FORM #pre-made-messages label").click(function () {	
		var premademessage = $(this).text();	
		$(".getArchiveMessage").attr("value", premademessage);
		this.form.submit();
	});
	
	
	// click inputs and textareas
	$("#coL_non_preview_FORM #writeyourown, #coL_non_preview_FORM input, #coL_non_preview_FORM #sending_reason").click(function () {	
		this.form.submit();
	});
	
	
	
	
	
	
	
	///////////////////////////////////////////////////////
	// RECENTLY SENT CARD ARCHIVE PAGE ////////////////////
	///////////////////////////////////////////////////////
	
	// Put chosen archive message and color into hidden fields then submit
	$(".recently-sent-card-archive #archive-messages li input").click(function () {	
		
		var putArchiveMessage = $(this).next().text();
		$("#getArchiveMessage").attr("value", putArchiveMessage);
		
	
		if ($(this).next().hasClass("yellow") == true) {
			$("#getArchiveMessageColor").attr("value", "y");
		} else {
			$("#getArchiveMessageColor").attr("value", "r");
		}
		
		this.form.submit();
		
	
	});
	
	
	
	///////////////////////////////////////////////////////
	// RECENTLY SENT CARD ARCHIVE MODAL //////////////////
	///////////////////////////////////////////////////////
	
	// 1A. IF ON SEND A CARD PAGE
	// Update radio button, color, message, textarea in left column
	$(".recently-sent-card-archive-modal #archive-messages .on-send-a-card-page label").click(function () {	
			
		
			// uncheck pre-made messages
			$("#pre-made-messages input").attr("checked", false);
		
		
			// swap preview
			showAndHidePreview();
			
			// update preview text and textarea
			var archivedmessage = $(this).text();	
			$("#preview-card h1").text(archivedmessage);
			$("#sendcard #writeyourown").attr("value", archivedmessage);
			
			// update color
			$("#color label").removeClass("checked");
			$("#color input").attr("checked", false);
		
			
			if ($(this).hasClass("yellow") == true) {
				$("#color label.yellow").addClass("checked");
				$("#color input:last").attr("checked", true);
			} else {
				$("#color label.red").addClass("checked");
				$("#color input:first").attr("checked", true);
			}
			
	
			
			// close modal
			tb_remove();
	
	});
	
	
	// 1A. IF NOT ON SEND A CARD PAGE
	
	$(".recently-sent-card-archive-modal #archive-messages li input").click(function () {	
		
		var putArchiveMessage = $(this).next().text();
		$("#getArchiveMessage").attr("value", putArchiveMessage);
		
	
		if ($(this).next().hasClass("yellow") == true) {
			$("#getArchiveMessageColor").attr("value", "y");
		} else {
			$("#getArchiveMessageColor").attr("value", "r");
		}
		
		this.form.submit();
		
	
	});
	
	
	
	
	
	
	
	

});



function externalLinks() {
 if (!document.getElementsByTagName) return;
 var anchors = document.getElementsByTagName("a");
 for (var i=0; i<anchors.length; i++) {
   var anchor = anchors[i];
   if (anchor.getAttribute("href") &&
       anchor.getAttribute("rel") == "external")
     anchor.target = "_blank";
 }
}
window.onload = externalLinks;



// Left Column //