Added faster way to do actions on minicard menu.

Thanks to mohammadZahedian, HT-Marley and xet7 !

Fixes #4303

client/components/cards/minicard.css

@@ -41,6 +41,15 @@
   overflow: hidden;
   transition: transform 0.2s, border-radius 0.2s;
 }
+.minicard-details-menu-with-handle {
+  float: right;
+  font-size: 14px;
+  padding-right: 30px;
+}
+.minicard-details-menu {
+  float: right;
+  font-size: 14px;
+}
 .minicard.linked-board .linked-icon,
 .minicard.linked-card .linked-icon {
   display: inline-block;

client/components/cards/minicard.jade

@@ -4,8 +4,11 @@ template(name="minicard")
     class="{{#if isLinkedBoard}}linked-board{{/if}}"
     class="{{#if colorClass}}minicard-{{colorClass}}{{/if}}")
     if isTouchScreenOrShowDesktopDragHandles
+      a.fa.fa-navicon.minicard-details-menu-with-handle.js-open-minicard-details-menu(title="{{_ 'cardDetailsActionsPopup-title'}}")
       .handle
         .fa.fa-arrows
+    else
+      a.fa.fa-navicon.minicard-details-menu.js-open-minicard-details-menu(title="{{_ 'cardDetailsActionsPopup-title'}}")
     if cover
       .minicard-cover(style="background-image: url('{{cover.link 'original' '/'}}?dummyReloadAfterSessionEstablished={{sess}}');")
     if labels
@@ -155,3 +158,42 @@ template(name="editCardSortOrderPopup")
   input.js-edit-card-sort-popup(type='text' autofocus value=sort dir="auto")
   .edit-controls.clearfix
     button.primary.confirm.js-submit-edit-card-sort-popup(type="submit") {{_ 'save'}}
+
+template(name="minicardDetailsActionsPopup")
+  ul.pop-over-list
+    if currentUser.isBoardAdmin
+      li
+        a.js-move-card
+          i.fa.fa-arrow-right
+          | {{_ 'moveCardPopup-title'}}
+    unless currentUser.isWorker
+      li
+        a.js-copy-card
+          i.fa.fa-copy
+          | {{_ 'copyCardPopup-title'}}
+      hr
+      li
+        a.js-move-card-to-top
+          i.fa.fa-arrow-up
+          | {{_ 'moveCardToTop-title'}}
+      li
+        a.js-move-card-to-bottom
+          i.fa.fa-arrow-down
+          | {{_ 'moveCardToBottom-title'}}
+      hr
+      li
+        a.js-add-labels
+          i.fa.fa-tags
+          | {{_ 'card-edit-labels'}}
+      li
+        a.js-due-date
+          i.fa.fa-sign-in
+          | {{_ 'editCardDueDatePopup-title'}}
+      li
+        a.js-set-card-color
+          i.fa.fa-paint-brush
+          | {{_ 'setCardColorPopup-title'}}
+      li
+        a.js-link
+          i.fa.fa-link
+          | {{_ 'link-card'}}

client/components/cards/minicard.js

@@ -97,6 +97,7 @@ BlazeComponent.extendComponent({
         },
         'click span.badge-icon.fa.fa-sort, click span.badge-text.check-list-sort' : Popup.open("editCardSortOrder"),
         'click .minicard-labels' : this.cardLabelsPopup,
+        'click .js-open-minicard-details-menu': Popup.open('minicardDetailsActions'),
       }
     ];
   },
@@ -147,3 +148,24 @@ BlazeComponent.extendComponent({
     ]
   }
 }).register('editCardSortOrderPopup');
+
+Template.minicardDetailsActionsPopup.events({
+  'click .js-due-date': Popup.open('editCardDueDate'),
+  'click .js-move-card': Popup.open('moveCard'),
+  'click .js-copy-card': Popup.open('copyCard'),
+  'click .js-set-card-color': Popup.open('setCardColor'),
+  'click .js-add-labels': Popup.open('cardLabels'),
+  'click .js-link': Popup.open('linkCard'),
+  'click .js-move-card-to-top'(event) {
+    event.preventDefault();
+    const minOrder = this.getMinSort();
+    this.move(this.boardId, this.swimlaneId, this.listId, minOrder - 1);
+    Popup.back();
+  },
+  'click .js-move-card-to-bottom'(event) {
+    event.preventDefault();
+    const maxOrder = this.getMaxSort();
+    this.move(this.boardId, this.swimlaneId, this.listId, maxOrder + 1);
+    Popup.back();
+  },
+});

imports/i18n/data/en.i18n.json

@@ -1195,5 +1195,6 @@
   "password-again": "Password (again)",
   "if-you-already-have-an-account": "If you already have an account",
   "register": "Register",
-  "forgot-password": "Forgot password"
+  "forgot-password": "Forgot password",
+  "minicardDetailsActionsPopup-title": "Card Details"
 }