/*
 * jquery.html5formvalidation.js
 *
 * Description:    Validation for HTML5 <form>
 * Date:           2010-01-1918:30:00+09:00
 * Author:         Ayumi Fujii<fujiiayumi@gmail.com>
 * Copylight:      (c) DaLaFarm co.,ltd.<info@dalafarm.net> http://webdeg.dalafarm.net
 * Lisence:        Under the MIT and GPL licenses.
*/

/* console.log(_form); */


(function(jQuery){
    jQuery.fn.validation = function(options){

        var _form = this;

        var invaildElements = $([]);

        var validationClass = {

            init : function(){

                validationClass.placeholder.init();
				$(':input',_form).not("#submit")
				.bind({
					  blur  : validationClass.animate.blur,
					  focus : validationClass.animate.focus
				});
                validationClass.autofocus.init();
                validationClass.validation.init();
            },

            style :{

                hide  : { 'color':'#ffffff', 'backgroundColor': '#ffffff', 'borderBottomColor': '#cccccc', 'borderLeftColor': '#cccccc', 'borderRightColor': '#cccccc', 'borderTopColor': '#cccccc', 'outlineColor': '#cccccc' },
                blur  : { 'color':'#aaaaaa', 'backgroundColor': '#ffffff', 'borderBottomColor': '#cccccc', 'borderLeftColor': '#cccccc', 'borderRightColor': '#cccccc', 'borderTopColor': '#cccccc', 'outlineColor': '#cccccc' },
                focus : { 'color':'#000000', 'backgroundColor': '#f5ffcf', 'borderBottomColor': '#92ba34', 'borderLeftColor': '#92ba34', 'borderRightColor': '#92ba34', 'borderTopColor': '#92ba34', 'outlineColor': '#92ba34' },
                error : { 'color':'#ff0000', 'backgroundColor': '#ffd8d8', 'borderBottomColor': '#ba3434', 'borderLeftColor': '#ba3434', 'borderRightColor': '#ba3434', 'borderTopColor': '#ba3434', 'outlineColor': '#ba3434'}

            },

            animate : {

                hide  : function(){ $(this).stop().animate(validationClass.style.hide); },
                blur  : function(){ $(this).stop().animate(validationClass.style.blur); },
                focus : function(){ $(this).stop().animate(validationClass.style.focus); },
                error : function(){ $(this).stop().animate(validationClass.style.error); }

            },

            placeholder : {

                init : function(){
                    $(':input[placeholder]',_form)
                    .each(validationClass.placeholder.show)
                    .css(validationClass.style.hide)
                    .animate(validationClass.style.blur)
                    .bind({
                        blur  : validationClass.placeholder.show,
                        focus : validationClass.placeholder.hide
                    });

                },

                show : function(){
                    $this = $(this);
                    if($this.val() == '')
                        $this.val($this.attr('placeholder'));
                },

                hide : function(){
                    $this = $(this);
                    if ( $this.val() == $this.attr('placeholder')){
                        $this.val('');
                    }
                }

            },

            autofocus : {

                init : function(){
                    $(':input[autofocus=autofocus]:eq(0)',_form).val('').focus();
                }

            },

            validation : {
                init : function(){
                    _form.submit(validationClass.validation.check.submit);
                },

                check : {

                    submit : function(){
                        var allElements = $('input,textarea',_form);
                        invaildElements = $([]);

                        allElements.removeClass('requireError patternError');
                        validationClass.validation.check.removeError( allElements );

                        $('[pattern]',_form)
                        .each(validationClass.validation.check.pattern);
						
                        $('[required=required]',_form)
                        .each(validationClass.validation.check.requied);

                        if(invaildElements.length > 0){
                            invaildElements.each(validationClass.validation.check.displayError);
                            return false;
                        }
                    },

                    blur : function(){
                        var Element = $(this);
                        Element.removeClass('requireError patternError');
                        validationClass.validation.check.removeError(Element);
                        if(Element.attr('pattern')) validationClass.validation.check.pattern;
                        if(Element.attr('requied')) validationClass.validation.check.requied;

                    },

                    requied : function(){

                        var Element = $(this);

                        if(Element.val()=='' || Element.val() == Element.attr('placeholder')){
                            Element.addClass('requireError').animate(validationClass.style.error);
                            invaildElements = invaildElements.add(Element);
                            }
                            else {
                                Element.removeClass('requireError').animate(validationClass.style.blur);
                            }

                    },

                    pattern : function(){

                        var Element = $(this);
                        var pattern = new RegExp( '^(?:'+Element.attr('pattern')+')$' );

                        if(!pattern.test(Element.val()) && Element.val() != Element.attr('placeholder')){
                            Element.addClass('patternError').animate(validationClass.style.error);
                            invaildElements = invaildElements.add(Element);
                            }
                            else {
                                Element.removeClass('patternError').animate(validationClass.style.blur);
                            }

                    },

                    displayError : function(){

                        var Element = $(this);
                        var errorMsg = Element.attr('title') ? Element.attr('title') : 'There was an error with this field';

                        Element.after('<label for="' + Element.attr('id') + '" class="errorMsg">' + errorMsg + '</label>')
                        .addClass('hasError');
                    },

                    removeError : function(Elements) {
                        Elements.removeClass('hasError');
                        Elements.siblings('label.errorMsg').remove();
                    }

                }
            }
        }

        validationClass.init();
    }
})(jQuery);