diff options
author | Maxime Quandalle <maxime@quandalle.com> | 2015-05-27 17:17:00 +0200 |
---|---|---|
committer | Maxime Quandalle <maxime@quandalle.com> | 2015-05-27 17:23:25 +0200 |
commit | dcc64f44f9f81d32c8071c6bdac86546eaeb57a0 (patch) | |
tree | b8977727227a3ddbb2874ea3f86f1e26e03c8835 /client/components/lists/main.js | |
parent | 42f6dc686f313ba294e3cbcfb0ebde50678580fe (diff) | |
download | wekan-dcc64f44f9f81d32c8071c6bdac86546eaeb57a0.tar.gz wekan-dcc64f44f9f81d32c8071c6bdac86546eaeb57a0.tar.bz2 wekan-dcc64f44f9f81d32c8071c6bdac86546eaeb57a0.zip |
UI improvements
* Implement visibility choice on board creation;
* Rework the board header bar. Remove links to un-implemented
features;
* Implement a board star counter (visible if the board have >2 stars);
* Define a new icon (a thin cross) to close elements;
* Remove $(document).on('mouseover') event handlers that were
basically fired hundreds of times for nothing, we now define a proper
Tracker dependency to execute jquery-ui plugin initialization only
when something has changed;
* Bug fixes related to list scrolling.
Diffstat (limited to 'client/components/lists/main.js')
-rw-r--r-- | client/components/lists/main.js | 87 |
1 files changed, 49 insertions, 38 deletions
diff --git a/client/components/lists/main.js b/client/components/lists/main.js index 3464865a..8f86183a 100644 --- a/client/components/lists/main.js +++ b/client/components/lists/main.js @@ -24,58 +24,69 @@ BlazeComponent.extendComponent({ // powerful enough for our use casesShould we “simply” write the drag&drop // code ourselves? onRendered: function() { - if (Meteor.user().isBoardMember()) { - var boardComponent = this.componentParent(); - var itemsSelector = '.js-minicard:not(.placeholder, .hide, .js-composer)'; - var $cards = this.$('.js-minicards'); - $cards.sortable({ - connectWith: '.js-minicards', - tolerance: 'pointer', - appendTo: '.js-lists', - helper: 'clone', - items: itemsSelector, - placeholder: 'minicard placeholder', - start: function(event, ui) { - $('.minicard.placeholder').height(ui.item.height()); - Popup.close(); - boardComponent.showNewCardForms(false); - }, - stop: function(event, ui) { - // To attribute the new index number, we need to get the dom element - // of the previous and the following card -- if any. - var cardDomElement = ui.item.get(0); - var prevCardDomElement = ui.item.prev('.js-minicard').get(0); - var nextCardDomElement = ui.item.next('.js-minicard').get(0); - var sort = Utils.getSortIndex(prevCardDomElement, nextCardDomElement); - var cardId = Blaze.getData(cardDomElement)._id; - var listId = Blaze.getData(ui.item.parents('.list').get(0))._id; - Cards.update(cardId, { - $set: { - listId: listId, - sort: sort - } - }); - boardComponent.showNewCardForms(true); - } - }).disableSelection(); + var self = this; + if (! Meteor.userId() || ! Meteor.user().isBoardMember()) + return; - $(document).on('mouseover', function() { + var boardComponent = self.componentParent(); + var itemsSelector = '.js-minicard:not(.placeholder, .hide, .js-composer)'; + var $cards = self.$('.js-minicards'); + $cards.sortable({ + connectWith: '.js-minicards', + tolerance: 'pointer', + appendTo: '.js-lists', + helper: 'clone', + items: itemsSelector, + placeholder: 'minicard placeholder', + start: function(event, ui) { + $('.minicard.placeholder').height(ui.item.height()); + Popup.close(); + boardComponent.showNewCardForms(false); + }, + stop: function(event, ui) { + // To attribute the new index number, we need to get the dom element + // of the previous and the following card -- if any. + var cardDomElement = ui.item.get(0); + var prevCardDomElement = ui.item.prev('.js-minicard').get(0); + var nextCardDomElement = ui.item.next('.js-minicard').get(0); + var sort = Utils.getSortIndex(prevCardDomElement, nextCardDomElement); + var cardId = Blaze.getData(cardDomElement)._id; + var listId = Blaze.getData(ui.item.parents('.list').get(0))._id; + Cards.update(cardId, { + $set: { + listId: listId, + sort: sort + } + }); + boardComponent.showNewCardForms(true); + } + }); + + // We want to re-run this function any time a card is added. + self.autorun(function() { + var currentBoardId = Tracker.nonreactive(function() { + return Session.get('currentBoard'); + }); + Cards.find({ boardId: currentBoardId }).fetch(); + Tracker.afterFlush(function() { $cards.find(itemsSelector).droppable({ hoverClass: 'draggable-hover-card', accept: '.js-member,.js-label', drop: function(event, ui) { var cardId = Blaze.getData(this)._id; + var addToSet; if (ui.draggable.hasClass('js-member')) { var memberId = Blaze.getData(ui.draggable.get(0)).userId; - Cards.update(cardId, {$addToSet: {members: memberId}}); + addToSet = { members: memberId }; } else { var labelId = Blaze.getData(ui.draggable.get(0))._id; - Cards.update(cardId, {$addToSet: {labelIds: labelId}}); + addToSet = { labelIds: labelId }; } + Cards.update(cardId, { $addToSet: addToSet }); } }); }); - } + }); } }).register('list'); |