sidebar.js 8.0 KB

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