Andreas/wekan
1
0
Fork 0
mirror of https://github.com/wekan/wekan.git synced 2025-12-17 07:50:12 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions 5

UI improvements

Browse source 
* 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.
This commit is contained in:
Maxime Quandalle 2015-05-27 17:17:00 +02:00
parent 42f6dc686f
commit dcc64f44f9
51 changed files with 644 additions and 990 deletions
Download patch file Download diff file Expand all files Collapse all files

87
client/components/lists/main.js
View file

@ -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');