summaryrefslogtreecommitdiffstats
path: root/client/components
diff options
context:
space:
mode:
authorXavier Priour <xavier.priour@bubblyware.com>2015-11-13 12:43:34 +0100
committerXavier Priour <xavier.priour@bubblyware.com>2015-11-13 12:43:34 +0100
commita7427b9ae4e790989c49408ffe14aea4976db305 (patch)
tree3b56c753ce05ba9a5253078e2792b2c485d2912e /client/components
parent3dc70b3ea4d49bccb10d4f2b3e317c794da91e37 (diff)
parentcb3bd86396e4d19e1f05fcb94e3527f81e70412e (diff)
downloadwekan-a7427b9ae4e790989c49408ffe14aea4976db305.tar.gz
wekan-a7427b9ae4e790989c49408ffe14aea4976db305.tar.bz2
wekan-a7427b9ae4e790989c49408ffe14aea4976db305.zip
merge with /devel
Diffstat (limited to 'client/components')
-rw-r--r--client/components/activities/activities.js4
-rw-r--r--client/components/activities/comments.js10
-rw-r--r--client/components/boards/boardBody.js17
-rw-r--r--client/components/cards/cardDetails.js8
-rw-r--r--client/components/forms/forms.styl9
-rw-r--r--client/components/lists/list.js2
-rw-r--r--client/components/lists/listBody.jade15
-rw-r--r--client/components/lists/listBody.js107
-rw-r--r--client/components/lists/listHeader.js6
-rw-r--r--client/components/main/editor.js8
-rw-r--r--client/components/sidebar/sidebar.js2
-rw-r--r--client/components/users/userHeader.js8
12 files changed, 159 insertions, 37 deletions
diff --git a/client/components/activities/activities.js b/client/components/activities/activities.js
index a491c2e8..64e9865d 100644
--- a/client/components/activities/activities.js
+++ b/client/components/activities/activities.js
@@ -101,9 +101,9 @@ BlazeComponent.extendComponent({
},
'submit .js-edit-comment'(evt) {
evt.preventDefault();
- const commentText = this.currentComponent().getValue();
+ const commentText = this.currentComponent().getValue().trim();
const commentId = Template.parentData().commentId;
- if ($.trim(commentText)) {
+ if (commentText) {
CardComments.update(commentId, {
$set: {
text: commentText,
diff --git a/client/components/activities/comments.js b/client/components/activities/comments.js
index 08401caa..18bf9ef0 100644
--- a/client/components/activities/comments.js
+++ b/client/components/activities/comments.js
@@ -24,11 +24,12 @@ BlazeComponent.extendComponent({
},
'submit .js-new-comment-form'(evt) {
const input = this.getInput();
- if ($.trim(input.val())) {
+ const text = input.val().trim();
+ if (text) {
CardComments.insert({
+ text,
boardId: this.currentData().boardId,
cardId: this.currentData()._id,
- text: input.val(),
});
resetCommentInput(input);
Tracker.flush();
@@ -72,8 +73,9 @@ EscapeActions.register('inlinedForm',
docId: Session.get('currentCard'),
};
const commentInput = $('.js-new-comment-input');
- if ($.trim(commentInput.val())) {
- UnsavedEdits.set(draftKey, commentInput.val());
+ const draft = commentInput.val().trim();
+ if (draft) {
+ UnsavedEdits.set(draftKey, draft);
} else {
UnsavedEdits.reset(draftKey);
}
diff --git a/client/components/boards/boardBody.js b/client/components/boards/boardBody.js
index 517e53ba..5a74e61b 100644
--- a/client/components/boards/boardBody.js
+++ b/client/components/boards/boardBody.js
@@ -34,7 +34,7 @@ BlazeComponent.extendComponent({
},
openNewListForm() {
- this.childrenComponents('addListForm')[0].open();
+ this.childComponents('addListForm')[0].open();
},
// XXX Flow components allow us to avoid creating these two setter methods by
@@ -45,7 +45,8 @@ BlazeComponent.extendComponent({
},
scrollLeft(position = 0) {
- this.$('.js-lists').animate({
+ const lists = this.$('.js-lists');
+ lists && lists.animate({
scrollLeft: position,
});
},
@@ -179,22 +180,24 @@ BlazeComponent.extendComponent({
// Proxy
open() {
- this.childrenComponents('inlinedForm')[0].open();
+ this.childComponents('inlinedForm')[0].open();
},
events() {
return [{
submit(evt) {
evt.preventDefault();
- const title = this.find('.list-name-input');
- if ($.trim(title.value)) {
+ const titleInput = this.find('.list-name-input');
+ const title = titleInput.value.trim();
+ if (title) {
Lists.insert({
- title: title.value,
+ title,
boardId: Session.get('currentBoard'),
sort: $('.list').length,
});
- title.value = '';
+ titleInput.value = '';
+ titleInput.focus();
}
},
}];
diff --git a/client/components/cards/cardDetails.js b/client/components/cards/cardDetails.js
index 2d2679ec..b4fdca52 100644
--- a/client/components/cards/cardDetails.js
+++ b/client/components/cards/cardDetails.js
@@ -13,7 +13,7 @@ BlazeComponent.extendComponent({
},
reachNextPeak() {
- const activitiesComponent = this.childrenComponents('activities')[0];
+ const activitiesComponent = this.childComponents('activities')[0];
activitiesComponent.loadNextPage();
},
@@ -75,8 +75,8 @@ BlazeComponent.extendComponent({
},
'submit .js-card-details-title'(evt) {
evt.preventDefault();
- const title = this.currentComponent().getValue();
- if ($.trim(title)) {
+ const title = this.currentComponent().getValue().trim();
+ if (title) {
this.data().setTitle(title);
}
},
@@ -106,7 +106,7 @@ BlazeComponent.extendComponent({
close(isReset = false) {
if (this.isOpen.get() && !isReset) {
- const draft = $.trim(this.getValue());
+ const draft = this.getValue().trim();
if (draft !== Cards.findOne(Session.get('currentCard')).description) {
UnsavedEdits.set(this._getUnsavedEditKey(), this.getValue());
}
diff --git a/client/components/forms/forms.styl b/client/components/forms/forms.styl
index 83d25370..9ae95140 100644
--- a/client/components/forms/forms.styl
+++ b/client/components/forms/forms.styl
@@ -617,8 +617,15 @@ button
margin-right: 5px
vertical-align: middle
+ .minicard-label
+ width: 11px
+ height: @width
+ border-radius: 2px
+ margin: 2px 7px -2px -2px
+ display: inline-block
+
&.active
background: #005377
- a
+ a, .quiet
color: white
diff --git a/client/components/lists/list.js b/client/components/lists/list.js
index 75e816b5..f5410ed0 100644
--- a/client/components/lists/list.js
+++ b/client/components/lists/list.js
@@ -7,7 +7,7 @@ BlazeComponent.extendComponent({
// Proxy
openForm(options) {
- this.childrenComponents('listBody')[0].openForm(options);
+ this.childComponents('listBody')[0].openForm(options);
},
onCreated() {
diff --git a/client/components/lists/listBody.jade b/client/components/lists/listBody.jade
index b0a374ea..e659b179 100644
--- a/client/components/lists/listBody.jade
+++ b/client/components/lists/listBody.jade
@@ -22,9 +22,20 @@ template(name="listBody")
template(name="addCardForm")
.minicard.minicard-composer.js-composer
- .minicard-detailss.clearfix
- textarea.minicard-composer-textarea.js-card-title(autofocus)
+ if getLabels
+ .minicard-labels
+ each getLabels
+ .minicard-label(class="card-label-{{color}}" title="{{name}}")
+ textarea.minicard-composer-textarea.js-card-title(autofocus)
+ if members.get
.minicard-members.js-minicard-composer-members
+ each members.get
+ +userAvatar(userId=this)
+
.add-controls.clearfix
button.primary.confirm(type="submit") {{_ 'add'}}
a.fa.fa-times-thin.js-close-inlined-form
+
+template(name="autocompleteLabelLine")
+ .minicard-label(class="card-label-{{colorName}}" title=labelName)
+ span(class="{{#if hasNoName}}quiet{{/if}}")= labelName
diff --git a/client/components/lists/listBody.js b/client/components/lists/listBody.js
index 88b31788..36b60d06 100644
--- a/client/components/lists/listBody.js
+++ b/client/components/lists/listBody.js
@@ -11,8 +11,8 @@ BlazeComponent.extendComponent({
options = options || {};
options.position = options.position || 'top';
- const forms = this.childrenComponents('inlinedForm');
- let form = _.find(forms, (component) => {
+ const forms = this.childComponents('inlinedForm');
+ let form = forms.find((component) => {
return component.data().position === options.position;
});
if (!form && forms.length > 0) {
@@ -26,8 +26,10 @@ BlazeComponent.extendComponent({
const firstCardDom = this.find('.js-minicard:first');
const lastCardDom = this.find('.js-minicard:last');
const textarea = $(evt.currentTarget).find('textarea');
- const title = textarea.val();
const position = this.currentData().position;
+ const title = textarea.val().trim();
+
+ const formComponent = this.childComponents('addCardForm')[0];
let sortIndex;
if (position === 'top') {
sortIndex = Utils.calculateIndex(null, firstCardDom).base;
@@ -35,9 +37,14 @@ BlazeComponent.extendComponent({
sortIndex = Utils.calculateIndex(lastCardDom, null).base;
}
- if ($.trim(title)) {
+ const members = formComponent.members.get();
+ const labelIds = formComponent.labels.get();
+
+ if (title) {
const _id = Cards.insert({
title,
+ members,
+ labelIds,
listId: this.data()._id,
boardId: this.data().board()._id,
sort: sortIndex,
@@ -53,6 +60,8 @@ BlazeComponent.extendComponent({
if (position === 'bottom') {
this.scrollToBottom();
}
+
+ formComponent.reset();
}
},
@@ -100,11 +109,39 @@ BlazeComponent.extendComponent({
},
}).register('listBody');
+function toggleValueInReactiveArray(reactiveValue, value) {
+ const array = reactiveValue.get();
+ const valueIndex = array.indexOf(value);
+ if (valueIndex === -1) {
+ array.push(value);
+ } else {
+ array.splice(valueIndex, 1);
+ }
+ reactiveValue.set(array);
+}
+
BlazeComponent.extendComponent({
template() {
return 'addCardForm';
},
+ onCreated() {
+ this.labels = new ReactiveVar([]);
+ this.members = new ReactiveVar([]);
+ },
+
+ reset() {
+ this.labels.set([]);
+ this.members.set([]);
+ },
+
+ getLabels() {
+ const currentBoardId = Session.get('currentBoard');
+ return Boards.findOne(currentBoardId).labels.filter((label) => {
+ return this.labels.get().indexOf(label._id) > -1;
+ });
+ },
+
pressKey(evt) {
// Pressing Enter should submit the card
if (evt.keyCode === 13) {
@@ -140,4 +177,66 @@ BlazeComponent.extendComponent({
keydown: this.pressKey,
}];
},
+
+ onRendered() {
+ const editor = this;
+ this.$('textarea').escapeableTextComplete([
+ // User mentions
+ {
+ match: /\B@(\w*)$/,
+ search(term, callback) {
+ const currentBoard = Boards.findOne(Session.get('currentBoard'));
+ callback($.map(currentBoard.members, (member) => {
+ const user = Users.findOne(member.userId);
+ return user.username.indexOf(term) === 0 ? user : null;
+ }));
+ },
+ template(user) {
+ return user.username;
+ },
+ replace(user) {
+ toggleValueInReactiveArray(editor.members, user._id);
+ return '';
+ },
+ index: 1,
+ },
+
+ // Labels
+ {
+ match: /\B#(\w*)$/,
+ search(term, callback) {
+ const currentBoard = Boards.findOne(Session.get('currentBoard'));
+ callback($.map(currentBoard.labels, (label) => {
+ if (label.name.indexOf(term) > -1 ||
+ label.color.indexOf(term) > -1) {
+ return label;
+ }
+ }));
+ },
+ template(label) {
+ return Blaze.toHTMLWithData(Template.autocompleteLabelLine, {
+ hasNoName: !Boolean(label.name),
+ colorName: label.color,
+ labelName: label.name || label.color,
+ });
+ },
+ replace(label) {
+ toggleValueInReactiveArray(editor.labels, label._id);
+ return '';
+ },
+ index: 1,
+ },
+ ], {
+ // When the autocomplete menu is shown we want both a press of both `Tab`
+ // or `Enter` to validation the auto-completion. We also need to stop the
+ // event propagation to prevent the card from submitting (on `Enter`) or
+ // going on the next column (on `Tab`).
+ onKeydown(evt, commands) {
+ if (evt.keyCode === 9 || evt.keyCode === 13) {
+ evt.stopPropagation();
+ return commands.KEY_ENTER;
+ }
+ },
+ });
+ },
}).register('addCardForm');
diff --git a/client/components/lists/listHeader.js b/client/components/lists/listHeader.js
index b5df2c81..d660508a 100644
--- a/client/components/lists/listHeader.js
+++ b/client/components/lists/listHeader.js
@@ -5,10 +5,10 @@ BlazeComponent.extendComponent({
editTitle(evt) {
evt.preventDefault();
- const newTitle = this.childrenComponents('inlinedForm')[0].getValue();
+ const newTitle = this.childComponents('inlinedForm')[0].getValue().trim();
const list = this.currentData();
- if ($.trim(newTitle)) {
- list.rename(newTitle);
+ if (newTitle) {
+ list.rename(newTitle.trim());
}
},
diff --git a/client/components/main/editor.js b/client/components/main/editor.js
index 168c85d0..82fce641 100644
--- a/client/components/main/editor.js
+++ b/client/components/main/editor.js
@@ -8,8 +8,8 @@ Template.editor.onRendered(() => {
{
match: /\B:([\-+\w]*)$/,
search(term, callback) {
- callback($.map(Emoji.values, (emoji) => {
- return emoji.indexOf(term) === 0 ? emoji : null;
+ callback(Emoji.values.map((emoji) => {
+ return emoji.includes(term) ? emoji : null;
}));
},
template(value) {
@@ -28,9 +28,9 @@ Template.editor.onRendered(() => {
match: /\B@(\w*)$/,
search(term, callback) {
const currentBoard = Boards.findOne(Session.get('currentBoard'));
- callback($.map(currentBoard.members, (member) => {
+ callback(currentBoard.members.map((member) => {
const username = Users.findOne(member.userId).username;
- return username.indexOf(term) === 0 ? username : null;
+ return username.includes(term) ? username : null;
}));
},
template(value) {
diff --git a/client/components/sidebar/sidebar.js b/client/components/sidebar/sidebar.js
index ccb9f2f5..ef071fe0 100644
--- a/client/components/sidebar/sidebar.js
+++ b/client/components/sidebar/sidebar.js
@@ -54,7 +54,7 @@ BlazeComponent.extendComponent({
},
reachNextPeak() {
- const activitiesComponent = this.childrenComponents('activities')[0];
+ const activitiesComponent = this.childComponents('activities')[0];
activitiesComponent.loadNextPage();
},
diff --git a/client/components/users/userHeader.js b/client/components/users/userHeader.js
index a7382769..a478da0c 100644
--- a/client/components/users/userHeader.js
+++ b/client/components/users/userHeader.js
@@ -18,9 +18,9 @@ Template.memberMenuPopup.events({
Template.editProfilePopup.events({
submit(evt, tpl) {
evt.preventDefault();
- const fullname = $.trim(tpl.find('.js-profile-fullname').value);
- const username = $.trim(tpl.find('.js-profile-username').value);
- const initials = $.trim(tpl.find('.js-profile-initials').value);
+ const fullname = tpl.find('.js-profile-fullname').value.trim();
+ const username = tpl.find('.js-profile-username').value.trim();
+ const initials = tpl.find('.js-profile-initials').value.trim();
Users.update(Meteor.userId(), {$set: {
'profile.fullname': fullname,
'profile.initials': initials,
@@ -41,7 +41,7 @@ Template.changePasswordPopup.onRendered(function() {
Template.changeLanguagePopup.helpers({
languages() {
- return TAPi18n.getLanguages().map((lang, tag) => {
+ return _.map(TAPi18n.getLanguages(), (lang, tag) => {
const name = lang.name;
return { tag, name };
});