diff options
author | Marc Hartmayer <hello@hartmayer.com> | 2020-06-09 23:32:00 +0200 |
---|---|---|
committer | Marc Hartmayer <hello@hartmayer.com> | 2020-06-09 23:40:44 +0200 |
commit | 5755ece33e9fc5967c0b726abed0912fde9612db (patch) | |
tree | a226c3a2cbecec2bc2900bcd7ed6dcfe90466107 /client/components/cards | |
parent | 2a25318ba8c262ed3282b50a83f5a8c0ecb212a1 (diff) | |
download | wekan-5755ece33e9fc5967c0b726abed0912fde9612db.tar.gz wekan-5755ece33e9fc5967c0b726abed0912fde9612db.tar.bz2 wekan-5755ece33e9fc5967c0b726abed0912fde9612db.zip |
Add user option to hide finished checklist items
Add a user option to hide finished items in a checklist.
Diffstat (limited to 'client/components/cards')
-rw-r--r-- | client/components/cards/checklists.jade | 18 | ||||
-rw-r--r-- | client/components/cards/checklists.js | 16 | ||||
-rw-r--r-- | client/components/cards/checklists.styl | 13 |
3 files changed, 43 insertions, 4 deletions
diff --git a/client/components/cards/checklists.jade b/client/components/cards/checklists.jade index 1b1e088a..25aa11b9 100644 --- a/client/components/cards/checklists.jade +++ b/client/components/cards/checklists.jade @@ -1,7 +1,17 @@ template(name="checklists") - h3 - i.fa.fa-check - | {{_ 'checklists'}} + .checklists-title + h3 + i.fa.fa-check + | {{_ 'checklists'}} + if currentUser.isBoardMember + .material-toggle-switch + span.toggle-switch-title {{_ 'hide-checked-items'}} + if hideCheckedItems + input.toggle-switch(type="checkbox" id="toggleHideCheckedItemsButton" checked="checked") + else + input.toggle-switch(type="checkbox" id="toggleHideCheckedItemsButton") + label.toggle-label(for="toggleHideCheckedItemsButton") + if toggleDeleteDialog.get .board-overlay#card-details-overlay +checklistDeleteDialog(checklist = checklistToDelete) @@ -86,7 +96,7 @@ template(name="checklistItems") | {{_ 'add-checklist-item'}}... template(name='checklistItemDetail') - .js-checklist-item.checklist-item + .js-checklist-item.checklist-item(class="{{#if item.isFinished }}is-checked{{#if hideCheckedItems}} invisible{{/if}}{{/if}}") if canModifyCard .check-box-container .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 29573d2b..17faa773 100644 --- a/client/components/cards/checklists.js +++ b/client/components/cards/checklists.js @@ -193,6 +193,9 @@ BlazeComponent.extendComponent({ } this.toggleDeleteDialog.set(!this.toggleDeleteDialog.get()); }, + 'click #toggleHideCheckedItemsButton'() { + Meteor.call('toggleHideCheckedItems'); + }, }; return [ @@ -211,6 +214,14 @@ BlazeComponent.extendComponent({ }, }).register('checklists'); +Template.checklists.helpers({ + hideCheckedItems() { + const currentUser = Meteor.user(); + if (currentUser) return currentUser.hasHideCheckedItems(); + return false; + }, +}); + Template.checklistDeleteDialog.onCreated(() => { const $cardDetails = this.$('.card-details'); this.scrollState = { @@ -246,6 +257,11 @@ Template.checklistItemDetail.helpers({ !Meteor.user().isWorker() ); }, + hideCheckedItems() { + const user = Meteor.user(); + if (user) return user.hasHideCheckedItems(); + return false; + }, }); BlazeComponent.extendComponent({ diff --git a/client/components/cards/checklists.styl b/client/components/cards/checklists.styl index 0a6d688b..f8c36a12 100644 --- a/client/components/cards/checklists.styl +++ b/client/components/cards/checklists.styl @@ -16,6 +16,10 @@ textarea.js-add-checklist-item, textarea.js-edit-checklist-item &:hover color: inherit +.checklists-title + display: flex + justify-content: space-between + .checklist-title .checkbox float: left @@ -99,6 +103,15 @@ textarea.js-add-checklist-item, textarea.js-edit-checklist-item margin-top: 3px display: flex background: darken(white, 3%) + opacity: 1 + transition: height 0ms 400ms, opacity 400ms 0ms + height: auto + overflow: hidden + + &.is-checked.invisible + opacity: 0 + height: 0 + transition: height 0ms 0ms, opacity 600ms 0ms &.placeholder background: darken(white, 20%) |