Merge pull request #463 from alayek/autosize-card-title

Autosize card title

Fixes #394

client/components/cards/cardDetails.jade

@@ -2,10 +2,7 @@ template(name="cardDetails")
   section.card-details.js-card-details.js-perfect-scrollbar: .card-details-canvas
     .card-details-header
       +inlinedForm(classNames="js-card-details-title")
-        input.full-line(type="text" value=title autofocus)
-        .edit-controls.clearfix
-          button.primary.confirm(type="submit") {{_ 'save'}}
-          a.fa.fa-times-thin.js-close-inlined-form
+        +editCardTitleForm
       else
         a.fa.fa-times-thin.close-card-details.js-close-card-details
         if currentUser.isBoardMember
@@ -77,6 +74,13 @@ template(name="cardDetails")
     if isLoaded.get
       +activities(card=this mode="card")
 
+template(name="editCardTitleForm")
+  textarea.js-edit-card-title(rows='1' autofocus)
+    = title
+  .edit-controls.clearfix
+    button.primary.confirm.js-submit-edit-card-title-form(type="submit") {{_ 'save'}}
+    a.fa.fa-times-thin.js-close-inlined-form
+
 template(name="cardDetailsActionsPopup")
   ul.pop-over-list
     li: a.js-members {{_ 'card-edit-members'}}

client/components/cards/cardDetails.js

@@ -141,6 +141,19 @@ Template.cardDetailsActionsPopup.events({
   'click .js-more': Popup.open('cardMore'),
 });
 
+Template.editCardTitleForm.onRendered(function() {
+  autosize(this.$('.js-edit-card-title'));
+});
+
+Template.editCardTitleForm.events({
+  'keydown .js-edit-card-title'(evt) {
+    // If enter key was pressed, submit the data
+    if (evt.keyCode === 13) {
+      $('.js-submit-edit-card-title-form').click();
+    }
+  },
+});
+
 Template.moveCardPopup.events({
   'click .js-select-list'() {
     // XXX We should *not* get the currentCard from the global state, but