var idForm = '#contact';

$(document).ready(function(){

	// Handle placeholder labels

	$('label.js-placeholder')
	.addClass('placeholder')
	.each(function(){

		// Get the id of the input this label is associated with
		var label = $(this),
			idInput = label.attr('for'),
			initialText = $('#' + idInput).val();

		// Hide the label if the input has a value
		if (initialText.length > 0) {
			label.addClass('hidden');
		}

		// Handle classes
		$('#' + idInput)
		.focus(function(){
			label.addClass('faded');
		})
		.blur(function(){
			var text = $(this).val();
			if (text.length == 0) {
				label.removeClass('faded hidden');
			}
		})
		.keyup(function(){
			var text = $(this).val();
			if (text.length > 0) {
				label
				.removeClass('faded')
				.addClass('hidden');
			}
			else{
				label
				.removeClass('hidden')
				.addClass('faded');
			}
		});

	});

	/* Contact form */

	var idTextarea = '#contact-text',
		idLabel = '#contact label';

	// Expanding textarea (min and max height in pixels)
	$(idTextarea).TextAreaExpander('1em', '25em');

	// Ajaxify the form
	$(idForm).submit(function(){

		// Create our message container
		var cheers = $('#cheers');
		if (cheers.length == 0) {
			cheers = $('<p id="cheers"></p>');
			$(cheers).css({opacity: '0', position: 'absolute', left: '320px', top: '0', zIndex: '99'});
			$('#talk-to-us').css({position: 'relative'});
			$('#talk-to-us h2').after(cheers);
		}

		if ($.trim($(idTextarea).val()) == '') {
			// Set our message
			cheers.html('Don&#8217;t be shy! Type something and hit Send.');

			// Replace the paragraph with the error message.
			$('#talk-to-us p').animate({opacity: 0}, function(){
				cheers.animate({opacity: 1});
			});

			return false;
		}

		if (cheers.css('opacity') > 0) {
			cheers.animate({opacity: 0}, function(){
				send($(idForm).action, $(idForm).serialize());
			});
		}
		else {
			send($(idForm).action, $(idForm).serialize());
		}

		function send(a, d){
			$.ajax({
				type: "POST",
				url: a,
				data: d,
				success: handle
			});
		}

		function handle(message){
			// Set our message
			$('#cheers').html(message + ' <a class="close" href="javascript:;">Send another?</a>');

			// Just make the form invisible, since we want to maintain layout.
			if ($('#talk-to-us p').css('display') != 'none') {
				$('#talk-to-us p').animate({opacity: 0});
			}
			$(idForm).animate({opacity: 0}, function(){
				// Take form inputs out of tabbing order while hidden
				//$('#talk-to-us :input').attr('tabindex', '-1');
				// Link to dismiss message
				$('#cheers a.close').click(function(e){
					e.preventDefault();
					cheers.animate({opacity: 0}, function(){
						// Put form inputs back in tabbing order
						//$('#talk-to-us :input').attr('tabindex', '0');
						$('#talk-to-us textarea')
							.val('')
							.blur()
							.TextAreaExpander('1em', '25em');
						$('#talk-to-us p:not(#cheers)').animate({opacity: 1});
						$(idForm).animate({opacity: 1}, function(){
							// Focus on the textarea
							$('#talk-to-us textarea').focus();
						});
					});
				});
				$('#cheers').animate({opacity: 1}, function(){
					// Focus on the message
					$('#cheers').attr('tabindex', -1).focus();
				});
			});
		}

		return false;
	});


// iPad fix from Matthew Pennell: http://www.thewatchmakerproject.com/blog/how-to-fix-the-broken-ipad-form-label-click-issue/
//if (navigator.userAgent.match(/iPhone/i) || navigator.userAgent.match(/iPod/i) || navigator.userAgent.match(/iPad/i)) {
if (navigator.userAgent.match(/iPad/i)) {
 $('label[for]').click(function () {
  var el = $(this).attr('for');
  if ($('#' + el + '[type=radio], #' + el + '[type=checkbox]').attr('selected', !$('#' + el).attr('selected'))) {
   return;
  } else {
   $('#' + el)[0].focus();
  }
 });
}


});


/**
 * TextAreaExpander plugin for jQuery
 * v1.0
 * Expands or contracts a textarea height depending on the
 * quatity of content entered by the user in the box.
 *
 * By Craig Buckler, Optimalworks.net
 *
 * As featured on SitePoint.com:
 * http://www.sitepoint.com/blogs/2009/07/29/build-auto-expanding-textarea-1/
 *
 * Please use as you wish at your own risk.
 */

/**
 * Usage:
 *
 * From JavaScript, use:
 *	   $(<node>).TextAreaExpander(<minHeight>, <maxHeight>);
 *	   where:
 *		 <node> is the DOM node selector, e.g. "textarea"
 *		 <minHeight> is the minimum textarea height in pixels (optional)
 *		 <maxHeight> is the maximum textarea height in pixels (optional)
 *
 * Alternatively, in you HTML:
 *	   Assign a class of "expand" to any <textarea> tag.
 *	   e.g. <textarea name="textarea1" rows="3" cols="40" class="expand"></textarea>
 *
 *	   Or assign a class of "expandMIN-MAX" to set the <textarea> minimum and maximum height.
 *	   e.g. <textarea name="textarea1" rows="3" cols="40" class="expand50-200"></textarea>
 *	   The textarea will use an appropriate height between 50 and 200 pixels.
 */

/**
 * Upgrades by Jon Gibbins
 * 26 Nov 2009	Now accepts minHeight and maxHeight
 */

(function($) {

	// jQuery plugin definition
	$.fn.TextAreaExpander = function(minHeight, maxHeight) {

		var hCheck = !($.browser.msie || $.browser.opera),
			emPixels = getEmPixels();

		// if we have set units, calculate pixel equivalents
		if (typeof minHeight == 'string') {
			if (minHeight.substring(minHeight.length - 2) == 'em') {
				minHeight = minHeight.substring(0, minHeight.length - 2) * emPixels;
			}
		}
		if (typeof maxHeight == 'string') {
			if (maxHeight.substring(maxHeight.length - 2) == 'em') {
				maxHeight = maxHeight.substring(0, maxHeight.length - 2) * emPixels;
			}
		}

		// resize a textarea
		function ResizeTextarea(e) {

			// event or initialize element?
			e = e.target || e;

			// find content length and box width
			var vlen = e.value.length, ewidth = e.offsetWidth;
			if (vlen != e.valLength || ewidth != e.boxWidth) {

				if (hCheck && (vlen < e.valLength || ewidth != e.boxWidth)) e.style.height = "0px";
				var h = Math.max(e.expandMin, Math.min(e.scrollHeight, e.expandMax));

				e.style.overflow = (e.scrollHeight > h ? "auto" : "hidden");
				e.style.height = h + "px";

				e.valLength = vlen;
				e.boxWidth = ewidth;
			}

			return true;
		};

		function getEmPixels(elTarget){
			if (typeof elTarget == "undefined") {
				elTarget = document.getElementsByTagName('body')[0];
			}
			else if (typeof elTarget == "string") {
				elTarget = document.getElementById(elTarget);
			}

			if (elTarget == null) {
				return false;
			}

			var tempDiv = document.createElement("DIV");
			tempDiv.style.height = 1 + "em";
			tempDiv.style.position = "absolute";
			tempDiv.style.left = "-999px";
			elTarget.appendChild(tempDiv);

			emPixelHeight = tempDiv.offsetHeight;

			elTarget.removeChild(tempDiv);

			return emPixelHeight;
		}

		// initialize
		this.each(function() {

			// is a textarea?
			if (this.nodeName.toLowerCase() != "textarea") return;

			// set height restrictions
			var p = this.className.match(/expand(\d+)\-*(\d+)*/i);
			this.expandMin = minHeight || (p ? parseInt('0'+p[1], 10) : 0);
			this.expandMax = maxHeight || (p ? parseInt('0'+p[2], 10) : 99999);

			// initial resize
			ResizeTextarea(this);

			// zero vertical padding and add events
			if (!this.Initialized) {
				this.Initialized = true;
				$(this).css("padding-top", 0).css("padding-bottom", 0);
				$(this).bind("keyup", ResizeTextarea).bind("focus", ResizeTextarea);
			}
		});

		return this;
	};

})(jQuery);