Add Convert checklist item to card feature

client/components/cards/cardDetails.js

@@ -627,6 +627,7 @@ Template.cardDetailsActionsPopup.events({
   'click .js-spent-time': Popup.open('editCardSpentTime'),
   'click .js-move-card': Popup.open('moveCard'),
   'click .js-copy-card': Popup.open('copyCard'),
+  'click .js-convert-checklist-item-to-card': Popup.open('convertChecklistItemToCard'),
   'click .js-copy-checklist-cards': Popup.open('copyChecklistToManyCards'),
   'click .js-set-card-color': Popup.open('setCardColor'),
   'click .js-move-card-to-top'(event) {
@@ -791,6 +792,34 @@ Template.copyCardPopup.events({
   },
 });
 
+Template.convertChecklistItemToCardPopup.events({
+  'click .js-done'() {
+    const card = Cards.findOne(Session.get('currentCard'));
+    const lSelect = $('.js-select-lists')[0];
+    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];
+    const boardId = bSelect.options[bSelect.selectedIndex].value;
+    const textarea = $('#copy-card-title');
+    const title = textarea.val().trim();
+
+    if (title) {
+      const _id = Cards.insert({
+        title: title,
+        listId: listId,
+        boardId: boardId,
+        swimlaneId: swimlaneId,
+        sort: 0,
+      });
+      Filter.addException(_id);
+
+      Popup.close();
+
+    }
+  },
+});
+
 Template.copyChecklistToManyCardsPopup.events({
   'click .js-done'() {
     const card = Cards.findOne(Session.get('currentCard'));

client/components/cards/checklists.jade

@@ -80,6 +80,9 @@ template(name="editChecklistItemForm")
     span(title=createdAt) {{ moment createdAt }}
     if canModifyCard
       a.js-delete-checklist-item {{_ "delete"}}...
+      a.js-convert-checklist-item-to-card
+        i.fa.fa-copy
+        | {{_ 'convertChecklistItemToCardPopup-title'}}
 
 template(name="checklistItems")
   .checklist-items.js-checklist-items
@@ -110,3 +113,32 @@ template(name='checklistItemDetail')
       .item-title(class="{{#if item.isFinished }}is-checked{{/if}}")
         +viewer
           = item.title
+
+template(name="convertChecklistItemToCardPopup")
+  label(for='convert-checklist-item-to-card-title') {{_ 'title'}}:
+  textarea#copy-card-title.minicard-composer-textarea.js-card-title(autofocus)
+    = item.title
+  +boardsSwimlanesAndLists
+
+template(name="boardsSwimlanesAndLists")
+  unless currentUser.isWorker
+    label {{_ 'boards'}}:
+    select.js-select-boards(autofocus)
+      each boards
+        if $eq _id currentBoard._id
+          option(value="{{_id}}" selected) {{_ 'current'}}
+        else
+          option(value="{{_id}}") {{title}}
+
+  label {{_ 'swimlanes'}}:
+  select.js-select-swimlanes
+    each swimlanes
+      option(value="{{_id}}") {{title}}
+
+  label {{_ 'lists'}}:
+  select.js-select-lists
+    each aBoardLists
+      option(value="{{_id}}") {{title}}
+
+  .edit-controls.clearfix
+    button.primary.confirm.js-done {{_ 'done'}}

client/components/cards/checklists.js

@@ -1,3 +1,7 @@
+import Cards from '/models/cards';
+import Boards from '/models/boards';
+
+const subManager = new SubsManager();
 const { calculateIndexData, capitalize } = Utils;
 
 function initSorting(items) {
@@ -206,6 +210,7 @@ BlazeComponent.extendComponent({
         'submit .js-edit-checklist-title': this.editChecklist,
         'submit .js-add-checklist-item': this.addChecklistItem,
         'submit .js-edit-checklist-item': this.editChecklistItem,
+        'click .js-convert-checklist-item-to-card': Popup.open('convertChecklistItemToCard'),
         'click .js-delete-checklist-item': this.deleteItem,
         'click .confirm-checklist-delete': this.deleteChecklist,
         'focus .js-add-checklist-item': this.focusChecklistItem,
@@ -215,6 +220,47 @@ BlazeComponent.extendComponent({
   },
 }).register('checklists');
 
+BlazeComponent.extendComponent({
+  onCreated() {
+    subManager.subscribe('board', Session.get('currentBoard'), false);
+    this.selectedBoardId = new ReactiveVar(Session.get('currentBoard'));
+  },
+
+  boards() {
+    return Boards.find(
+      {
+        archived: false,
+        'members.userId': Meteor.userId(),
+        _id: { $ne: Meteor.user().getTemplatesBoardId() },
+      },
+      {
+        sort: { sort: 1 /* boards default sorting */ },
+      },
+    );
+  },
+
+  swimlanes() {
+    const board = Boards.findOne(this.selectedBoardId.get());
+    return board.swimlanes();
+  },
+
+  aBoardLists() {
+    const board = Boards.findOne(this.selectedBoardId.get());
+    return board.lists();
+  },
+
+  events() {
+    return [
+      {
+        'change .js-select-boards'(event) {
+          this.selectedBoardId.set($(event.currentTarget).val());
+          subManager.subscribe('board', this.selectedBoardId.get(), false);
+        },
+      },
+    ];
+  },
+}).register('boardsSwimlanesAndLists');
+
 Template.checklists.helpers({
   hideCheckedItems() {
     const currentUser = Meteor.user();

client/components/cards/checklists.styl

@@ -160,6 +160,7 @@ textarea.js-add-checklist-item, textarea.js-edit-checklist-item
     padding-right: 10px;
 
 .js-delete-checklist-item
+.js-convert-checklist-item-to-card
   margin: 0 0 0.5em 1.33em
   @extends .delete-text
   padding: 12px 0 0 0

i18n/en.i18n.json

@@ -89,6 +89,7 @@
   "add-subtask": "Add Subtask",
   "add-checklist": "Add Checklist",
   "add-checklist-item": "Add an item to checklist",
+  "convertChecklistItemToCardPopup-title": "Convert to Card",
   "add-cover": "Add Cover",
   "add-label": "Add Label",
   "add-list": "Add List",