mirror of
https://github.com/wekan/wekan.git
synced 2026-01-06 17:48:49 +01:00
Fix the board component data loading
This commit is contained in:
parent
d5eec54c72
commit
2248671b7c
3 changed files with 98 additions and 88 deletions
|
|
@ -1,4 +1,4 @@
|
|||
var boardSubsManager = new SubsManager();
|
||||
var subManager = new SubsManager();
|
||||
|
||||
BlazeComponent.extendComponent({
|
||||
template: function() {
|
||||
|
|
@ -6,12 +6,19 @@ BlazeComponent.extendComponent({
|
|||
},
|
||||
|
||||
onCreated: function() {
|
||||
this.draggingActive = new ReactiveVar(false);
|
||||
this.showOverlay = new ReactiveVar(false);
|
||||
var self = this;
|
||||
self.draggingActive = new ReactiveVar(false);
|
||||
self.showOverlay = new ReactiveVar(false);
|
||||
self.isBoardReady = new ReactiveVar(false);
|
||||
|
||||
// The pattern we use to manually handle data loading is described here:
|
||||
// https://kadira.io/academy/meteor-routing-guide/content/subscriptions-and-data-management/using-subs-manager
|
||||
// XXX The boardId should be readed from some sort the component "props",
|
||||
// unfortunatly, Blaze doesn't have this notion.
|
||||
boardSubsManager.subscribe('board', Session.get('currentBoard'));
|
||||
self.autorun(function() {
|
||||
var handle = subManager.subscribe('board', Session.get('currentBoard'));
|
||||
self.isBoardReady.set(handle.ready());
|
||||
});
|
||||
},
|
||||
|
||||
openNewListForm: function() {
|
||||
|
|
@ -47,72 +54,6 @@ BlazeComponent.extendComponent({
|
|||
return currentCard && currentCard.listId === listId;
|
||||
},
|
||||
|
||||
onRendered: function() {
|
||||
var self = this;
|
||||
|
||||
self.scrollLeft();
|
||||
|
||||
var lists = this.find('.js-lists');
|
||||
|
||||
// We want to animate the card details window closing. We rely on CSS
|
||||
// transition for the actual animation.
|
||||
lists._uihooks = {
|
||||
removeElement: function(node) {
|
||||
var removeNode = _.once(function() {
|
||||
node.parentNode.removeChild(node);
|
||||
});
|
||||
if ($(node).hasClass('js-card-details')) {
|
||||
$(node).css({
|
||||
flexBasis: 0,
|
||||
padding: 0
|
||||
});
|
||||
$(lists).one(CSSEvents.transitionend, removeNode);
|
||||
} else {
|
||||
removeNode();
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
if (! Meteor.user() || ! Meteor.user().isBoardMember())
|
||||
return;
|
||||
|
||||
self.$(lists).sortable({
|
||||
tolerance: 'pointer',
|
||||
helper: 'clone',
|
||||
items: '.js-list:not(.js-list-composer)',
|
||||
placeholder: 'list placeholder',
|
||||
distance: 7,
|
||||
start: function(evt, ui) {
|
||||
ui.placeholder.height(ui.helper.height());
|
||||
Popup.close();
|
||||
},
|
||||
stop: function() {
|
||||
self.$('.js-lists').find('.js-list:not(.js-list-composer)').each(
|
||||
function(i, list) {
|
||||
var data = Blaze.getData(list);
|
||||
Lists.update(data._id, {
|
||||
$set: {
|
||||
sort: i
|
||||
}
|
||||
});
|
||||
}
|
||||
);
|
||||
}
|
||||
});
|
||||
|
||||
// Disable drag-dropping while in multi-selection mode
|
||||
self.autorun(function() {
|
||||
self.$(lists).sortable('option', 'disabled', MultiSelection.isActive());
|
||||
});
|
||||
|
||||
// If there is no data in the board (ie, no lists) we autofocus the list
|
||||
// creation form by clicking on the corresponding element.
|
||||
var currentBoard = Boards.findOne(Session.get('currentBoard'));
|
||||
if (currentBoard.lists().count() === 0) {
|
||||
this.openNewListForm();
|
||||
}
|
||||
},
|
||||
|
||||
sidebarSize: function() {
|
||||
var sidebar = this.componentChildren('sidebar')[0];
|
||||
if (sidebar && sidebar.isOpen())
|
||||
|
|
@ -130,6 +71,72 @@ BlazeComponent.extendComponent({
|
|||
}
|
||||
}).register('board');
|
||||
|
||||
Template.boardBody.onRendered(function() {
|
||||
var self = BlazeComponent.getComponentForElement(this.firstNode);
|
||||
|
||||
self.scrollLeft();
|
||||
|
||||
var lists = this.find('.js-lists');
|
||||
|
||||
// We want to animate the card details window closing. We rely on CSS
|
||||
// transition for the actual animation.
|
||||
lists._uihooks = {
|
||||
removeElement: function(node) {
|
||||
var removeNode = _.once(function() {
|
||||
node.parentNode.removeChild(node);
|
||||
});
|
||||
if ($(node).hasClass('js-card-details')) {
|
||||
$(node).css({
|
||||
flexBasis: 0,
|
||||
padding: 0
|
||||
});
|
||||
$(lists).one(CSSEvents.transitionend, removeNode);
|
||||
} else {
|
||||
removeNode();
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
if (! Meteor.user() || ! Meteor.user().isBoardMember())
|
||||
return;
|
||||
|
||||
self.$(lists).sortable({
|
||||
tolerance: 'pointer',
|
||||
helper: 'clone',
|
||||
items: '.js-list:not(.js-list-composer)',
|
||||
placeholder: 'list placeholder',
|
||||
distance: 7,
|
||||
start: function(evt, ui) {
|
||||
ui.placeholder.height(ui.helper.height());
|
||||
Popup.close();
|
||||
},
|
||||
stop: function() {
|
||||
self.$('.js-lists').find('.js-list:not(.js-list-composer)').each(
|
||||
function(i, list) {
|
||||
var data = Blaze.getData(list);
|
||||
Lists.update(data._id, {
|
||||
$set: {
|
||||
sort: i
|
||||
}
|
||||
});
|
||||
}
|
||||
);
|
||||
}
|
||||
});
|
||||
|
||||
// Disable drag-dropping while in multi-selection mode
|
||||
self.autorun(function() {
|
||||
self.$(lists).sortable('option', 'disabled', MultiSelection.isActive());
|
||||
});
|
||||
|
||||
// If there is no data in the board (ie, no lists) we autofocus the list
|
||||
// creation form by clicking on the corresponding element.
|
||||
var currentBoard = Boards.findOne(Session.get('currentBoard'));
|
||||
if (currentBoard.lists().count() === 0) {
|
||||
self.openNewListForm();
|
||||
}
|
||||
});
|
||||
|
||||
BlazeComponent.extendComponent({
|
||||
template: function() {
|
||||
return 'addListForm';
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue