/*!
 * HTML5 Form Fallback
 * http://www.sitebase.be
 *
 * Copyright (c) 2010 Sitebase
 *
 * Date: 16th September, 2010
 * Version : 1.00
 *
 * === FEATURES ===
 * - Add placeholder for older browsers
 * - Add autofocus for older browsers
 * - Add form validation (email, url, number)
 *
 * === HOW TO USE ===
 * 1. You can style the placeholder in your CSS by styling the class .placeholder
 * 2. Add invalid class to your CSS
	.invalid{
		// style here
	}
	Don't add it to the same selector as :invalid because it will not work
	in IE this way:
	input:invalid, .invalid{
		// style here
	}
 * 3. Include this script just before the closing body tag.
 */

// Create input element to do tests
var input = document.createElement('input');

// Add placeholder support for non HTML5 browsers
var support_placeholder = 'placeholder' in input;
if(!support_placeholder){
	$(':input[placeholder]').each(function() {
		var $$ = $(this);
		if($$.val() === '') {
	   
			$$.addClass('placeholder');
			$$.val($$.attr('placeholder'));
		}
		$$.focus(function() {
			$$.addClass('focus');
			if($$.val() === $$.attr('placeholder')) {
				$$.val('');
				$$.removeClass('placeholder');
			}
		}).blur(function() {
			$$.removeClass('focus');
			if($$.val() === '') {
				$$.addClass('placeholder');
				$$.val($$.attr('placeholder'));
			}
		});
	});
}

// Add autofocus support for non HTML5 browsers
var support_autofocus = 'autofocus' in input;
if(!support_autofocus){
	$('input[autofocus]').eq(0).focus();
}else{
	// Fix for opera
	$('input[autofocus]').eq(0).val('');	
	$('input[autofocus]').eq(0).removeClass('placeholder');
}

// Handler form validation
$('input,textarea').keyup(function() {
	validate(this);
});

// Validate an element
function validate(element){
	var $$ = $(element);
	var validator = element.getAttribute('type'); // Using pure javascript because jQuery always returns text in none HTML5 browsers
	var valid = true;
	var apply_class_to = $$;
	
	var required = element.getAttribute('required') == null ? false : true;
	switch(validator){
		case 'email': valid = is_email($$.val()); break;
		case 'url': valid = is_url($$.val()); break;
		case 'number': valid = is_number($$.val()); break;
	}
	
	// Extra required validation
	if(valid && required && $$.val().replace($$.attr('placeholder'), '') == ''){
		valid = false;
	}
	
	// Set input to valid of invalid
	if(valid || (!required && $$.val() == '')){
		apply_class_to.removeClass('invalid');
		apply_class_to.addClass('valid');
		return true;
	}else{
		apply_class_to.removeClass('valid');
		apply_class_to.addClass('invalid');
		return false;
	}
}

// Add required class to inputs
$(':input[required]').addClass('required');

// Block submit if there are invalid classes found
$('form').submit(function() {
	$('input,textarea').each(function() {
		validate(this);
	});
	if(($(this).find(".invalid").length) == 0){
		// Delete all placeholder text
		$('input,textarea').each(function() {
			if($(this).val() == $(this).attr('placeholder')) $(this).val('');
		});
		return true;
	}else{
		return false;
	}
});


function is_email(value){
	return (/^([a-z0-9])(([-a-z0-9._])*([a-z0-9]))*\@([a-z0-9])(([a-z0-9-])*([a-z0-9]))+(\.([a-z0-9])([-a-z0-9_-])?([a-z0-9])+)+$/).test(value);
}

function is_url(value){
	return (/^(http|https|ftp):\/\/([A-Z0-9][A-Z0-9_-]*(?:\.[A-Z0-9][A-Z0-9_-]*)+):?(\d+)?\/?/i).test(value);
}

function is_number(value){
	return (typeof(value) === 'number' || typeof(value) === 'string') && value !== '' && !isNaN(value);
}