From 03d29dd674323ae9467f26877fa35070249ae903 Mon Sep 17 00:00:00 2001 From: "John R. Supplee" Date: Tue, 6 Apr 2021 17:50:03 +0200 Subject: [PATCH] Updates to userAvatar and cardDetails template * enable userAvatar to work with member and assignee * remove userAvatarAssignee template --- client/components/cards/cardDetails.jade | 29 +---- client/components/cards/cardDetails.js | 153 +++-------------------- client/components/users/userAvatar.jade | 2 +- client/components/users/userAvatar.js | 9 +- 4 files changed, 29 insertions(+), 164 deletions(-) diff --git a/client/components/cards/cardDetails.jade b/client/components/cards/cardDetails.jade index 42426e92f..341d85eea 100644 --- a/client/components/cards/cardDetails.jade +++ b/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 diff --git a/client/components/cards/cardDetails.js b/client/components/cards/cardDetails.js index 4278bdd07..6abd8b2dc 100644 --- a/client/components/cards/cardDetails.js +++ b/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() { diff --git a/client/components/users/userAvatar.jade b/client/components/users/userAvatar.jade index 87bbb8c6a..bad253e7c 100644 --- a/client/components/users/userAvatar.jade +++ b/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 diff --git a/client/components/users/userAvatar.js b/client/components/users/userAvatar.js index 7b8a32145..97c28e2d8 100644 --- a/client/components/users/userAvatar.js +++ b/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);