// apply inline-box only for mozilla
if( jQuery.browser.mozilla ) {
	// do when DOM is ready
	$( function() {
		// search form, hide it, search labels to modify, filter classes nocmx and error
		$( 'form.cmxform' ).hide().find( 'p>label:not(.nocmx):not(.error)' ).each( function() {
			var $this = $(this);
			var labelContent = $this.html();
			var labelWidth = document.defaultView.getComputedStyle( this, '' ).getPropertyValue( 'width' );
			// create block element with width of label
			var labelSpan = $("<span>")
				.css("display", "block")
				.width(labelWidth)
				.html(labelContent);
			// change display to mozilla specific inline-box
			$this.css("display", "-moz-inline-box")
				// remove children
				.empty()
				// add span element
				.append(labelSpan);
		// show form again
		}).end().show();
	});
};



/* Custom Error Message for the For Validation */

/*
$.validator.setDefaults({
 submitHandler: function() { alert("submitted!"); }
});
*/

$().ready(function() {
 // validate the comment form when it is submitted
 $("#commentForm").validate();

 // validate signup form on keyup and submit
 $("#signupForm").validate({
 rules: {
 firstname: "required",
 lastname: "required",
 username: {
 required: true,
 minlength: 2
 },
 password: {
 required: true,
 minlength: 5
 },
 confirm_password: {
 required: true,
 minlength: 5,
 equalTo: "#password"
 },
 email: {
 required: true,
 email: true
 },
 topic: {
 required: "#newsletter:checked",
 minlength: 2
 },
 agree: "required"
 },
 messages: {
 firstname: "Please enter your firstname",
 lastname: "Please enter your lastname",
 username: {
 required: "Please enter a username",
 minlength: "Your username must consist of at least 2 characters"
 },
 password: {
 required: "Please provide a password",
 minlength: "Your password must be at least 5 characters long"
 },
 confirm_password: {
 required: "Please provide a password",
 minlength: "Your password must be at least 5 characters long",
 equalTo: "Please enter the same password as above"
 },
 email: "Please enter a valid email address",
 agree: "Please accept our policy"
 }
 });

 // propose username by combining first- and lastname
 $("#username").focus(function() {
 var firstname = $("#firstname").val();
 var lastname = $("#lastname").val();
 if(firstname && lastname && !this.value) {
 this.value = firstname + "." + lastname;
 }
 });

 // check if confirm password is still valid after password changed
 $("#password").blur(function() {
 $("#confirm_password").valid();
 });

 //code to hide topic selection, disable for demo
 var newsletter = $("#newsletter");
 // newsletter topics are optional, hide at first
 var inital = newsletter.is(":checked");
 var topics = $("#newsletter_topics")[inital ? "removeClass" : "addClass"]("gray");
 var topicInputs = topics.find("input").attr("disabled", !inital);
 // show when newsletter is checked
 newsletter.click(function() {
 topics[this.checked ? "removeClass" : "addClass"]("gray");
 topicInputs.attr("disabled", !this.checked);
 });
 
  // Apply Styles For Form Fiedls
 
 $('input[type="checkbox"],input[type="text"],input[type="password"],textarea,select').addClass("idleField"); 
 $('input[type="checkbox"],input[type="text"],input[type="password"],textarea,select').focus(function() { 
    $(this).removeClass("idleField").addClass("focusField"); 
}); 

$('input[type="checkbox"],input[type="text"],input[type="password"],textarea,select').blur(function() { 
  $(this).removeClass("focusField").addClass("idleField"); 

 }); 
 
 
 
 
});
