Move all the html calls into a separate function; eventually, this will

be externalized.

@@ -13,18 +13,37 @@ define(['rivets', 'bootstrap'], function(rivets) {
         }
         }
     };
     };
 
 
+    var render = function(el, cmd, errorList) {
+        switch (cmd) {
+            case 'focus':
+                break;
+            case 'blur':
+                break;
+            case 'validated':
+                if (errorList) {
+                    $(el).tooltip({title: errorList, trigger: 'focus'});
+                    $(el).tooltip('show');
+                    $(el).parent().addClass('has-error');
+                } else {
+                    $(el).tooltip('destroy');
+                    $(el).parent().removeClass('has-error');
+                }
+                break;
+        }
+    };
+
     rivets.binders['error-*'] = {
     rivets.binders['error-*'] = {
         bind: function(el) {
         bind: function(el) {
             var holder = this.validationHolder = {
             var holder = this.validationHolder = {
                 //marker: el.parentNode.insertBefore(document.createComment(" rivets: " + this.type + " "), el),
                 //marker: el.parentNode.insertBefore(document.createComment(" rivets: " + this.type + " "), el),
                 focus: function() {
                 focus: function() {
-                    $(holder.container).removeClass('focused');
+                    render(el, 'focus', false);
                 },
                 },
                 blur: function() {
                 blur: function() {
                     if (holder.observer && holder.observer.target) {
                     if (holder.observer && holder.observer.target) {
                         holder.observer.target.seen(holder.observer.key.path, true);
                         holder.observer.target.seen(holder.observer.key.path, true);
                     }
                     }
-                    $(holder.container).addClass('focused');
+                    render(el, 'blur', false);
                     if (holder.observer && holder.observer.target) {
                     if (holder.observer && holder.observer.target) {
                         holder.observer.target.validate();
                         holder.observer.target.validate();
                     }
                     }
@@ -32,12 +51,9 @@ define(['rivets', 'bootstrap'], function(rivets) {
                 validated: function(isValid, model, errors) {
                 validated: function(isValid, model, errors) {
                     var errorList = errors[holder.observer.key.path];
                     var errorList = errors[holder.observer.key.path];
                     if (errorList && holder.observer.target && holder.observer.target.seen(holder.observer.key.path)) {
                     if (errorList && holder.observer.target && holder.observer.target.seen(holder.observer.key.path)) {
-                        $(el).tooltip({title: errorList, trigger: 'focus'});
-                        $(el).tooltip('show');
-                        $(el).parent().addClass('has-error');
+                        render(el, 'validated', errorList);
                     } else {
                     } else {
-                        $(el).tooltip('destroy');
-                        $(el).parent().removeClass('has-error');
+                        render(el, 'validated', false);
                     }
                     }
                 }
                 }
             };
             };