diff options
Diffstat (limited to 'client/components/lists')
-rw-r--r-- | client/components/lists/list.js | 14 | ||||
-rw-r--r-- | client/components/lists/list.styl | 26 | ||||
-rw-r--r-- | client/components/lists/listHeader.jade | 7 | ||||
-rw-r--r-- | client/components/lists/listHeader.js | 24 |
4 files changed, 65 insertions, 6 deletions
diff --git a/client/components/lists/list.js b/client/components/lists/list.js index bde43520..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 (Utils.isMiniScreen()) { + 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..0d3ccfce 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,16 @@ @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 + + .list-header + .list-header-name + margin-left: 1.4rem .mini-list flex: 0 0 60px @@ -221,9 +229,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..3b3a0242 100644 --- a/client/components/lists/listHeader.jade +++ b/client/components/lists/listHeader.jade @@ -9,6 +9,7 @@ template(name="listHeader") if currentList a.list-header-left-icon.fa.fa-angle-left.js-unselect-list h2.list-header-name( + title="{{ moment modifiedAt 'LLL' }}" class="{{#if currentUser.isBoardMember}}{{#unless currentUser.isCommentOnly}}js-open-inlined-form is-editable{{/unless}}{{/if}}") +viewer = title @@ -29,16 +30,22 @@ 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 div.list-header-menu unless currentUser.isCommentOnly + if isBoardAdmin + a.fa.js-list-star.list-header-plus-icon(class="fa-star{{#unless starred}}-o{{/unless}}") 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..b524d4e0 100644 --- a/client/components/lists/listHeader.js +++ b/client/components/lists/listHeader.js @@ -13,6 +13,20 @@ BlazeComponent.extendComponent({ ); }, + isBoardAdmin() { + return Meteor.user().isBoardAdmin(); + }, + starred(check = undefined) { + const list = Template.currentData(); + const status = list.isStarred(); + if (check === undefined) { + // just check + return status; + } else { + list.star(!status); + return !status; + } + }, editTitle(event) { event.preventDefault(); const newTitle = this.childComponents('inlinedForm')[0] @@ -61,6 +75,10 @@ BlazeComponent.extendComponent({ events() { return [ { + 'click .js-list-star'(event) { + event.preventDefault(); + this.starred(!this.starred()); + }, 'click .js-open-list-menu': Popup.open('listAction'), 'click .js-add-card'(event) { const listDom = $(event.target).parents( @@ -80,6 +98,12 @@ BlazeComponent.extendComponent({ }, }).register('listHeader'); +Template.listHeader.helpers({ + showDesktopDragHandles() { + return Meteor.user().hasShowDesktopDragHandles(); + }, +}); + Template.listActionPopup.helpers({ isWipLimitEnabled() { return Template.currentData().getWipLimit('enabled'); |