diff options
author | Lauri Ojansivu <x@xet7.org> | 2019-09-19 01:12:04 +0300 |
---|---|---|
committer | Lauri Ojansivu <x@xet7.org> | 2019-09-19 01:12:04 +0300 |
commit | 55a2473d813c6e6687de393bda1ccc0c21f9ebcc (patch) | |
tree | 4cd96ee0c363153c6733454b91dea3185a11e76d | |
parent | ba754cfaea9a467e18b2b4b4bcbaafaaac442677 (diff) | |
parent | 03d7fc02ecc90690e1282d417f35b7e4561af066 (diff) | |
download | wekan-55a2473d813c6e6687de393bda1ccc0c21f9ebcc.tar.gz wekan-55a2473d813c6e6687de393bda1ccc0c21f9ebcc.tar.bz2 wekan-55a2473d813c6e6687de393bda1ccc0c21f9ebcc.zip |
Merge branch 'feature-drag-handle'
-rw-r--r-- | client/components/boards/boardBody.js | 2 | ||||
-rw-r--r-- | client/components/cards/minicard.jade | 9 | ||||
-rw-r--r-- | client/components/cards/minicard.js | 3 | ||||
-rw-r--r-- | client/components/cards/minicard.styl | 2 | ||||
-rw-r--r-- | client/components/lists/list.js | 14 | ||||
-rw-r--r-- | client/components/lists/list.styl | 22 | ||||
-rw-r--r-- | client/components/lists/listHeader.jade | 4 | ||||
-rw-r--r-- | client/components/lists/listHeader.js | 6 | ||||
-rw-r--r-- | client/components/swimlanes/swimlaneHeader.jade | 2 | ||||
-rw-r--r-- | client/components/swimlanes/swimlaneHeader.js | 6 | ||||
-rw-r--r-- | client/components/swimlanes/swimlanes.js | 56 | ||||
-rw-r--r-- | client/components/swimlanes/swimlanes.styl | 8 | ||||
-rw-r--r-- | client/components/users/userHeader.jade | 5 | ||||
-rw-r--r-- | client/components/users/userHeader.js | 6 | ||||
-rw-r--r-- | models/users.js | 24 |
15 files changed, 151 insertions, 18 deletions
diff --git a/client/components/boards/boardBody.js b/client/components/boards/boardBody.js index 07cd306a..713b6cbc 100644 --- a/client/components/boards/boardBody.js +++ b/client/components/boards/boardBody.js @@ -89,7 +89,7 @@ BlazeComponent.extendComponent({ helper.append(list.clone()); return helper; }, - handle: '.js-swimlane-header', + handle: '.js-swimlane-header-handle', items: '.swimlane:not(.placeholder)', placeholder: 'swimlane placeholder', distance: 7, diff --git a/client/components/cards/minicard.jade b/client/components/cards/minicard.jade index 3806ce41..a3f32304 100644 --- a/client/components/cards/minicard.jade +++ b/client/components/cards/minicard.jade @@ -3,6 +3,13 @@ template(name="minicard") class="{{#if isLinkedCard}}linked-card{{/if}}" class="{{#if isLinkedBoard}}linked-board{{/if}}" class="minicard-{{colorClass}}") + if isMiniScreen + .handle + .fa.fa-arrows + unless isMiniScreen + if showDesktopDragHandles + .handle + .fa.fa-arrows if cover .minicard-cover(style="background-image: url('{{cover.url}}');") if labels @@ -15,8 +22,6 @@ template(name="minicard") if hiddenMinicardLabelText .minicard-label(class="card-label-{{color}}" title="{{name}}") .minicard-title - .handle - .fa.fa-arrows if $eq 'prefix-with-full-path' currentBoard.presentParentTask .parent-prefix | {{ parentString ' > ' }} diff --git a/client/components/cards/minicard.js b/client/components/cards/minicard.js index 4c25c11d..4c76db46 100644 --- a/client/components/cards/minicard.js +++ b/client/components/cards/minicard.js @@ -26,6 +26,9 @@ BlazeComponent.extendComponent({ }).register('minicard'); Template.minicard.helpers({ + showDesktopDragHandles() { + return Meteor.user().hasShowDesktopDragHandles(); + }, hiddenMinicardLabelText() { return Meteor.user().hasHiddenMinicardLabelText(); }, diff --git a/client/components/cards/minicard.styl b/client/components/cards/minicard.styl index c4172572..9997fd5f 100644 --- a/client/components/cards/minicard.styl +++ b/client/components/cards/minicard.styl @@ -105,7 +105,7 @@ right: 5px; top: 5px; display:none; - @media only screen and (max-width: 1199px) { + @media only screen { display:block; } .fa-arrows diff --git a/client/components/lists/list.js b/client/components/lists/list.js index c2b39be9..b7b8b2e0 100644 --- a/client/components/lists/list.js +++ b/client/components/lists/list.js @@ -31,7 +31,13 @@ BlazeComponent.extendComponent({ const itemsSelector = '.js-minicard:not(.placeholder, .js-card-composer)'; const $cards = this.$('.js-minicards'); - if (window.matchMedia('(max-width: 1199px)').matches) { + if (Utils.isMiniScreen) { + $('.js-minicards').sortable({ + handle: '.handle', + }); + } + + if (!Utils.isMiniScreen && showDesktopDragHandles) { $('.js-minicards').sortable({ handle: '.handle', }); @@ -155,6 +161,12 @@ BlazeComponent.extendComponent({ }, }).register('list'); +Template.list.helpers({ + showDesktopDragHandles() { + return Meteor.user().hasShowDesktopDragHandles(); + }, +}); + Template.miniList.events({ 'click .js-select-list'() { const listId = this._id; diff --git a/client/components/lists/list.styl b/client/components/lists/list.styl index 81938c1a..459481ea 100644 --- a/client/components/lists/list.styl +++ b/client/components/lists/list.styl @@ -84,17 +84,16 @@ padding-left: 10px color: #a6a6a6 - .list-header-menu position: absolute padding: 27px 19px margin-top: 1px top: -7px - right: -7px + right: 3px .list-header-plus-icon color: #a6a6a6 - margin-right: 10px + margin-right: 15px .highlight color: #ce1414 @@ -165,7 +164,12 @@ @media screen and (max-width: 800px) .list-header-menu - margin-right: 30px + position: absolute + padding: 27px 19px + margin-top: 1px + top: -7px + margin-right: 50px + right: -3px .mini-list flex: 0 0 60px @@ -221,9 +225,17 @@ padding: 7px top: 50% transform: translateY(-50%) - right: 17px + margin-right: 27px font-size: 20px + .list-header-menu-handle + position: absolute + padding: 7px + top: 50% + transform: translateY(-50%) + right: 10px + font-size: 24px + .link-board-wrapper display: flex align-items: baseline diff --git a/client/components/lists/listHeader.jade b/client/components/lists/listHeader.jade index f930e57a..6a61a66f 100644 --- a/client/components/lists/listHeader.jade +++ b/client/components/lists/listHeader.jade @@ -29,8 +29,10 @@ template(name="listHeader") if canSeeAddCard a.js-add-card.fa.fa-plus.list-header-plus-icon a.fa.fa-navicon.js-open-list-menu + a.list-header-menu-handle.handle.fa.fa-arrows.js-list-handle else a.list-header-menu-icon.fa.fa-angle-right.js-select-list + a.list-header-menu-handle.handle.fa.fa-arrows.js-list-handle else if currentUser.isBoardMember if isWatching i.list-header-watch-icon.fa.fa-eye @@ -39,6 +41,8 @@ template(name="listHeader") if canSeeAddCard a.js-add-card.fa.fa-plus.list-header-plus-icon a.fa.fa-navicon.js-open-list-menu + if showDesktopDragHandles + a.list-header-menu-handle.handle.fa.fa-arrows.js-list-handle template(name="editListTitleForm") .list-composer diff --git a/client/components/lists/listHeader.js b/client/components/lists/listHeader.js index e8a82499..5b7232cd 100644 --- a/client/components/lists/listHeader.js +++ b/client/components/lists/listHeader.js @@ -80,6 +80,12 @@ BlazeComponent.extendComponent({ }, }).register('listHeader'); +Template.listHeader.helpers({ + showDesktopDragHandles() { + return Meteor.user().hasShowDesktopDragHandles(); + }, +}); + Template.listActionPopup.helpers({ isWipLimitEnabled() { return Template.currentData().getWipLimit('enabled'); diff --git a/client/components/swimlanes/swimlaneHeader.jade b/client/components/swimlanes/swimlaneHeader.jade index 8c6aa5a3..fb6ef21d 100644 --- a/client/components/swimlanes/swimlaneHeader.jade +++ b/client/components/swimlanes/swimlaneHeader.jade @@ -16,6 +16,8 @@ template(name="swimlaneFixedHeader") unless currentUser.isCommentOnly a.fa.fa-plus.js-open-add-swimlane-menu.swimlane-header-plus-icon a.fa.fa-navicon.js-open-swimlane-menu + if showDesktopDragHandles + a.swimlane-header-menu-handle.handle.fa.fa-arrows.js-swimlane-header-handle template(name="editSwimlaneTitleForm") .list-composer diff --git a/client/components/swimlanes/swimlaneHeader.js b/client/components/swimlanes/swimlaneHeader.js index ee21d100..6f8029fd 100644 --- a/client/components/swimlanes/swimlaneHeader.js +++ b/client/components/swimlanes/swimlaneHeader.js @@ -28,6 +28,12 @@ BlazeComponent.extendComponent({ }, }).register('swimlaneHeader'); +Template.swimlaneHeader.helpers({ + showDesktopDragHandles() { + return Meteor.user().hasShowDesktopDragHandles(); + }, +}); + Template.swimlaneActionPopup.events({ 'click .js-set-swimlane-color': Popup.open('setSwimlaneColor'), 'click .js-close-swimlane'(event) { diff --git a/client/components/swimlanes/swimlanes.js b/client/components/swimlanes/swimlanes.js index e0857003..33a7991e 100644 --- a/client/components/swimlanes/swimlanes.js +++ b/client/components/swimlanes/swimlanes.js @@ -53,10 +53,21 @@ function initSortable(boardComponent, $listsDom) { }, }; + if (Utils.isMiniScreen) { + $listsDom.sortable({ + handle: '.js-list-handle', + }); + } + + if (!Utils.isMiniScreen && showDesktopDragHandles) { + $listsDom.sortable({ + handle: '.js-list-header', + }); + } + $listsDom.sortable({ tolerance: 'pointer', helper: 'clone', - handle: '.js-list-header', items: '.js-list:not(.js-list-composer)', placeholder: 'list placeholder', distance: 7, @@ -151,13 +162,39 @@ BlazeComponent.extendComponent({ // define a list of elements in which we disable the dragging because // the user will legitimately expect to be able to select some text with // his mouse. - const noDragInside = [ - 'a', - 'input', - 'textarea', - 'p', - '.js-list-header', - ]; + + if (Utils.isMiniScreen) { + const noDragInside = [ + 'a', + 'input', + 'textarea', + 'p', + '.js-list-handle', + '.js-swimlane-header-handle', + ]; + } + + if (!Utils.isMiniScreen && !showDesktopDragHandles) { + const noDragInside = [ + 'a', + 'input', + 'textarea', + 'p', + '.js-list-header', + ]; + } + + if (!Utils.isMiniScreen && showDesktopDragHandles) { + const noDragInside = [ + 'a', + 'input', + 'textarea', + 'p', + '.js-list-handle', + '.js-swimlane-header-handle', + ]; + } + if ( $(evt.target).closest(noDragInside.join(',')).length === 0 && this.$('.swimlane').prop('clientHeight') > evt.offsetY @@ -233,6 +270,9 @@ BlazeComponent.extendComponent({ }).register('addListForm'); Template.swimlane.helpers({ + showDesktopDragHandles() { + return Meteor.user().hasShowDesktopDragHandles(); + }, canSeeAddList() { return ( Meteor.user() && diff --git a/client/components/swimlanes/swimlanes.styl b/client/components/swimlanes/swimlanes.styl index 1056e1e3..503091ee 100644 --- a/client/components/swimlanes/swimlanes.styl +++ b/client/components/swimlanes/swimlanes.styl @@ -50,6 +50,14 @@ margin-left: 5px margin-right: 10px + .swimlane-header-menu-handle + position: absolute + padding: 7px + top: 50% + transform: translateY(-50%) + left: 300px + font-size: 18px + .list-group height: 100% diff --git a/client/components/users/userHeader.jade b/client/components/users/userHeader.jade index 946bdab1..50a80396 100644 --- a/client/components/users/userHeader.jade +++ b/client/components/users/userHeader.jade @@ -79,6 +79,11 @@ template(name="changeSettingsPopup") if hiddenSystemMessages i.fa.fa-check li + a.js-toggle-desktop-drag-handles + | {{_ 'show-desktop-drag-handles'}} + if showDesktopDragHandles + i.fa.fa-check + li label.bold | {{_ 'show-cards-minimum-count'}} input#show-cards-count-at.inline-input.left(type="number" value="#{showCardsCountAt}" min="0" max="99" onkeydown="return false") diff --git a/client/components/users/userHeader.js b/client/components/users/userHeader.js index 36fb2020..194f990f 100644 --- a/client/components/users/userHeader.js +++ b/client/components/users/userHeader.js @@ -161,6 +161,9 @@ Template.changeLanguagePopup.events({ }); Template.changeSettingsPopup.helpers({ + showDesktopDragHandles() { + return Meteor.user().hasShowDesktopDragHandles(); + }, hiddenSystemMessages() { return Meteor.user().hasHiddenSystemMessages(); }, @@ -170,6 +173,9 @@ Template.changeSettingsPopup.helpers({ }); Template.changeSettingsPopup.events({ + 'click .js-toggle-desktop-drag-handles'() { + Meteor.call('toggleDesktopDragHandles'); + }, 'click .js-toggle-system-messages'() { Meteor.call('toggleSystemMessages'); }, diff --git a/models/users.js b/models/users.js index ee53c7ab..ded864e5 100644 --- a/models/users.js +++ b/models/users.js @@ -109,6 +109,13 @@ Users.attachSchema( type: String, optional: true, }, + 'profile.showDesktopDragHandles': { + /** + * does the user want to hide system messages? + */ + type: Boolean, + optional: true, + }, 'profile.hiddenSystemMessages': { /** * does the user want to hide system messages? @@ -368,6 +375,11 @@ Users.helpers({ return _.contains(notifications, activityId); }, + hasShowDesktopDragHandles() { + const profile = this.profile || {}; + return profile.showDesktopDragHandles || false; + }, + hasHiddenSystemMessages() { const profile = this.profile || {}; return profile.hiddenSystemMessages || false; @@ -473,6 +485,14 @@ Users.mutations({ else this.addTag(tag); }, + toggleDesktopHandles(value = false) { + return { + $set: { + 'profile.showDesktopDragHandles': !value, + }, + }; + }, + toggleSystem(value = false) { return { $set: { @@ -548,6 +568,10 @@ Meteor.methods({ Users.update(userId, { $set: { username } }); } }, + toggleDesktopDragHandles() { + const user = Meteor.user(); + user.toggleDesktopHandles(user.hasShowDesktopDragHandles()); + }, toggleSystemMessages() { const user = Meteor.user(); user.toggleSystem(user.hasHiddenSystemMessages()); |