summaryrefslogtreecommitdiffstats
path: root/client/components/cards
diff options
context:
space:
mode:
Diffstat (limited to 'client/components/cards')
-rw-r--r--client/components/cards/cardDetails.jade37
-rw-r--r--client/components/cards/cardDetails.js258
-rw-r--r--client/components/cards/checklists.jade5
-rw-r--r--client/components/cards/checklists.js4
-rw-r--r--client/components/cards/minicard.jade15
-rw-r--r--client/components/cards/minicard.styl7
-rw-r--r--client/components/cards/subtasks.jade97
-rw-r--r--client/components/cards/subtasks.js145
-rw-r--r--client/components/cards/subtasks.styl142
9 files changed, 654 insertions, 56 deletions
diff --git a/client/components/cards/cardDetails.jade b/client/components/cards/cardDetails.jade
index aa4829a9..aaad7c7c 100644
--- a/client/components/cards/cardDetails.jade
+++ b/client/components/cards/cardDetails.jade
@@ -13,6 +13,12 @@ template(name="cardDetails")
= title
if isWatching
i.fa.fa-eye.card-details-watch
+ .card-details-path
+ each parentList
+ |   >  
+ a.js-parent-card(href=linkForCard) {{title}}
+ // else
+ {{_ 'top-level-card'}}
if archived
p.warning {{_ 'card-archived'}}
@@ -144,6 +150,10 @@ template(name="cardDetails")
hr
+checklists(cardId = _id)
+ if currentBoard.allowsSubtasks
+ hr
+ +subtasks(cardId = _id)
+
hr
h3
i.fa.fa-paperclip
@@ -273,10 +283,37 @@ template(name="cardMorePopup")
button.js-copy-card-link-to-clipboard(class="btn") {{_ 'copy-card-link-to-clipboard'}}
span.clearfix
br
+ h2 {{_ 'change-card-parent'}}
+ label {{_ 'source-board'}}:
+ select.js-field-parent-board
+ each boards
+ if isParentBoard
+ option(value="{{_id}}" selected) {{title}}
+ else
+ option(value="{{_id}}") {{title}}
+ if isTopLevel
+ option(value="none" selected) {{_ 'custom-field-dropdown-none'}}
+ else
+ option(value="none") {{_ 'custom-field-dropdown-none'}}
+
+ label {{_ 'parent-card'}}:
+ select.js-field-parent-card
+ if isTopLevel
+ option(value="none" selected) {{_ 'custom-field-dropdown-none'}}
+ else
+ each cards
+ if isParentCard
+ option(value="{{_id}}" selected) {{title}}
+ else
+ option(value="{{_id}}") {{title}}
+ option(value="none") {{_ 'custom-field-dropdown-none'}}
+ br
| {{_ 'added'}}
span.date(title=card.createdAt) {{ moment createdAt 'LLL' }}
a.js-delete(title="{{_ 'card-delete-notice'}}") {{_ 'delete'}}
+
+
template(name="cardDeletePopup")
p {{_ "card-delete-pop"}}
unless archived
diff --git a/client/components/cards/cardDetails.js b/client/components/cards/cardDetails.js
index 72ed678b..5fee1680 100644
--- a/client/components/cards/cardDetails.js
+++ b/client/components/cards/cardDetails.js
@@ -20,10 +20,11 @@ BlazeComponent.extendComponent({
},
onCreated() {
+ this.currentBoard = Boards.findOne(Session.get('currentBoard'));
this.isLoaded = new ReactiveVar(false);
const boardBody = this.parentComponent().parentComponent();
//in Miniview parent is Board, not BoardBody.
- if (boardBody !== null){
+ if (boardBody !== null) {
boardBody.showOverlay.set(true);
boardBody.mouseHasEnterCardDetails = false;
}
@@ -70,6 +71,30 @@ BlazeComponent.extendComponent({
}
},
+ presentParentTask() {
+ let result = this.currentBoard.presentParentTask;
+ if ((result === null) || (result === undefined)) {
+ result = 'no-parent';
+ }
+ return result;
+ },
+
+ linkForCard() {
+ const card = this.currentData();
+ let result = '#';
+ if (card) {
+ const board = Boards.findOne(card.boardId);
+ if (board) {
+ result = FlowRouter.url('card', {
+ boardId: card.boardId,
+ slug: board.slug,
+ cardId: card._id,
+ });
+ }
+ }
+ return result;
+ },
+
onRendered() {
if (!Utils.isMiniScreen()) this.scrollParentContainer();
const $checklistsDom = this.$('.card-checklist-items');
@@ -107,6 +132,41 @@ BlazeComponent.extendComponent({
},
});
+ const $subtasksDom = this.$('.card-subtasks-items');
+
+ $subtasksDom.sortable({
+ tolerance: 'pointer',
+ helper: 'clone',
+ handle: '.subtask-title',
+ items: '.js-subtasks',
+ placeholder: 'subtasks placeholder',
+ distance: 7,
+ start(evt, ui) {
+ ui.placeholder.height(ui.helper.height());
+ EscapeActions.executeUpTo('popup-close');
+ },
+ stop(evt, ui) {
+ let prevChecklist = ui.item.prev('.js-subtasks').get(0);
+ if (prevChecklist) {
+ prevChecklist = Blaze.getData(prevChecklist).subtask;
+ }
+ let nextChecklist = ui.item.next('.js-subtasks').get(0);
+ if (nextChecklist) {
+ nextChecklist = Blaze.getData(nextChecklist).subtask;
+ }
+ const sortIndex = calculateIndexData(prevChecklist, nextChecklist, 1);
+
+ $subtasksDom.sortable('cancel');
+ const subtask = Blaze.getData(ui.item.get(0)).subtask;
+
+ Subtasks.update(subtask._id, {
+ $set: {
+ subtaskSort: sortIndex.base,
+ },
+ });
+ },
+ });
+
function userIsMember() {
return Meteor.user() && Meteor.user().isBoardMember();
}
@@ -116,6 +176,9 @@ BlazeComponent.extendComponent({
if ($checklistsDom.data('sortable')) {
$checklistsDom.sortable('option', 'disabled', !userIsMember());
}
+ if ($subtasksDom.data('sortable')) {
+ $subtasksDom.sortable('option', 'disabled', !userIsMember());
+ }
});
},
@@ -327,7 +390,6 @@ Template.moveCardPopup.events({
Popup.close();
},
});
-
BlazeComponent.extendComponent({
onCreated() {
subManager.subscribe('board', Session.get('currentBoard'));
@@ -364,6 +426,21 @@ BlazeComponent.extendComponent({
},
}).register('boardsAndLists');
+
+function cloneCheckList(_id, checklist) {
+ 'use strict';
+ const checklistId = checklist._id;
+ checklist.cardId = _id;
+ checklist._id = null;
+ const newChecklistId = Checklists.insert(checklist);
+ ChecklistItems.find({checklistId}).forEach(function(item) {
+ item._id = null;
+ item.checklistId = newChecklistId;
+ item.cardId = _id;
+ ChecklistItems.insert(item);
+ });
+}
+
Template.copyCardPopup.events({
'click .js-done'() {
const card = Cards.findOne(Session.get('currentCard'));
@@ -393,18 +470,17 @@ Template.copyCardPopup.events({
// copy checklists
let cursor = Checklists.find({cardId: oldId});
cursor.forEach(function() {
+ cloneCheckList(_id, arguments[0]);
+ });
+
+ // copy subtasks
+ cursor = Cards.find({parentId: oldId});
+ cursor.forEach(function() {
'use strict';
- const checklist = arguments[0];
- const checklistId = checklist._id;
- checklist.cardId = _id;
- checklist._id = null;
- const newChecklistId = Checklists.insert(checklist);
- ChecklistItems.find({checklistId}).forEach(function(item) {
- item._id = null;
- item.checklistId = newChecklistId;
- item.cardId = _id;
- ChecklistItems.insert(item);
- });
+ const subtask = arguments[0];
+ subtask.parentId = _id;
+ subtask._id = null;
+ /* const newSubtaskId = */ Cards.insert(subtask);
});
// copy card comments
@@ -454,18 +530,17 @@ Template.copyChecklistToManyCardsPopup.events({
// copy checklists
let cursor = Checklists.find({cardId: oldId});
cursor.forEach(function() {
+ cloneCheckList(_id, arguments[0]);
+ });
+
+ // copy subtasks
+ cursor = Cards.find({parentId: oldId});
+ cursor.forEach(function() {
'use strict';
- const checklist = arguments[0];
- const checklistId = checklist._id;
- checklist.cardId = _id;
- checklist._id = null;
- const newChecklistId = Checklists.insert(checklist);
- ChecklistItems.find({checklistId}).forEach(function(item) {
- item._id = null;
- item.checklistId = newChecklistId;
- item.cardId = _id;
- ChecklistItems.insert(item);
- });
+ const subtask = arguments[0];
+ subtask.parentId = _id;
+ subtask._id = null;
+ /* const newSubtaskId = */ Cards.insert(subtask);
});
// copy card comments
@@ -483,36 +558,119 @@ Template.copyChecklistToManyCardsPopup.events({
},
});
+BlazeComponent.extendComponent({
+ onCreated() {
+ this.currentCard = this.currentData();
+ this.parentCard = this.currentCard.parentCard();
+ if (this.parentCard) {
+ this.parentBoard = this.parentCard.board();
+ } else {
+ this.parentBoard = null;
+ }
+ },
-Template.cardMorePopup.events({
- 'click .js-copy-card-link-to-clipboard' () {
- // Clipboard code from:
- // https://stackoverflow.com/questions/6300213/copy-selected-text-to-the-clipboard-without-using-flash-must-be-cross-browser
- const StringToCopyElement = document.getElementById('cardURL');
- StringToCopyElement.select();
- if (document.execCommand('copy')) {
- StringToCopyElement.blur();
+ boards() {
+ const boards = Boards.find({
+ archived: false,
+ 'members.userId': Meteor.userId(),
+ }, {
+ sort: ['title'],
+ });
+ return boards;
+ },
+
+ cards() {
+ if (this.parentBoard) {
+ return this.parentBoard.cards();
} else {
- document.getElementById('cardURL').selectionStart = 0;
- document.getElementById('cardURL').selectionEnd = 999;
- document.execCommand('copy');
- if (window.getSelection) {
- if (window.getSelection().empty) { // Chrome
- window.getSelection().empty();
- } else if (window.getSelection().removeAllRanges) { // Firefox
- window.getSelection().removeAllRanges();
- }
- } else if (document.selection) { // IE?
- document.selection.empty();
- }
+ return [];
}
},
- 'click .js-delete': Popup.afterConfirm('cardDelete', function () {
- Popup.close();
- Cards.remove(this._id);
- Utils.goBoardId(this.boardId);
- }),
-});
+
+ isParentBoard() {
+ const board = this.currentData();
+ if (this.parentBoard) {
+ return board._id === this.parentBoard;
+ }
+ return false;
+ },
+
+ isParentCard() {
+ const card = this.currentData();
+ if (this.parentCard) {
+ return card._id === this.parentCard;
+ }
+ return false;
+ },
+
+ setParentCardId(cardId) {
+ if (cardId === 'null') {
+ cardId = null;
+ this.parentCard = null;
+ } else {
+ this.parentCard = Cards.findOne(cardId);
+ }
+ this.currentCard.setParentId(cardId);
+ },
+
+ events() {
+ return [{
+ 'click .js-copy-card-link-to-clipboard' () {
+ // Clipboard code from:
+ // https://stackoverflow.com/questions/6300213/copy-selected-text-to-the-clipboard-without-using-flash-must-be-cross-browser
+ const StringToCopyElement = document.getElementById('cardURL');
+ StringToCopyElement.select();
+ if (document.execCommand('copy')) {
+ StringToCopyElement.blur();
+ } else {
+ document.getElementById('cardURL').selectionStart = 0;
+ document.getElementById('cardURL').selectionEnd = 999;
+ document.execCommand('copy');
+ if (window.getSelection) {
+ if (window.getSelection().empty) { // Chrome
+ window.getSelection().empty();
+ } else if (window.getSelection().removeAllRanges) { // Firefox
+ window.getSelection().removeAllRanges();
+ }
+ } else if (document.selection) { // IE?
+ document.selection.empty();
+ }
+ }
+ },
+ 'click .js-delete': Popup.afterConfirm('cardDelete', function () {
+ Popup.close();
+ Cards.remove(this._id);
+ Utils.goBoardId(this.boardId);
+ }),
+ 'change .js-field-parent-board'(evt) {
+ const selection = $(evt.currentTarget).val();
+ const list = $('.js-field-parent-card');
+ list.empty();
+ if (selection === 'none') {
+ this.parentBoard = null;
+ list.prop('disabled', true);
+ } else {
+ this.parentBoard = Boards.findOne(selection);
+ this.parentBoard.cards().forEach(function(card) {
+ list.append(
+ $('<option></option>').val(card._id).html(card.title)
+ );
+ });
+ list.prop('disabled', false);
+ }
+ list.append(
+ `<option value='none' selected='selected'>${TAPi18n.__('custom-field-dropdown-none')}</option>`
+ );
+ this.setParentCardId('null');
+ },
+ 'change .js-field-parent-card'(evt) {
+ const selection = $(evt.currentTarget).val();
+ this.setParentCardId(selection);
+ },
+ }];
+ },
+}).register('cardMorePopup');
+
// Close the card details pane by pressing escape
EscapeActions.register('detailsPane',
diff --git a/client/components/cards/checklists.jade b/client/components/cards/checklists.jade
index ae680bd5..e45e7ad9 100644
--- a/client/components/cards/checklists.jade
+++ b/client/components/cards/checklists.jade
@@ -27,7 +27,6 @@ template(name="checklistDetail")
if canModifyCard
a.js-delete-checklist.toggle-delete-checklist-dialog {{_ "delete"}}...
- span.checklist-stat(class="{{#if checklist.isFinished}}is-finished{{/if}}") {{checklist.finishedCount}}/{{checklist.itemCount}}
if canModifyCard
h2.title.js-open-inlined-form.is-editable
+viewer
@@ -75,7 +74,7 @@ template(name="checklistItems")
+inlinedForm(classNames="js-edit-checklist-item" item = item checklist = checklist)
+editChecklistItemForm(type = 'item' item = item checklist = checklist)
else
- +itemDetail(item = item checklist = checklist)
+ +checklistItemDetail(item = item checklist = checklist)
if canModifyCard
+inlinedForm(autoclose=false classNames="js-add-checklist-item" checklist = checklist)
+addChecklistItemForm
@@ -84,7 +83,7 @@ template(name="checklistItems")
i.fa.fa-plus
| {{_ 'add-checklist-item'}}...
-template(name='itemDetail')
+template(name='checklistItemDetail')
.js-checklist-item.checklist-item
if canModifyCard
.check-box.materialCheckBox(class="{{#if item.isFinished }}is-checked{{/if}}")
diff --git a/client/components/cards/checklists.js b/client/components/cards/checklists.js
index 1f05aded..519af629 100644
--- a/client/components/cards/checklists.js
+++ b/client/components/cards/checklists.js
@@ -204,7 +204,7 @@ Template.checklistDeleteDialog.onDestroyed(() => {
$cardDetails.animate( { scrollTop: this.scrollState.position });
});
-Template.itemDetail.helpers({
+Template.checklistItemDetail.helpers({
canModifyCard() {
return Meteor.user() && Meteor.user().isBoardMember() && !Meteor.user().isCommentOnly();
},
@@ -223,4 +223,4 @@ BlazeComponent.extendComponent({
'click .js-checklist-item .check-box': this.toggleItem,
}];
},
-}).register('itemDetail');
+}).register('checklistItemDetail');
diff --git a/client/components/cards/minicard.jade b/client/components/cards/minicard.jade
index 2a8e95ab..57913669 100644
--- a/client/components/cards/minicard.jade
+++ b/client/components/cards/minicard.jade
@@ -7,8 +7,21 @@ template(name="minicard")
each labels
.minicard-label(class="card-label-{{color}}" title="{{name}}")
.minicard-title
+ if $eq 'prefix-with-full-path' currentBoard.presentParentTask
+ .parent-prefix
+ | {{ parentString ' > ' }}
+ if $eq 'prefix-with-parent' currentBoard.presentParentTask
+ .parent-prefix
+ | {{ parentCardName }}
+viewer
- = title
+ {{ title }}
+ if $eq 'subtext-with-full-path' currentBoard.presentParentTask
+ .parent-subtext
+ | {{ parentString ' > ' }}
+ if $eq 'subtext-with-parent' currentBoard.presentParentTask
+ .parent-subtext
+ | {{ parentCardName }}
+
.dates
if receivedAt
unless startAt
diff --git a/client/components/cards/minicard.styl b/client/components/cards/minicard.styl
index 391a6316..90429dff 100644
--- a/client/components/cards/minicard.styl
+++ b/client/components/cards/minicard.styl
@@ -162,6 +162,13 @@
margin-bottom: 20px
overflow-y: auto
+.parent-prefix
+ color: darken(white, 30%)
+ font-size: 0.9em
+.parent-subtext
+ color: darken(white, 30%)
+ font-size: 0.9em
+
@media screen and (max-width: 800px)
.minicard
.is-selected &
diff --git a/client/components/cards/subtasks.jade b/client/components/cards/subtasks.jade
new file mode 100644
index 00000000..b0ef2f33
--- /dev/null
+++ b/client/components/cards/subtasks.jade
@@ -0,0 +1,97 @@
+template(name="subtasks")
+ h3 {{_ 'subtasks'}}
+ if toggleDeleteDialog.get
+ .board-overlay#card-details-overlay
+ +subtaskDeleteDialog(subtask = subtaskToDelete)
+
+
+ .card-subtasks-items
+ each subtask in currentCard.subtasks
+ +subtaskDetail(subtask = subtask)
+
+ if canModifyCard
+ +inlinedForm(autoclose=false classNames="js-add-subtask" cardId = cardId)
+ +addSubtaskItemForm
+ else
+ a.js-open-inlined-form
+ i.fa.fa-plus
+ | {{_ 'add-subtask'}}...
+
+template(name="subtaskDetail")
+ .js-subtasks.subtask
+ +inlinedForm(classNames="js-edit-subtask-title" subtask = subtask)
+ +editSubtaskItemForm(subtask = subtask)
+ else
+ .subtask-title
+ span
+ a.js-view-subtask(title="{{ subtask.title }}") {{_ "view-it"}}
+ if canModifyCard
+ a.js-delete-subtask.toggle-delete-subtask-dialog {{_ "delete"}}...
+
+ if canModifyCard
+ h2.title.js-open-inlined-form.is-editable
+ +viewer
+ = subtask.title
+ else
+ h2.title
+ +viewer
+ = subtask.title
+
+template(name="subtaskDeleteDialog")
+ .js-confirm-subtask-delete
+ p
+ i(class="fa fa-exclamation-triangle" aria-hidden="true")
+ p
+ | {{_ 'confirm-subtask-delete-dialog'}}
+ span {{subtask.title}}
+ | ?
+ .js-subtask-delete-buttons
+ button.confirm-subtask-delete(type="button") {{_ 'delete'}}
+ button.toggle-delete-subtask-dialog(type="button") {{_ 'cancel'}}
+
+template(name="addSubtaskItemForm")
+ textarea.js-add-subtask-item(rows='1' autofocus)
+ .edit-controls.clearfix
+ button.primary.confirm.js-submit-add-subtask-item-form(type="submit") {{_ 'save'}}
+ a.fa.fa-times-thin.js-close-inlined-form
+
+template(name="editSubtaskItemForm")
+ textarea.js-edit-subtask-item(rows='1' autofocus)
+ if $eq type 'item'
+ = item.title
+ else
+ = subtask.title
+ .edit-controls.clearfix
+ button.primary.confirm.js-submit-edit-subtask-item-form(type="submit") {{_ 'save'}}
+ a.fa.fa-times-thin.js-close-inlined-form
+ span(title=createdAt) {{ moment createdAt }}
+ if canModifyCard
+ a.js-delete-subtask-item {{_ "delete"}}...
+
+template(name="subtasksItems")
+ .subtasks-items.js-subtasks-items
+ each item in subtasks.items
+ +inlinedForm(classNames="js-edit-subtask-item" item = item subtasks = subtasks)
+ +editSubtaskItemForm(type = 'item' item = item subtasks = subtasks)
+ else
+ +subtaskItemDetail(item = item subtasks = subtasks)
+ if canModifyCard
+ +inlinedForm(autoclose=false classNames="js-add-subtask-item" subtasks = subtasks)
+ +addSubtaskItemForm
+ else
+ a.add-subtask-item.js-open-inlined-form
+ i.fa.fa-plus
+ | {{_ 'add-subtask-item'}}...
+
+template(name='subtaskItemDetail')
+ .js-subtasks-item.subtasks-item
+ if canModifyCard
+ .check-box.materialCheckBox(class="{{#if item.isFinished }}is-checked{{/if}}")
+ .item-title.js-open-inlined-form.is-editable(class="{{#if item.isFinished }}is-checked{{/if}}")
+ +viewer
+ = item.title
+ else
+ .materialCheckBox(class="{{#if item.isFinished }}is-checked{{/if}}")
+ .item-title(class="{{#if item.isFinished }}is-checked{{/if}}")
+ +viewer
+ = item.title
diff --git a/client/components/cards/subtasks.js b/client/components/cards/subtasks.js
new file mode 100644
index 00000000..9c6f265e
--- /dev/null
+++ b/client/components/cards/subtasks.js
@@ -0,0 +1,145 @@
+BlazeComponent.extendComponent({
+ canModifyCard() {
+ return Meteor.user() && Meteor.user().isBoardMember() && !Meteor.user().isCommentOnly();
+ },
+}).register('subtaskDetail');
+
+BlazeComponent.extendComponent({
+
+ addSubtask(event) {
+ event.preventDefault();
+ const textarea = this.find('textarea.js-add-subtask-item');
+ const title = textarea.value.trim();
+ const cardId = this.currentData().cardId;
+ const card = Cards.findOne(cardId);
+ const sortIndex = -1;
+ const crtBoard = Boards.findOne(card.boardId);
+ const targetBoard = crtBoard.getDefaultSubtasksBoard();
+ const listId = targetBoard.getDefaultSubtasksListId();
+ const swimlaneId = targetBoard.getDefaultSwimline()._id;
+
+ if (title) {
+ const _id = Cards.insert({
+ title,
+ parentId: cardId,
+ members: [],
+ labelIds: [],
+ customFields: [],
+ listId,
+ boardId: targetBoard._id,
+ sort: sortIndex,
+ swimlaneId,
+ });
+
+ // In case the filter is active we need to add the newly inserted card in
+ // the list of exceptions -- cards that are not filtered. Otherwise the
+ // card will disappear instantly.
+ // See https://github.com/wekan/wekan/issues/80
+ Filter.addException(_id);
+
+
+ setTimeout(() => {
+ this.$('.add-subtask-item').last().click();
+ }, 100);
+ }
+ textarea.value = '';
+ textarea.focus();
+ },
+
+ canModifyCard() {
+ return Meteor.user() && Meteor.user().isBoardMember() && !Meteor.user().isCommentOnly();
+ },
+
+ deleteSubtask() {
+ const subtask = this.currentData().subtask;
+ if (subtask && subtask._id) {
+ subtask.archive();
+ this.toggleDeleteDialog.set(false);
+ }
+ },
+
+ editSubtask(event) {
+ event.preventDefault();
+ const textarea = this.find('textarea.js-edit-subtask-item');
+ const title = textarea.value.trim();
+ const subtask = this.currentData().subtask;
+ subtask.setTitle(title);
+ },
+
+ onCreated() {
+ this.toggleDeleteDialog = new ReactiveVar(false);
+ this.subtaskToDelete = null; //Store data context to pass to subtaskDeleteDialog template
+ },
+
+ pressKey(event) {
+ //If user press enter key inside a form, submit it
+ //Unless the user is also holding down the 'shift' key
+ if (event.keyCode === 13 && !event.shiftKey) {
+ event.preventDefault();
+ const $form = $(event.currentTarget).closest('form');
+ $form.find('button[type=submit]').click();
+ }
+ },
+
+ events() {
+ const events = {
+ 'click .toggle-delete-subtask-dialog'(event) {
+ if($(event.target).hasClass('js-delete-subtask')){
+ this.subtaskToDelete = this.currentData().subtask; //Store data context
+ }
+ this.toggleDeleteDialog.set(!this.toggleDeleteDialog.get());
+ },
+ 'click .js-view-subtask'(event) {
+ if($(event.target).hasClass('js-view-subtask')){
+ const subtask = this.currentData().subtask;
+ const board = subtask.board();
+ FlowRouter.go('card', {
+ boardId: board._id,
+ slug: board.slug,
+ cardId: subtask._id,
+ });
+ }
+ },
+ };
+
+ return [{
+ ...events,
+ 'submit .js-add-subtask': this.addSubtask,
+ 'submit .js-edit-subtask-title': this.editSubtask,
+ 'click .confirm-subtask-delete': this.deleteSubtask,
+ keydown: this.pressKey,
+ }];
+ },
+}).register('subtasks');
+
+Template.subtaskDeleteDialog.onCreated(() => {
+ const $cardDetails = this.$('.card-details');
+ this.scrollState = { position: $cardDetails.scrollTop(), //save current scroll position
+ top: false, //required for smooth scroll animation
+ };
+ //Callback's purpose is to only prevent scrolling after animation is complete
+ $cardDetails.animate({ scrollTop: 0 }, 500, () => { this.scrollState.top = true; });
+
+ //Prevent scrolling while dialog is open
+ $cardDetails.on('scroll', () => {
+ if(this.scrollState.top) { //If it's already in position, keep it there. Otherwise let animation scroll
+ $cardDetails.scrollTop(0);
+ }
+ });
+});
+
+Template.subtaskDeleteDialog.onDestroyed(() => {
+ const $cardDetails = this.$('.card-details');
+ $cardDetails.off('scroll'); //Reactivate scrolling
+ $cardDetails.animate( { scrollTop: this.scrollState.position });
+});
+
+Template.subtaskItemDetail.helpers({
+ canModifyCard() {
+ return Meteor.user() && Meteor.user().isBoardMember() && !Meteor.user().isCommentOnly();
+ },
+});
+
+BlazeComponent.extendComponent({
+ // ...
+}).register('subtaskItemDetail');
diff --git a/client/components/cards/subtasks.styl b/client/components/cards/subtasks.styl
new file mode 100644
index 00000000..c2f09aa1
--- /dev/null
+++ b/client/components/cards/subtasks.styl
@@ -0,0 +1,142 @@
+.js-add-subtask
+ color: #8c8c8c
+
+textarea.js-add-subtask-item, textarea.js-edit-subtask-item
+ overflow: hidden
+ word-wrap: break-word
+ resize: none
+ height: 34px
+
+.delete-text
+ color: #8c8c8c
+ text-decoration: underline
+ word-wrap: break-word
+ float: right
+ padding-top: 6px
+ &:hover
+ color: inherit
+
+.subtask-title
+ .checkbox
+ float: left
+ width: 30px
+ height 30px
+ font-size: 18px
+ line-height: 30px
+
+ .title
+ font-size: 18px
+ line-height: 25px
+
+ .subtasks-stat
+ margin: 0 0.5em
+ float: right
+ padding-top: 6px
+ &.is-finished
+ color: #3cb500
+
+ .js-delete-subtask
+ @extends .delete-text
+ margin: 0 0.5em
+
+ .js-view-subtask
+ @extends .delete-text
+
+.js-confirm-subtask-delete
+ background-color: darken(white, 3%)
+ position: absolute
+ float: left;
+ width: 60%
+ margin-top: 0
+ margin-left: 13%
+ padding-bottom: 2%
+ padding-left: 3%
+ padding-right: 3%
+ z-index: 17
+ border-radius: 3px
+
+ p
+ position: relative
+ margin-top: 3%
+ width: 100%
+ text-align: center
+ span
+ font-weight: bold
+
+ i
+ font-size: 2em
+
+ .js-subtask-delete-buttons
+ position: relative
+ padding: left 2% right 2%
+ .confirm-subtask-delete
+ margin-left: 12%
+ float: left
+ .toggle-delete-subtask-dialog
+ margin-right: 12%
+ float: right
+
+#card-details-overlay
+ top: 0
+ bottom: -600px
+ right: 0
+
+.subtasks
+ background: darken(white, 3%)
+
+ &.placeholder
+ background: darken(white, 20%)
+ border-radius: 2px
+
+ &.ui-sortable-helper
+ box-shadow: -2px 2px 8px rgba(0, 0, 0, .3),
+ 0 0 1px rgba(0, 0, 0, .5)
+ transform: rotate(4deg)
+ cursor: grabbing
+
+
+.subtasks-item
+ margin: 0 0 0 0.1em
+ line-height: 18px
+ font-size: 1.1em
+ margin-top: 3px
+ display: flex
+ background: darken(white, 3%)
+
+ &.placeholder
+ background: darken(white, 20%)
+ border-radius: 2px
+
+ &.ui-sortable-helper
+ box-shadow: -2px 2px 8px rgba(0, 0, 0, .3),
+ 0 0 1px rgba(0, 0, 0, .5)
+ transform: rotate(4deg)
+ cursor: grabbing
+
+ &:hover
+ background-color: darken(white, 8%)
+
+ .check-box
+ margin: 0.1em 0 0 0;
+ &.is-checked
+ border-bottom: 2px solid #3cb500
+ border-right: 2px solid #3cb500
+
+ .item-title
+ flex: 1
+ padding-left: 10px;
+ &.is-checked
+ color: #8c8c8c
+ font-style: italic
+ & .viewer
+ p
+ margin-bottom: 2px
+
+.js-delete-subtask-item
+ margin: 0 0 0.5em 1.33em
+ @extends .delete-text
+ padding: 12px 0 0 0
+
+.add-subtask-item
+ margin: 0.2em 0 0.5em 1.33em
+ display: inline-block
generated by cgit v1.2.3-1-g7c22 (git 2.25.1) at 2024-10-31 09:22:43 +0000