sidebar.js 9.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365
  1. Sidebar = null;
  2. const defaultView = 'home';
  3. const viewTitles = {
  4. filter: 'filter-cards',
  5. search: 'search-cards',
  6. multiselection: 'multi-selection',
  7. customFields: 'custom-fields',
  8. archives: 'archives',
  9. };
  10. BlazeComponent.extendComponent({
  11. mixins() {
  12. return [Mixins.InfiniteScrolling, Mixins.PerfectScrollbar];
  13. },
  14. onCreated() {
  15. this._isOpen = new ReactiveVar(false);
  16. this._view = new ReactiveVar(defaultView);
  17. Sidebar = this;
  18. },
  19. onDestroyed() {
  20. Sidebar = null;
  21. },
  22. isOpen() {
  23. return this._isOpen.get();
  24. },
  25. open() {
  26. if (!this._isOpen.get()) {
  27. this._isOpen.set(true);
  28. EscapeActions.executeUpTo('detailsPane');
  29. }
  30. },
  31. hide() {
  32. if (this._isOpen.get()) {
  33. this._isOpen.set(false);
  34. }
  35. },
  36. toggle() {
  37. this._isOpen.set(!this._isOpen.get());
  38. },
  39. calculateNextPeak() {
  40. const altitude = this.find('.js-board-sidebar-content').scrollHeight;
  41. this.callFirstWith(this, 'setNextPeak', altitude);
  42. },
  43. reachNextPeak() {
  44. const activitiesComponent = this.childComponents('activities')[0];
  45. activitiesComponent.loadNextPage();
  46. },
  47. isTongueHidden() {
  48. return this.isOpen() && this.getView() !== defaultView;
  49. },
  50. scrollTop() {
  51. this.$('.js-board-sidebar-content').scrollTop(0);
  52. },
  53. getView() {
  54. return this._view.get();
  55. },
  56. setView(view) {
  57. view = _.isString(view) ? view : defaultView;
  58. if (this._view.get() !== view) {
  59. this._view.set(view);
  60. this.scrollTop();
  61. EscapeActions.executeUpTo('detailsPane');
  62. }
  63. this.open();
  64. },
  65. isDefaultView() {
  66. return this.getView() === defaultView;
  67. },
  68. getViewTemplate() {
  69. return `${this.getView()}Sidebar`;
  70. },
  71. getViewTitle() {
  72. return TAPi18n.__(viewTitles[this.getView()]);
  73. },
  74. showTongueTitle() {
  75. if (this.isOpen())
  76. return `${TAPi18n.__('sidebar-close')}`;
  77. else
  78. return `${TAPi18n.__('sidebar-open')}`;
  79. },
  80. events() {
  81. return [{
  82. 'click .js-hide-sidebar': this.hide,
  83. 'click .js-toggle-sidebar': this.toggle,
  84. 'click .js-back-home': this.setView,
  85. 'click .js-shortcuts'() {
  86. FlowRouter.go('shortcuts');
  87. },
  88. }];
  89. },
  90. }).register('sidebar');
  91. Blaze.registerHelper('Sidebar', () => Sidebar);
  92. EscapeActions.register('sidebarView',
  93. () => { Sidebar.setView(defaultView); },
  94. () => { return Sidebar && Sidebar.getView() !== defaultView; }
  95. );
  96. Template.memberPopup.helpers({
  97. user() {
  98. return Users.findOne(this.userId);
  99. },
  100. memberType() {
  101. const type = Users.findOne(this.userId).isBoardAdmin() ? 'admin' : 'normal';
  102. if(type === 'normal'){
  103. const currentBoard = Boards.findOne(Session.get('currentBoard'));
  104. const commentOnly = currentBoard.hasCommentOnly(this.userId);
  105. const noComments = currentBoard.hasNoComments(this.userId);
  106. if(commentOnly){
  107. return TAPi18n.__('comment-only').toLowerCase();
  108. } else if(noComments) {
  109. return TAPi18n.__('no-comments').toLowerCase();
  110. } else {
  111. return TAPi18n.__(type).toLowerCase();
  112. }
  113. } else {
  114. return TAPi18n.__(type).toLowerCase();
  115. }
  116. },
  117. isInvited() {
  118. return Users.findOne(this.userId).isInvitedTo(Session.get('currentBoard'));
  119. },
  120. });
  121. Template.memberPopup.events({
  122. 'click .js-filter-member'() {
  123. Filter.members.toggle(this.userId);
  124. Popup.close();
  125. },
  126. 'click .js-change-role': Popup.open('changePermissions'),
  127. 'click .js-remove-member': Popup.afterConfirm('removeMember', function() {
  128. const boardId = Session.get('currentBoard');
  129. const memberId = this.userId;
  130. Cards.find({ boardId, members: memberId }).forEach((card) => {
  131. card.unassignMember(memberId);
  132. });
  133. Boards.findOne(boardId).removeMember(memberId);
  134. Popup.close();
  135. }),
  136. 'click .js-leave-member': Popup.afterConfirm('leaveBoard', () => {
  137. const boardId = Session.get('currentBoard');
  138. Meteor.call('quitBoard', boardId, () => {
  139. Popup.close();
  140. FlowRouter.go('home');
  141. });
  142. }),
  143. });
  144. Template.removeMemberPopup.helpers({
  145. user() {
  146. return Users.findOne(this.userId);
  147. },
  148. board() {
  149. return Boards.findOne(Session.get('currentBoard'));
  150. },
  151. });
  152. Template.leaveBoardPopup.helpers({
  153. board() {
  154. return Boards.findOne(Session.get('currentBoard'));
  155. },
  156. });
  157. Template.membersWidget.helpers({
  158. isInvited() {
  159. const user = Meteor.user();
  160. return user && user.isInvitedTo(Session.get('currentBoard'));
  161. },
  162. });
  163. Template.membersWidget.events({
  164. 'click .js-member': Popup.open('member'),
  165. 'click .js-manage-board-members': Popup.open('addMember'),
  166. 'click .sandstorm-powerbox-request-identity'() {
  167. window.sandstormRequestIdentity();
  168. },
  169. 'click .js-member-invite-accept'() {
  170. const boardId = Session.get('currentBoard');
  171. Meteor.user().removeInvite(boardId);
  172. },
  173. 'click .js-member-invite-decline'() {
  174. const boardId = Session.get('currentBoard');
  175. Meteor.call('quitBoard', boardId, (err, ret) => {
  176. if (!err && ret) {
  177. Meteor.user().removeInvite(boardId);
  178. FlowRouter.go('home');
  179. }
  180. });
  181. },
  182. });
  183. Template.labelsWidget.events({
  184. 'click .js-label': Popup.open('editLabel'),
  185. 'click .js-add-label': Popup.open('createLabel'),
  186. });
  187. // Board members can assign people or labels by drag-dropping elements from the
  188. // sidebar to the cards on the board. In order to re-initialize the jquery-ui
  189. // plugin any time a draggable member or label is modified or removed we use a
  190. // autorun function and register a dependency on the both members and labels
  191. // fields of the current board document.
  192. function draggableMembersLabelsWidgets() {
  193. this.autorun(() => {
  194. const currentBoardId = Tracker.nonreactive(() => {
  195. return Session.get('currentBoard');
  196. });
  197. Boards.findOne(currentBoardId, {
  198. fields: {
  199. members: 1,
  200. labels: 1,
  201. },
  202. });
  203. Tracker.afterFlush(() => {
  204. const $draggables = this.$('.js-member,.js-label');
  205. $draggables.draggable({
  206. appendTo: 'body',
  207. helper: 'clone',
  208. revert: 'invalid',
  209. revertDuration: 150,
  210. snap: false,
  211. snapMode: 'both',
  212. start() {
  213. EscapeActions.executeUpTo('popup-back');
  214. },
  215. });
  216. function userIsMember() {
  217. return Meteor.user() && Meteor.user().isBoardMember();
  218. }
  219. this.autorun(() => {
  220. $draggables.draggable('option', 'disabled', !userIsMember());
  221. });
  222. });
  223. });
  224. }
  225. Template.membersWidget.onRendered(draggableMembersLabelsWidgets);
  226. Template.labelsWidget.onRendered(draggableMembersLabelsWidgets);
  227. BlazeComponent.extendComponent({
  228. onCreated() {
  229. this.error = new ReactiveVar('');
  230. this.loading = new ReactiveVar(false);
  231. },
  232. onRendered() {
  233. this.find('.js-search-member input').focus();
  234. this.setLoading(false);
  235. },
  236. isBoardMember() {
  237. const userId = this.currentData()._id;
  238. const user = Users.findOne(userId);
  239. return user && user.isBoardMember();
  240. },
  241. isValidEmail(email) {
  242. return SimpleSchema.RegEx.Email.test(email);
  243. },
  244. setError(error) {
  245. this.error.set(error);
  246. },
  247. setLoading(w) {
  248. this.loading.set(w);
  249. },
  250. isLoading() {
  251. return this.loading.get();
  252. },
  253. inviteUser(idNameEmail) {
  254. const boardId = Session.get('currentBoard');
  255. this.setLoading(true);
  256. const self = this;
  257. Meteor.call('inviteUserToBoard', idNameEmail, boardId, (err, ret) => {
  258. self.setLoading(false);
  259. if (err) self.setError(err.error);
  260. else if (ret.email) self.setError('email-sent');
  261. else Popup.close();
  262. });
  263. },
  264. events() {
  265. return [{
  266. 'keyup input'() {
  267. this.setError('');
  268. },
  269. 'click .js-select-member'() {
  270. const userId = this.currentData()._id;
  271. const currentBoard = Boards.findOne(Session.get('currentBoard'));
  272. if (!currentBoard.hasMember(userId)) {
  273. this.inviteUser(userId);
  274. }
  275. },
  276. 'click .js-email-invite'() {
  277. const idNameEmail = $('.js-search-member input').val();
  278. if (idNameEmail.indexOf('@')<0 || this.isValidEmail(idNameEmail)) {
  279. this.inviteUser(idNameEmail);
  280. } else this.setError('email-invalid');
  281. },
  282. }];
  283. },
  284. }).register('addMemberPopup');
  285. Template.changePermissionsPopup.events({
  286. 'click .js-set-admin, click .js-set-normal, click .js-set-no-comments, click .js-set-comment-only'(event) {
  287. const currentBoard = Boards.findOne(Session.get('currentBoard'));
  288. const memberId = this.userId;
  289. const isAdmin = $(event.currentTarget).hasClass('js-set-admin');
  290. const isCommentOnly = $(event.currentTarget).hasClass('js-set-comment-only');
  291. const isNoComments = $(event.currentTarget).hasClass('js-set-no-comments');
  292. currentBoard.setMemberPermission(memberId, isAdmin, isNoComments, isCommentOnly);
  293. Popup.back(1);
  294. },
  295. });
  296. Template.changePermissionsPopup.helpers({
  297. isAdmin() {
  298. const currentBoard = Boards.findOne(Session.get('currentBoard'));
  299. return currentBoard.hasAdmin(this.userId);
  300. },
  301. isNormal() {
  302. const currentBoard = Boards.findOne(Session.get('currentBoard'));
  303. return !currentBoard.hasAdmin(this.userId) && !currentBoard.hasNoComments(this.userId) && !currentBoard.hasCommentOnly(this.userId);
  304. },
  305. isNoComments() {
  306. const currentBoard = Boards.findOne(Session.get('currentBoard'));
  307. return !currentBoard.hasAdmin(this.userId) && currentBoard.hasNoComments(this.userId);
  308. },
  309. isCommentOnly() {
  310. const currentBoard = Boards.findOne(Session.get('currentBoard'));
  311. return !currentBoard.hasAdmin(this.userId) && currentBoard.hasCommentOnly(this.userId);
  312. },
  313. isLastAdmin() {
  314. const currentBoard = Boards.findOne(Session.get('currentBoard'));
  315. return currentBoard.hasAdmin(this.userId) && (currentBoard.activeAdmins() === 1);
  316. },
  317. });