mirror of
https://github.com/wekan/wekan.git
synced 2025-12-15 23:10:13 +01:00
We now replace native scrollbar by custom ones on the list card (which is required by the new ergonomics in the parent commit), but the "scrolling engine", is still native, we just hide the scrollbar and draw our own in HTML/CSS using the perfect-scrollbar package (from bower). This commit also implements component scrolling when certain actions are performed, eg scroll to the bottom when the new card composer is opened.
111 lines
3.3 KiB
JavaScript
111 lines
3.3 KiB
JavaScript
BlazeComponent.extendComponent({
|
|
template: function() {
|
|
return 'cardDetails';
|
|
},
|
|
|
|
mixins: function() {
|
|
return [Mixins.InfiniteScrolling];
|
|
},
|
|
|
|
calculateNextPeak: function() {
|
|
var altitude = this.find('.js-card-detail').scrollHeight;
|
|
this.callFirstWith(this, 'setNextPeak', altitude);
|
|
},
|
|
|
|
reachNextPeak: function() {
|
|
var activitiesComponent = this.componentChildren('activities')[0];
|
|
activitiesComponent.loadNextPage();
|
|
},
|
|
|
|
onRendered: function() {
|
|
var bodyBoardComponent = this.componentParent();
|
|
var additionalMargin = 550;
|
|
var $cardDetails = this.$(this.firstNode());
|
|
var scollLeft = $cardDetails.offset().left + additionalMargin;
|
|
bodyBoardComponent.scrollLeft(scollLeft);
|
|
},
|
|
|
|
events: function() {
|
|
return [{
|
|
'click .js-move-card': Popup.open('moveCard'),
|
|
'submit .js-card-description': function(evt) {
|
|
evt.preventDefault();
|
|
var cardId = Session.get('currentCard');
|
|
var form = this.componentChildren('inlinedForm')[0];
|
|
var newDescription = form.getValue();
|
|
Cards.update(cardId, {
|
|
$set: {
|
|
description: newDescription
|
|
}
|
|
});
|
|
form.close();
|
|
},
|
|
'click .js-close-card-detail': function() {
|
|
Utils.goBoardId(Session.get('currentBoard'));
|
|
},
|
|
'click .editable .js-card-title': function(event, t) {
|
|
var editable = t.$('.card-detail-title');
|
|
|
|
// add class editing and focus
|
|
$('.editing').removeClass('editing');
|
|
editable.addClass('editing');
|
|
editable.find('#title').focus();
|
|
},
|
|
'click .js-edit-desc': function(event, t) {
|
|
var editable = t.$('.card-detail-item');
|
|
|
|
// editing remove based and add current editing.
|
|
$('.editing').removeClass('editing');
|
|
editable.addClass('editing');
|
|
editable.find('#desc').focus();
|
|
|
|
event.preventDefault();
|
|
},
|
|
'click .js-cancel-edit': function() {
|
|
// remove editing hide.
|
|
$('.editing').removeClass('editing');
|
|
},
|
|
'submit #WindowTitleEdit': function(event, t) {
|
|
var title = t.find('#title').value;
|
|
if ($.trim(title)) {
|
|
Cards.update(this.card._id, {
|
|
$set: {
|
|
title: title
|
|
}
|
|
}, function(err) {
|
|
if (! err) $('.editing').removeClass('editing');
|
|
});
|
|
}
|
|
|
|
event.preventDefault();
|
|
},
|
|
'submit #WindowDescEdit': function(event, t) {
|
|
Cards.update(this.card._id, {
|
|
$set: {
|
|
description: t.find('#desc').value
|
|
}
|
|
}, function(err) {
|
|
if (! err) $('.editing').removeClass('editing');
|
|
});
|
|
event.preventDefault();
|
|
},
|
|
'click .member': Popup.open('cardMember'),
|
|
'click .js-details-edit-members': Popup.open('cardMembers'),
|
|
'click .js-details-edit-labels': Popup.open('cardLabels')
|
|
}];
|
|
}
|
|
}).register('cardDetails');
|
|
|
|
Template.moveCardPopup.events({
|
|
'click .js-select-list': function() {
|
|
// XXX We should *not* get the currentCard from the global state, but
|
|
// instead from a “component” state.
|
|
var cardId = Session.get('currentCard');
|
|
var newListId = this._id;
|
|
Cards.update(cardId, {
|
|
$set: {
|
|
listId: newListId
|
|
}
|
|
});
|
|
}
|
|
});
|