/* !Give control of the $ variable back to the library that first implemented it, if any */
jQuery.noConflict();


/* !Make jQuery wait until document can be manipulated */
jQuery(document).ready(function($)
{


	/* !Flash messages */
	$("#flashMessage").show("normal",function(){
			$("#flashMessage").fadeOut(10000);
	});


	/* !Initialze the date picker */
	$(function() {
		$(".datepicker").datepicker({
			dateFormat: 'yy-mm-dd',
			buttonImage: '/stylesheets/blueprint/plugins/silk-icons/icons/calendar_view_month.png'
		});
	});


	/* !Focus the first visible form input on page load */
	$("input[class='first']:first", document.forms[0]).focus();


	// $("#make-babies").validate();


	/* !toggle hidden divs */
	// Hide the donation box
	$(".toggleBox").hide();
	//When the user clicks the trigger button...
	$("div.trigger").click(function(){
		//Hide the 'donate' button 
		$(this).slideToggle("slow", function() {
			// Show the donation block after the 'donate' button is gone
			$("div#donate-block").slideToggle("slow", function() {
				// if the page contains a form for donations, focus the amount input
				if($("input#amount").length > 0){
					$("input#amount").focus();
				}
			});
		});
	});
	$("a.triggerBack").click(function(){
		$(".toggleBox").slideToggle("slow", function(){
			$("div.trigger").slideToggle("slow");		
		});
	});


	/* !Process donation form */
	$("button#submit-donation").click(function(){
		// append the 'processing' lightbox to the body and make sure it covers the entire page
		$("body").append('<div class="processFormFlash"><div class="processFormFlashInner roundBox bgOrange"><div class="padded"><h1>Processing Donation</h1><p>Please sit tight while we process your donation.<br/>Leaving this page may cancel your donation.</p></div></div></div>')
		$("div.processFormFlash").height($(document).height());
	});


	/* !Process payment method form */
	$("button#submit-payment-method").click(function(){
		// append the 'processing' lightbox to the body and make sure it covers the entire page
		$("body").append('<div class="processFormFlash"><div class="processFormFlashInner roundBox bgOrange"><div class="padded"><h1>Processing Payment Info</h1><p>Please sit tight while we process your payment information.</p></div></div></div>')
		$("div.processFormFlash").height($(document).height());
	});


	// Uses the jQuery AutoFill plugin to hide header login hints on focus
	$(document).ready(function(){
		$('#header-login-form #user_name').autofill({
			value: 'Username',
			defaultTextColor: '#999',
			activeTextColor: '#333'
		});
	});
	
	
	/* !Comment Replies */
	$('ul.allComments a.replyButton').click(function(){
		var h_id = $('form#comment-form input[name="parent_id"]'); //Hidden input field that listens for a parent id
		var p_id = $(this).attr("rel"); // Used the rel attribute to care the parent comment's id
		var p_au = $(this).attr("title"); // Used the title attribute to replace the comment form's headline copy
		var legend = $('h4#comment-title'); // This is the comment form's headline
		var jBody = (window.opera)? (document.compatMode=="CSS1Compat"? $('html') : $('body')) : $('html,body'); // use the proper declaration of body (browser-dependent)
		var dest = $('#post-comment-anchor').offset().top; // get the comment box's distance from top of page
		h_id.attr("value",p_id); // assign the parent_id to the hidden element
		if(p_id > 0) // replace comment form headline copy
		{
			legend.html(p_au);
		} else {
			legend.html("Post a comment");
		}
		jBody.animate({scrollTop: dest},500,null,function(){ // scroll to the comment box
			$('textarea#message').focus(); // focus the textarea
			$('textarea#message').animate({backgroundColor:"#ffc"},500);
		});
		return false; // disable link anchor event
	});



});






/* !Initialze the date picker for dynamically added rows*/
jQuery("#add-row").click(function(){
	$(".datepicker").datepicker({
		dateFormat: 'yy-mm-dd',
		buttonImage: '/stylesheets/blueprint/plugins/silk-icons/icons/calendar_view_month.png'
	});
});
	

// Javascript helper functions for ella bullis
function donateControlBlock(action)
{
	switch(action)
	{
		case 'show':
			document.getElementById('donateBlock').style.display = 'block';
			break;
		case 'hide':
			default:
			document.getElementById('donateBlock').style.display = 'none';
	}
	return true;
}


/* !Add row of baby data */
var babyCount = 1;
function addRow(id)
{
  var tbody = document.getElementById(id).getElementsByTagName('tbody')[0];
  var row = document.createElement('tr');
  row.id = 'row'+babyCount;

  var td1 = document.createElement('td');
  // td1.appendChild(document.createTextNode("column 1"))
  td1.innerHTML = '<input type="text" name="fname[]" value="" id="fname'+babyCount+'" class="text firstName required" size="20" />';

  var td2 = document.createElement('td');
  td2.innerHTML = '<input type="text" name="lname[]" value="'+document.getElementById('lname0').value+'" id="lname'+babyCount+'" class="text lastName required" size="20" />';

  var td3 = document.createElement('td');
  td3.innerHTML = '<select name="sex[]" class="required"><option value="M">Male</option><option value="F">Female</option></select>';

  var td4 = document.createElement('td');
  td4.innerHTML = '<input type="text" name="dob[]" value="'+document.getElementById('dob0').value+'" id="dob'+babyCount+'" class="text dateOfBirth required datepicker" size="10" />';

  var td5 = document.createElement('td');
  td5.innerHTML = '<input type="text" name="gest[]" value="'+document.getElementById('gest0').value+'" id="gest'+babyCount+'" class="text gestationalAge required" size="10" />';

  var td6 = document.createElement('td');
  td6.innerHTML = '<a onclick="removeElement(\'row'+babyCount+'\')" title="Delete this row"><img src="/stylesheets/blueprint/plugins/silk-icons/icons/delete.png" alt="Del" width="16" height="16" /></a>';

  row.appendChild(td1);
  row.appendChild(td2);
  row.appendChild(td3);
  row.appendChild(td4);
  row.appendChild(td5);
  row.appendChild(td6);
  tbody.appendChild(row);
  
  babyCount++;
}

/* !remove baby row */
function removeElement(id)
{  
	document.getElementById(id).parentNode.removeChild(document.getElementById(id))
}

function makeSlug() {
	var input = document.getElementById('title');
	var slug = document.getElementById('slug');
	var reRemoveNonAlphaNumeric = /[^a-zA-Z0-9 ]/g;
	var reReplaceSpaces = /\s+/g;
	
	var str = input.value;
	str = str.toLowerCase();
	str = str.replace(reRemoveNonAlphaNumeric, "");
	str = str.replace(reReplaceSpaces, "-");
	
	slug.value = str;
	
}