Merge branch 'mfilser-card_title_copy_button'

client/components/cards/cardDetails.jade

@@ -576,6 +576,8 @@ template(name="cardDetails")
             +activities(card=this mode="card")
 
 template(name="editCardTitleForm")
+  a.fa.fa-copy(title="{{_ 'copy-text-to-clipboard'}}")
+  span.copied-tooltip {{_ 'copied'}}
   textarea.js-edit-card-title(rows='1' autofocus dir="auto")
     = getTitle
   .edit-controls.clearfix

client/components/cards/cardDetails.js

@@ -689,9 +689,31 @@ Template.cardDetailsActionsPopup.events({
   },
 });
 
-Template.editCardTitleForm.onRendered(function () {
-  autosize(this.$('.js-edit-card-title'));
-});
+BlazeComponent.extendComponent({
+  onRendered() {
+    autosize(this.$('textarea.js-edit-card-title'));
+  },
+  events() {
+    return [
+      {
+        'click a.fa.fa-copy'(event) {
+          const $editor = this.$('textarea');
+          const promise = Utils.copyTextToClipboard($editor[0].value);
+
+          const $tooltip = this.$('.copied-tooltip');
+          Utils.showCopied(promise, $tooltip);
+        },
+        'keydown .js-edit-card-title'(event) {
+          // If enter key was pressed, submit the data
+          // Unless the shift key is also being pressed
+          if (event.keyCode === 13 && !event.shiftKey) {
+            $('.js-submit-edit-card-title-form').click();
+          }
+        },
+      }
+    ];
+  }
+}).register('editCardTitleForm');
 
 Template.cardMembersPopup.onCreated(function () {
   let currBoard = Boards.findOne(Session.get('currentBoard'));
@@ -751,16 +773,6 @@ const filterMembers = (filterTerm) => {
   return members;
 }
 
-Template.editCardTitleForm.events({
-  'keydown .js-edit-card-title'(event) {
-    // If enter key was pressed, submit the data
-    // Unless the shift key is also being pressed
-    if (event.keyCode === 13 && !event.shiftKey) {
-      $('.js-submit-edit-card-title-form').click();
-    }
-  },
-});
-
 Template.editCardRequesterForm.onRendered(function () {
   autosize(this.$('.js-edit-card-requester'));
 });

client/components/cards/cardDetails.styl

@@ -181,6 +181,9 @@ avatar-radius = 50%
       margin-top: 5px
       margin-bottom: 10px
 
+      .copied-tooltip
+        padding: 0px 10px
+
     .card-details-list
       font-size: 0.85em
       margin-bottom: 3px
@@ -195,12 +198,8 @@ avatar-radius = 50%
           padding: 0px 5px
 
     .copied-tooltip
-      display: none
       margin-right: 10px
       padding: 10px;
-      background-color: #000000df;
-      color: #fff;
-      border-radius: 5px;
 
   .card-description textarea
     min-height: 100px