Updates to userAvatar and cardDetails template

* enable userAvatar to work with member and assignee
* remove userAvatarAssignee template

client/components/cards/cardDetails.jade

@@ -126,8 +126,8 @@ template(name="cardDetails")
           h3.card-details-item-title
             i.fa.fa-users
             | {{_ 'members'}}
-          each getMembers
-            +userAvatar(userId=this cardId=../_id)
+          each userId in getMembers
+            +userAvatar(userId=userId cardId=_id)
             | {{! XXX Hack to hide syntaxic coloration /// }}
           if canModifyCard
             unless currentUser.isWorker
@@ -140,8 +140,8 @@ template(name="cardDetails")
           h3.card-details-item-title
             i.fa.fa-user
             | {{_ 'assignee'}}
-          each getAssignees
-            +userAvatarAssignee(userId=this cardId=../_id)
+          each userId in getAssignees
+            +userAvatar(userId=userId cardId=_id assignee=true)
             | {{! XXX Hack to hide syntaxic coloration /// }}
           if canModifyCard
             a.assignee.add-assignee.card-details-item-add-button.js-add-assignees(title="{{_ 'assignee'}}")
@@ -497,23 +497,6 @@ template(name="cardAssigneesPopup")
           if currentUser.isCardAssignee
             i.fa.fa-check
 
-template(name="userAvatarAssignee")
-  a.assignee.js-assignee(title="{{userData.profile.fullname}} ({{userData.username}})")
-    if userData.profile.avatarUrl
-      img.avatar.avatar-image(src="{{userData.profile.avatarUrl}}")
-    else
-      +userAvatarAssigneeInitials(userId=userData._id)
-
-    if showStatus
-      span.assignee-presence-status(class=presenceStatusClassName)
-      span.member-type(class=memberType)
-
-    unless isSandstorm
-      if showEdit
-        if $eq currentUser._id userData._id
-          a.edit-avatar.js-change-avatar
-            i.fa.fa-pencil
-
 template(name="cardAssigneePopup")
   .board-assignee-menu
     .mini-profile-info
@@ -531,10 +514,6 @@ template(name="cardAssigneePopup")
           with currentUser
             li: a.js-edit-profile {{_ 'edit-profile'}}
 
-template(name="userAvatarAssigneeInitials")
-  svg.avatar.avatar-assignee-initials(viewBox="0 0 {{viewPortWidth}} 15")
-    text(x="50%" y="13" text-anchor="middle")= initials
-
 template(name="cardMorePopup")
   p.quiet
     span.clearfix

client/components/cards/cardDetails.js

@@ -1,11 +1,18 @@
+import { DatePicker } from '/client/lib/datepicker';
+import Cards from '/models/cards';
+import Boards from '/models/boards';
+import Checklists from '/models/checklists';
+import Integrations from '/models/integrations';
+import Users from '/models/users';
+import Lists from '/models/lists';
+import CardComments from '/models/cardComments';
+import { ALLOWED_COLORS } from '/config/const';
+import moment from 'moment';
+import { UserAvatar } from '../users/userAvatar';
+
 const subManager = new SubsManager();
 const { calculateIndexData } = Utils;
 
-let cardColors;
-Meteor.startup(() => {
-  cardColors = Cards.simpleSchema()._schema.color.allowedValues;
-});
-
 BlazeComponent.extendComponent({
   mixins() {
     return [Mixins.InfiniteScrolling];
@@ -160,9 +167,7 @@ BlazeComponent.extendComponent({
             integration,
             'CardSelected',
             params,
-            () => {
-              return;
-            },
+            () => {},
           );
         });
       }
@@ -290,7 +295,7 @@ BlazeComponent.extendComponent({
           Utils.goBoardId(this.data().boardId);
         },
         'click .js-copy-link'() {
-          StringToCopyElement = document.getElementById('cardURL_copy');
+          const StringToCopyElement = document.getElementById('cardURL_copy');
           StringToCopyElement.value =
             window.location.origin + window.location.pathname;
           StringToCopyElement.select();
@@ -356,7 +361,7 @@ BlazeComponent.extendComponent({
         'click .js-go-to-linked-card'() {
           Utils.goCardId(this.data().linkedId);
         },
-        // 'click .js-member': Popup.open('cardMember'),
+        'click .js-member': Popup.open('cardMember'),
         'click .js-add-members': Popup.open('cardMembers'),
         'click .js-assignee': Popup.open('cardAssignee'),
         'click .js-add-assignees': Popup.open('cardAssignees'),
@@ -407,122 +412,6 @@ BlazeComponent.extendComponent({
   },
 }).register('cardDetails');
 
-Template.cardDetails.helpers({
-  userData() {
-    // We need to handle a special case for the search results provided by the
-    // `matteodem:easy-search` package. Since these results gets published in a
-    // separate collection, and not in the standard Meteor.Users collection as
-    // expected, we use a component parameter ("property") to distinguish the
-    // two cases.
-    const userCollection = this.esSearch ? ESSearchResults : Users;
-    return userCollection.findOne(this.userId, {
-      fields: {
-        profile: 1,
-        username: 1,
-      },
-    });
-  },
-
-  receivedSelected() {
-    if (this.getReceived().length === 0) {
-      return false;
-    } else {
-      return true;
-    }
-  },
-
-  startSelected() {
-    if (this.getStart().length === 0) {
-      return false;
-    } else {
-      return true;
-    }
-  },
-
-  endSelected() {
-    if (this.getEnd().length === 0) {
-      return false;
-    } else {
-      return true;
-    }
-  },
-
-  dueSelected() {
-    if (this.getDue().length === 0) {
-      return false;
-    } else {
-      return true;
-    }
-  },
-
-  memberSelected() {
-    if (this.getMembers().length === 0) {
-      return false;
-    } else {
-      return true;
-    }
-  },
-
-  labelSelected() {
-    if (this.getLabels().length === 0) {
-      return false;
-    } else {
-      return true;
-    }
-  },
-
-  assigneeSelected() {
-    if (this.getAssignees().length === 0) {
-      return false;
-    } else {
-      return true;
-    }
-  },
-
-  requestBySelected() {
-    if (this.getRequestBy().length === 0) {
-      return false;
-    } else {
-      return true;
-    }
-  },
-
-  assigneeBySelected() {
-    if (this.getAssigneeBy().length === 0) {
-      return false;
-    } else {
-      return true;
-    }
-  },
-
-  memberType() {
-    const user = Users.findOne(this.userId);
-    return user && user.isBoardAdmin() ? 'admin' : 'normal';
-  },
-
-  presenceStatusClassName() {
-    const user = Users.findOne(this.userId);
-    const userPresence = presences.findOne({ userId: this.userId });
-    if (user && user.isInvitedTo(Session.get('currentBoard'))) return 'pending';
-    else if (!userPresence) return 'disconnected';
-    else if (Session.equals('currentBoard', userPresence.state.currentBoardId))
-      return 'active';
-    else return 'idle';
-  },
-});
-
-Template.userAvatarAssigneeInitials.helpers({
-  initials() {
-    const user = Users.findOne(this.userId);
-    return user && user.getInitials();
-  },
-
-  viewPortWidth() {
-    const user = Users.findOne(this.userId);
-    return ((user && user.getInitials().length) || 1) * 12;
-  },
-});
-
 // We extends the normal InlinedForm component to support UnsavedEdits draft
 // feature.
 (class extends InlinedForm {
@@ -697,7 +586,7 @@ BlazeComponent.extendComponent({
   },
 
   boards() {
-    const boards = Boards.find(
+    return Boards.find(
       {
         archived: false,
         'members.userId': Meteor.userId(),
@@ -707,7 +596,6 @@ BlazeComponent.extendComponent({
         sort: { sort: 1 /* boards default sorting */ },
       },
     );
-    return boards;
   },
 
   swimlanes() {
@@ -736,7 +624,7 @@ Template.copyCardPopup.events({
   'click .js-done'() {
     const card = Cards.findOne(Session.get('currentCard'));
     const lSelect = $('.js-select-lists')[0];
-    listId = lSelect.options[lSelect.selectedIndex].value;
+    const listId = lSelect.options[lSelect.selectedIndex].value;
     const slSelect = $('.js-select-swimlanes')[0];
     const swimlaneId = slSelect.options[slSelect.selectedIndex].value;
     const bSelect = $('.js-select-boards')[0];
@@ -801,7 +689,7 @@ Template.copyChecklistToManyCardsPopup.events({
         });
 
         // copy subtasks
-        cursor = Cards.find({ parentId: oldId });
+        const cursor = Cards.find({ parentId: oldId });
         cursor.forEach(function() {
           'use strict';
           const subtask = arguments[0];
@@ -827,7 +715,7 @@ BlazeComponent.extendComponent({
   },
 
   colors() {
-    return cardColors.map(color => ({ color, name: '' }));
+    return ALLOWED_COLORS.map(color => ({ color, name: '' }));
   },
 
   isSelected(color) {
@@ -871,7 +759,7 @@ BlazeComponent.extendComponent({
   },
 
   boards() {
-    const boards = Boards.find(
+    return Boards.find(
       {
         archived: false,
         'members.userId': Meteor.userId(),
@@ -883,7 +771,6 @@ BlazeComponent.extendComponent({
         sort: { sort: 1 /* boards default sorting */ },
       },
     );
-    return boards;
   },
 
   cards() {

client/components/users/userAvatar.jade

@@ -1,5 +1,5 @@
 template(name="userAvatar")
-  a.member.js-member(title="{{userData.profile.fullname}} ({{userData.username}}) {{_ memberType}}")
+  a.member(class="js-{{#if assignee}}assignee{{else}}member{{/if}}" title="{{userData.profile.fullname}} ({{userData.username}}) {{_ memberType}}")
     if userData.profile.avatarUrl
       img.avatar.avatar-image(src="{{userData.profile.avatarUrl}}")
     else

client/components/users/userAvatar.js

@@ -1,3 +1,7 @@
+import Cards from '/models/cards';
+import Avatars from '/models/avatars';
+import Users from '/models/users';
+
 Template.userAvatar.helpers({
   userData() {
     // We need to handle a special case for the search results provided by the
@@ -30,11 +34,6 @@ Template.userAvatar.helpers({
   },
 });
 
-Template.userAvatar.events({
-  'click .js-change-avatar': Popup.open('changeAvatar'),
-  'click .js-member': Popup.open('cardMember'),
-});
-
 Template.userAvatarInitials.helpers({
   initials() {
     const user = Users.findOne(this.userId);