rivets-error-binder.js 3.31 KB
define(['rivets'], function(rivets) {
    var diveIntoObject = function(obj, keypath, callback) {
        if (!keypath) {
            return callback(obj, null);
        }
        //return callback(obj, keypath);
        var keyparts = keypath.replace(/^:/, '').split(/\./);
        //console.log('diveIntoObject(keyparts):', obj, keyparts);
        while (keyparts.length > 1) {
            var part = keyparts.shift();
            if (part.length == 0) {
                continue;
            }
            //console.log('diveIntoObject:', obj, part);
            obj = doObjectRead(obj, part);
        }
        //console.log('callback:', obj, keyparts[0]);
        return callback(obj, keyparts.shift());
    };

    rivets.binders['error-*'] = {
        bind: function(el) {
            var self = this;
            var holder = this.validationHolder = {
                marker: el.parentNode.insertBefore(document.createComment(" rivets: " + this.type + " "), el),
                focus: function() {
                    $(holder.container).removeClass('focused');
                },
                blur: function() {
                    holder.lastObj.seen(holder.lastId, true);
                    $(holder.container).addClass('focused');
                    holder.lastObj.validate();
                },
                validated: function(isValid, model, errors) {
                    var errorList = errors[holder.lastId];
                    var $container = $(holder.container);
                    var $fieldErrors = $container.find('> .validationfielderrors').empty();
                    if (errorList && holder.lastObj.seen(holder.lastId)) {
                        $container.addClass('has-errors');
                        require(['text!templates/fielderrorpopup.html!strip'], function(templateHtml) {
                            $fieldErrors.empty().append($($.parseHTML(templateHtml)).find('.template-content').append($.parseHTML(errorList)).end());
                        });
                    } else {
                        $container.removeClass('has-errors');
                    }
                }
            };
            holder.container = $.parseHTML('<span class="validationerrorcontainer"><div class="validationfielderrors"></div></span>');
            $(holder.container).removeClass('focused');
            $(holder.marker).after($(holder.container).append(el));
            diveIntoObject(this.model, this.keypath, function(obj, id) {
                holder.lastObj = obj;
                holder.lastId = id;
                obj.on('validated', holder.validated);
            });
            $(el).on('focus', holder.focus).on('blur', holder.blur);
            rivetsBinderCall(this, this.args[0], 'bind', arguments);
        },
        unbind: function(el) {
            var holder = this.validationHolder;
            $(this.validationHolder.marker).after(el).remove();
            $(el).off('focus', holder.focus).off('blur', holder.blur);
            diveIntoObject(this.model, this.keypath, function(obj, id) {
                obj.off('validated', holder.validated);
            });
            delete this.validationHolder;
            rivetsBinderCall(this, this.args[0], 'unbind', arguments);
        },
        routine: function(el, value) {
            rivetsBinderCall(this, this.args[0], 'routine', arguments);
        }
    };
});