text custom fields are now editable using inlinedForm

client/components/cards/cardCustomFields.jade

@@ -5,7 +5,7 @@ template(name="cardCustomFieldsPopup")
                 a.name.js-select-field(href="#")
                     span.full-name
                         = name
-                    if isCardMember
+                    if hasCustomField
                         i.fa.fa-check
     hr
     a.quiet-button.full.js-configure-custom-fields
@@ -14,10 +14,16 @@ template(name="cardCustomFieldsPopup")
 
 template(name="cardCustomFieldText")
     if canModifyCard
-        .item-title.js-open-inlined-form.is-editable
-            if value
+        +inlinedForm(classNames="js-card-customfield-text")
+            +editor(autofocus=true)
                 = value
-            else
-                | {{_ 'edit'}}
-    else
-        .item-title {{value}}
+            .edit-controls.clearfix
+                button.primary(type="submit") {{_ 'save'}}
+                a.fa.fa-times-thin.js-close-inlined-form
+        else
+            a.js-open-inlined-form
+                if value
+                    +viewer
+                        = value
+                else
+                    | {{_ 'edit'}}

client/components/cards/cardCustomFields.js

@@ -1,3 +1,11 @@
+Template.cardCustomFieldsPopup.helpers({
+    hasCustomField() {
+        const card = Cards.findOne(Session.get('currentCard'));
+        const customFieldId = this._id;
+        return card.customFieldIndex(customFieldId) > -1;
+    },
+});
+
 Template.cardCustomFieldsPopup.events({
     'click .js-select-field'(evt) {
         const card = Cards.findOne(Session.get('currentCard'));
@@ -24,7 +32,7 @@ const CardCustomField = BlazeComponent.extendComponent({
     },
 
     value() {
-        return "this is the value";
+        return this.data().value;
     },
 
     showISODate() {
@@ -33,9 +41,20 @@ const CardCustomField = BlazeComponent.extendComponent({
 
     events() {
         return [{
+            'submit .js-card-customfield-text'(evt) {
+                evt.preventDefault();
+                const card = Cards.findOne(Session.get('currentCard'));
+                const customFieldId = this.data()._id;
+                const value = this.currentComponent().getValue();
+                card.setCustomField(customFieldId,value);
+            },
             'click .js-edit-date': Popup.open('editCardStartDate'),
         }];
     },
+
+    canModifyCard() {
+        return Meteor.user() && Meteor.user().isBoardMember() && !Meteor.user().isCommentOnly();
+    },
 });
 
 CardCustomField.register('cardCustomField');