diff options
author | Lauri Ojansivu <x@xet7.org> | 2019-10-01 00:48:36 +0300 |
---|---|---|
committer | Lauri Ojansivu <x@xet7.org> | 2019-10-01 00:48:36 +0300 |
commit | 98c38fe58f597cbc0389676ae880704a671e480b (patch) | |
tree | 56044051bc05c6d2ee9a942987a5740b3ea12d73 /client/components/cards | |
parent | 44378fe9d10f690a42dc79f0e07aebade7f708f1 (diff) | |
download | wekan-98c38fe58f597cbc0389676ae880704a671e480b.tar.gz wekan-98c38fe58f597cbc0389676ae880704a671e480b.tar.bz2 wekan-98c38fe58f597cbc0389676ae880704a671e480b.zip |
Drag handles continue. In progress.
Thanks to xet7 !
Diffstat (limited to 'client/components/cards')
-rw-r--r-- | client/components/cards/cardDetails.js | 3 | ||||
-rw-r--r-- | client/components/cards/checklists.jade | 7 | ||||
-rw-r--r-- | client/components/cards/checklists.js | 19 | ||||
-rw-r--r-- | client/components/cards/checklists.styl | 19 |
4 files changed, 40 insertions, 8 deletions
diff --git a/client/components/cards/cardDetails.js b/client/components/cards/cardDetails.js index 47941560..ad0ee1a6 100644 --- a/client/components/cards/cardDetails.js +++ b/client/components/cards/cardDetails.js @@ -165,7 +165,8 @@ BlazeComponent.extendComponent({ $checklistsDom.sortable({ tolerance: 'pointer', helper: 'clone', - handle: '.checklist-title', + //handle: '.checklist-title', + handle: '.checklist-item-handle', items: '.js-checklist', placeholder: 'checklist placeholder', distance: 7, diff --git a/client/components/cards/checklists.jade b/client/components/cards/checklists.jade index 279d3671..5cc82211 100644 --- a/client/components/cards/checklists.jade +++ b/client/components/cards/checklists.jade @@ -31,10 +31,12 @@ template(name="checklistDetail") h2.title.js-open-inlined-form.is-editable +viewer = checklist.title + a.checklist-handle.handle.fa.fa-arrows.js-checklist-handle else h2.title +viewer = checklist.title + a.checklist-handle.handle.fa.fa-arrows.js-checklist-handle +checklistItems(checklist = checklist) template(name="checklistDeleteDialog") @@ -75,6 +77,11 @@ template(name="checklistItems") +editChecklistItemForm(type = 'item' item = item checklist = checklist) else +checklistItemDetail(item = item checklist = checklist) + if isMiniScreen + a.checklist-item-handle.handle.fa.fa-arrows.js-checklist-item-handle + unless isMiniScreen + if showDesktopDragHandles + a.checklist-item-handle.handle.fa.fa-arrows.js-checklist-item-handle if canModifyCard +inlinedForm(autoclose=false classNames="js-add-checklist-item" checklist = checklist) +addChecklistItemForm diff --git a/client/components/cards/checklists.js b/client/components/cards/checklists.js index 57939eb8..1a3a3265 100644 --- a/client/components/cards/checklists.js +++ b/client/components/cards/checklists.js @@ -4,11 +4,11 @@ function initSorting(items) { items.sortable({ tolerance: 'pointer', helper: 'clone', - items: '.js-checklist-item:not(.placeholder)', + items: '.js-checklist-item-handle:not(.placeholder)', connectWith: '.js-checklist-items', appendTo: '.board-canvas', distance: 7, - placeholder: 'checklist-item placeholder', + placeholder: 'checklist-item-handle placeholder', scroll: false, start(evt, ui) { ui.placeholder.height(ui.helper.height()); @@ -17,11 +17,11 @@ function initSorting(items) { stop(evt, ui) { const parent = ui.item.parents('.js-checklist-items'); const checklistId = Blaze.getData(parent.get(0)).checklist._id; - let prevItem = ui.item.prev('.js-checklist-item').get(0); + let prevItem = ui.item.prev('.js-checklist-item-handle').get(0); if (prevItem) { prevItem = Blaze.getData(prevItem).item; } - let nextItem = ui.item.next('.js-checklist-item').get(0); + let nextItem = ui.item.next('.js-checklist-item-handle').get(0); if (nextItem) { nextItem = Blaze.getData(nextItem).item; } @@ -38,7 +38,7 @@ function initSorting(items) { }); // ugly touch event hotfix - enableClickOnTouch('.js-checklist-item:not(.placeholder)'); + enableClickOnTouch('.js-checklist-item-handle:not(.placeholder)'); } BlazeComponent.extendComponent({ @@ -197,6 +197,12 @@ BlazeComponent.extendComponent({ }, }).register('checklists'); +Template.checklists.helpers({ + showDesktopDragHandles() { + return Meteor.user().hasShowDesktopDragHandles(); + }, +}); + Template.checklistDeleteDialog.onCreated(() => { const $cardDetails = this.$('.card-details'); this.scrollState = { @@ -231,6 +237,9 @@ Template.checklistItemDetail.helpers({ !Meteor.user().isCommentOnly() ); }, + showDesktopDragHandles() { + return Meteor.user().hasShowDesktopDragHandles(); + }, }); BlazeComponent.extendComponent({ diff --git a/client/components/cards/checklists.styl b/client/components/cards/checklists.styl index 8ac37a15..a383a128 100644 --- a/client/components/cards/checklists.styl +++ b/client/components/cards/checklists.styl @@ -35,6 +35,14 @@ textarea.js-add-checklist-item, textarea.js-edit-checklist-item &.is-finished color: #3cb500 + .checklist-handle + position: absolute + padding: 7px + top: 50% + transform: translateY(-50%) + left: 100px + font-size: 18px + .js-delete-checklist @extends .delete-text @@ -70,7 +78,7 @@ textarea.js-add-checklist-item, textarea.js-edit-checklist-item margin-left: 12% float: left .toggle-delete-checklist-dialog - margin-right: 12% + margin-right: 20% float: right #card-details-overlay @@ -125,12 +133,19 @@ textarea.js-add-checklist-item, textarea.js-edit-checklist-item &.is-checked color: #8c8c8c font-style: italic - & .viewer + &.viewer p margin-bottom: 2px display: block word-wrap: break-word max-width: 420px + .checklist-item-handle + position: absolute + padding: 7px + top: 50% + transform: translateY(-50%) + left: 200px + font-size: 18px .js-delete-checklist-item margin: 0 0 0.5em 1.33em |