$(document).ready(function(){

    /*-------------- FORMS (text, password, textarea) --------------*/
    $('input:text[rel], input:password[rel], textarea[rel]').each(function(){
        if( $(this).attr('disabled') != 'disabled' ){
            if( $(this).val() == '' ){
                var l = $(this).position().left;
                var t = $(this).position().top;
                $(this).before('<label for="'+ $(this).attr('id') +'" class="val" style="left:'+ l +'px; top:'+ t +'px;">'+ $(this).attr('rel') +'</label>');
                if( $(this).hasClass('iconized') ){
                    $(this).prev('label.val').css('textIndent', '23px')
                }
            }
        }
    });

    $('input:text, input:password, textarea')
    .focus(function(){
        if( $(this).val() == '' ){
            $(this).prev('.val').fadeOut(300);
        }
    })
    .blur(function(){
        if( $(this).val() == '' ){
            $(this).prev('.val').fadeIn(300);
        }
    });

    $('label.val')
    .click(function(){
        if( $(this).next('input').val() == '' ){
            $(this).fadeOut(300, function(){
                $(this).next('input').focus();
            });
        }
    });


    /*-------------- CHECKBOX --------------*/
    $('input:checkbox').each(function(){
        var l = $(this).position().left;
        var t = $(this).position().top + 2;
        $(this).before('<label for="'+ $(this).attr('id') +'" class="chkbx" style="left:'+ l +'px; top:'+ t +'px;">&nbsp;</label>');

        if( $(this).attr('checked') == 'checked' ){
            $(this).prev('.chkbx').addClass('chkd');
        }
    });

    $('.chkbx, input:checkbox + label').click(function(){
        var i = $(this).attr('for');
        if ( $('#'+i).attr('checked') == null ){
            $('#'+i).prev('.chkbx').addClass('chkd');
        }else{
            $('#'+i).prev('.chkbx').removeClass('chkd');
        }
    });


    /*-------------- RADIO BUTTONS --------------*/
    $('input:radio').each(function(){
        var l = $(this).position().left;
        var t = $(this).position().top + 2;
        $(this).before('<label for="'+ $(this).attr('id') +'" class="radioBtn" style="left:'+ l +'px; top:'+ t +'px;">&nbsp;</label>');

        if( $(this).attr('checked') == 'checked' ){
            $(this).prev('.radioBtn').addClass('chkd');
        }
    });

    $('.radioBtn, input:radio + label').click(function(){
        var i = $(this).attr('for');
        var n = $('#'+ i).attr('name');
        if ( $('#'+i).attr('checked') == null ){
            $('input:radio[name="'+ n +'"]').prev('.radioBtn').removeClass('chkd');
            $('#'+i).prev('.radioBtn').addClass('chkd');
        }
    });


    /*-------------- SELECT (custom style) --------------*/
	$('select').each(function(){
	    var title = $(this).attr('title');
		if( $(this).attr('multiple') == null ){
    		if( $('option:selected', this).val() != '' ){
                title = $('option:selected',this).text();
                var w = $(this).width()-14;
                var l = $(this).position().left;
                var t = $(this).position().top;
                $(this)
                .before('<label for="'+ $(this).attr('id') +'" class="selectVal" style="width:'+ w +'px; left:'+ l +'px; top:'+ t +'px;">'+ title +'<em><!--&nbsp;--></em></label>')
                .change(function(){
                    val = $('option:selected',this).text();
                    $(this).prev('.selectVal').html(val + '<em><!--&nbsp;--></em>');
                });
            }
        }
	});


    /*-------------- FILE --------------*/
    $('.iFile').each(function(){
        var r = $(this).find('input:file').attr('rel');
        $(this).append(r);
    }).change(function(){
        var ifd = $(this).find('input:file').val();
        $('.iFileDescription').text(ifd);
    });

    $('.deleteFile').click(function(){
        $(this).prev('.iFile').find('input:file').attr('value', '');
        $('.iFileDescription').text(' ');
    });


    /*-------------- FORM ICONS --------------*/
    $('.iconized').each(function(){
        if( ($(this).attr('type') == 'text') || ($(this).attr('type') == 'password')){
            var t = $(this).position().top + 8;
            var l = $(this).position().left + 7;
            var w = $(this).width() + 3;
            var iconizedWidth = $(this).width() - 10;

            $(this).next('.iIconInBefore').css({left:l, top:t});
            $('.iIconInBefore').prev('input.iconized').css({width:iconizedWidth, padding:'7px 7px 7px 28px'});

            $(this).next('.iIconInAfter').css({left:w, top:t});
            $('.iIconInAfter').prev('input.iconized').css({width:iconizedWidth, padding:'7px 28px 7px 7px'});
        }

        if( ($(this).attr('type') == 'button') || ($(this).attr('type') == 'submit')){
            var t = $(this).position().top+9;
            var l = $(this).position().left;
            var w = l + $(this).width() + 21;

            $(this).after('<em class="iIcon '+ $(this).attr('rel') +'" style="left:'+ w +'px; top:'+ t +'px;">icon</em>');
        }
    });



    /*-------------- ERROR MESSAGES --------------*/
    $('ul.error').each(function(){
        var r = $(this).prev('input.error').width()+24;
        var t = $(this).height();

        $(this).css({right:r});
        $(this).css({top:-t});
    });

    $('input.error, textarea.error')
    .hover(function(){
        $(this).next('ul.error').stop().fadeIn(200);
    }, function(){
        if (!$(this).is(':focus')){
            $(this).next('ul.error').fadeOut(100);
        }
    })
    .focus(function(){
        $(this).next('ul.error').stop().show().css({display:'block', opacity:1});
    })
    .blur(function(){
        $(this).next('ul.error').stop().fadeOut(100);
        false;
    });


    /*-------------- VALIDATE --------------*/
    if($('#contact_form').length > 0){
        $('#contact_form').validate({
            errorElement:       'div',
    	    errorClass:         'error',
            rules: {
                iName:{
                    required:   true,
                    minlength:  2
                },
                iEmail:{
                    required:   true,
                    email:      true
                },
                iMsj:{
                    required:   true,
                    minlength:  10
                }
            },
            messages: {
                iName:{
                    required:   "<span class='icon alert'><!-- --></span>Please enter your name",
                    minlength:  "<span class='icon alert'><!-- --></span>Your name must be at least 2 characters long"
                },
        	    iEmail:{
        	        required:   "<span class='icon alert'><!-- --></span>Please enter an email address",
                    email:      "<span class='icon alert'><!-- --></span>Please enter a valid email address"
                },
        	    iMsj:{
        	        required:   "<span class='icon alert'><!-- --></span>Please enter a comment"
                }
        	},
            submitHandler: function(form){
                $.ajax({
                    type: "POST",
                    url: "bin/sendmail.php",
                    data: $(form).serialize(),
                    success: function(){
                        $('#contact_form').animate({opacity:0}, 300 , function(){
                            $('#contact_form').html("<div class='message'><h2>Thank you!</h2><p>We will get back you shortly.</p></div>").animate({opacity:1});
                        });
                    }
                });
                return false;
            }
        });
    }

});//DOM ready end