var fasoon = fasoon || {};

(function (ns, $) {
    "use strict";

    ns.FormBackground = function () {
        this.construct.apply(this, arguments);
    };

    var proto = ns.FormBackground.prototype;

    proto.construct = function () {
        this.form = $('.fasoon-quote-form');
        if (!this.form.length) {
            return;
        }
        $('input[type=text]', this.form)
            .on('focus', $.proxy(this.onFilled, this))
            .on('blur', $.proxy(this.onFilled, this));

        $('textarea', this.form)
            .on('focus', $.proxy(this.onFilled, this))
            .on('blur', $.proxy(this.onFilled, this));

        $('input[type=email]', this.form)
            .on('focus', $.proxy(this.onFilled, this))
            .on('blur', $.proxy(this.onFilled, this));

        $('input[type=phone]', this.form)
            .on('focus', $.proxy(this.onFilledPhone, this))
            .on('blur', $.proxy(this.onFilledPhone, this));
    };

    proto.onFilled = function (ev) {
        var el = $(ev.target);
        if (el.val()) {
            if (!el.hasClass('filled')) {
                el.addClass('filled');
            }
        } else {
            el.removeClass('filled');
        }
    };

    proto.onFilledPhone = function (ev) {
        var el = $(ev.target);
        if (el.val().length > 3) {
            if (!el.hasClass('filled')) {
                el.addClass('filled');
            }
        } else {
            el.removeClass('filled');
        }
    };
})(fasoon, jQuery);

jQuery(document).ready(function () {
    new fasoon.FormBackground();
});