27ac8600 by Adam Heath

Rewrite the holder to be a real object, that uses Backbone.Events to

dispatch everything.
1 parent 0e7055a1
......@@ -2,6 +2,7 @@ define(function(require) {
'use strict';
var module = require('module');
var rivets = require('rivets');
var Backbone = require('backbone');
var $ = require('jquery');
var rivetsBinderCall = function(binding, binderName, methodName, args) {
......@@ -32,57 +33,65 @@ define(function(require) {
}
};
function createTriggerProxy(obj, eventName) {
return function() {
obj.trigger.apply(obj, [eventName].concat(_.toArray(arguments)));
};
}
function ErrorHandler(binding, el) {
var seen = {};
var observer = binding.observer;
var oldParent;
var parentObserver;
var keyPath = observer.key.path;
this.on('bind', function() {
render(el, 'bind');
render(el, 'validated', false);
});
this.on('focus', function() {
render(el, 'focus', false);
});
this.on('blur', function() {
seen[keyPath] = true;
render(el, 'blur', false);
if (observer.target) {
observer.target.validate();
}
});
this.on('validated', function(isValid, model, errors) {
var errorList = errors[keyPath];
if (errorList && seen[keyPath]) {
render(el, 'validated', errorList);
} else {
render(el, 'validated', false);
}
});
this.on('unbind', function() {
render(el, 'unbind');
$(el).off('.rivets-error-binder');
});
var $el = $(el);
$el.on('focus.rivets-error-binder', createTriggerProxy(this, 'focus'));
$el.on('blur.rivets-error-binder', createTriggerProxy(this, 'blur'));
if (observer.target) {
this.listenTo(observer.target, 'validated', createTriggerProxy(this, 'validated'));
}
}
_.extend(ErrorHandler.prototype, Backbone.Events);
rivets.binders['error-*'] = {
bind: function(el) {
var observer = this.observer;
var keyPath = observer.key.path;
var holder = this.validationHolder = {
//marker: el.parentNode.insertBefore(document.createComment(" rivets: " + this.type + " "), el),
observer: observer,
seen: {},
focus: function() {
render(el, 'focus', false);
},
blur: function() {
holder.seen[keyPath] = true;
render(el, 'blur', false);
if (observer.target) {
observer.target.validate();
}
},
validated: function(isValid, model, errors) {
var errorList = errors[keyPath];
if (errorList && holder.seen[keyPath]) {
render(el, 'validated', errorList);
} else {
render(el, 'validated', false);
}
}
};
$(el).on('focus.rivets-error-binder', holder.focus).on('blur.rivets-error-binder', holder.blur);
this.errorHandler = new ErrorHandler(this, el);
this.errorHandler.trigger('bind');
rivetsBinderCall(this, this.args[0], 'bind', arguments);
render(el, 'bind');
render(el, 'validated', false);
},
unbind: function(el) {
var holder = this.validationHolder;
render(el, 'unbind');
$(this.validationHolder.marker).after(el).remove();
$(el).off('.rivets-error-binder');
if (holder.observer.target) {
holder.observer.target.off('validated', holder.validated);
}
delete this.validationHolder;
this.errorHandler.trigger('unbind');
delete this.errorHandler;
rivetsBinderCall(this, this.args[0], 'unbind', arguments);
},
routine: function() {
var holder = this.validationHolder;
if (this.observer.target) {
this.observer.target.off('validated', holder.validated);
}
if (this.observer.target) {
this.observer.target.on('validated', holder.validated);
}
rivetsBinderCall(this, this.args[0], 'routine', arguments);
}
};
......