Merge pull request #4070 from mfilser/card_details_custom_fields_popup

Card details custom fields popup

client/components/cards/cardDetails.jade

@@ -73,8 +73,10 @@ template(name="cardDetails")
                 a.card-label.add-label.js-add-labels(title="{{_ 'card-labels-title'}}")
                   i.fa.fa-plus
 
-        if currentBoard.allowsReceivedDate
+        if currentBoard.hasAnyAllowsDate
           hr
+
+        if currentBoard.allowsReceivedDate
           .card-details-item.card-details-item-received
             h3.card-details-item-title
               i.fa.fa-sign-out
@@ -126,7 +128,9 @@ template(name="cardDetails")
                   a.card-label.add-label.js-end-date
                     i.fa.fa-plus
 
-        hr
+        if currentBoard.hasAnyAllowsUser
+          hr
+
         if currentBoard.allowsCreator
           .card-details-item.card-details-item-creator
             h3.card-details-item-title
@@ -167,17 +171,6 @@ template(name="cardDetails")
                 a.assignee.add-assignee.card-details-item-add-button.js-add-assignees(title="{{_ 'assignee'}}")
                   i.fa.fa-plus
 
-        //.card-details-items
-        if getSpentTime
-          .card-details-item.card-details-item-spent
-            if getIsOvertime
-              h3.card-details-item-title
-                | {{_ 'overtime-hours'}}
-            else
-              h3.card-details-item-title
-                | {{_ 'spent-time-hours'}}
-            +cardSpentTime
-
         //.card-details-items
         if currentBoard.allowsRequestedBy
           .card-details-item.card-details-item-name
@@ -219,6 +212,9 @@ template(name="cardDetails")
               +viewer
                 = getAssignedBy
 
+        if $or currentBoard.allowsCardSortingByNumber getSpentTime
+          hr
+
         if currentBoard.allowsCardSortingByNumber
           .card-details-item.card-details-sort-order
             h3.card-details-item-title
@@ -233,13 +229,18 @@ template(name="cardDetails")
                     = sort
 
         //.card-details-items
-        if customFieldsWD
-          .material-toggle-switch(title="{{_ 'change'}} {{_ 'custom-fields'}} {{_ 'layout'}}")
-            if customFieldsGrid
-              input.toggle-switch(type="checkbox" id="toggleCustomFieldsGridButton" checked="checked")
+        if getSpentTime
+          .card-details-item.card-details-item-spent
+            if getIsOvertime
+              h3.card-details-item-title
+                | {{_ 'overtime-hours'}}
             else
-              input.toggle-switch(type="checkbox" id="toggleCustomFieldsGridButton")
-            label.toggle-label(for="toggleCustomFieldsGridButton")
+              h3.card-details-item-title
+                | {{_ 'spent-time-hours'}}
+            +cardSpentTime
+
+        //.card-details-items
+        if customFieldsWD
           unless customFieldsGrid
             hr
           each customFieldsWD
@@ -250,6 +251,13 @@ template(name="cardDetails")
                 i.fa.fa-list-alt
                 = definition.name
               +cardCustomField
+          .material-toggle-switch(title="{{_ 'change'}} {{_ 'custom-fields'}} {{_ 'layout'}}")
+            if customFieldsGrid
+              input.toggle-switch(type="checkbox" id="toggleCustomFieldsGridButton" checked="checked")
+            else
+              input.toggle-switch(type="checkbox" id="toggleCustomFieldsGridButton")
+            label.toggle-label(for="toggleCustomFieldsGridButton")
+          a.fa.fa-plus.js-custom-fields.card-details-item.custom-fields(title="{{_ 'custom-fields'}}")
 
       if getVoteQuestion
         hr

client/components/cards/cardDetails.js

@@ -411,6 +411,7 @@ BlazeComponent.extendComponent({
         'click .js-end-date': Popup.open('editCardEndDate'),
         'click .js-show-positive-votes': Popup.open('positiveVoteMembers'),
         'click .js-show-negative-votes': Popup.open('negativeVoteMembers'),
+        'click .js-custom-fields': Popup.open('cardCustomFields'),
         'mouseenter .js-card-details'() {
           if (this.parentComponent() === null) return;
           const parentComponent = this.parentComponent().parentComponent();

client/components/cards/cardDetails.styl

@@ -230,6 +230,9 @@ avatar-radius = 50%
         word-wrap: break-word
         max-width: 28%
         flex-grow: 1
+      &.custom-fields
+        padding-left: 10px
+
 
   .card-details-item-title
     font-size: 16px

models/boards.js

@@ -865,6 +865,16 @@ Boards.helpers({
     });
   },
 
+  hasAnyAllowsDate() {
+    const ret = this.allowsReceivedDate || this.allowsStartDate || this.allowsDueDate || this.allowsEndDate;
+    return ret;
+  },
+
+  hasAnyAllowsUser() {
+    const ret = this.allowsCreator || this.allowsMembers || this.allowsAssignee || this.allowsRequestedBy || this.allowsAssignedBy;
+    return ret;
+  },
+
   absoluteUrl() {
     return FlowRouter.url('board', { id: this._id, slug: this.slug });
   },