boardHeader.js 13 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486
  1. import { TAPi18n } from '/imports/i18n';
  2. /*
  3. const DOWNCLS = 'fa-sort-down';
  4. const UPCLS = 'fa-sort-up';
  5. */
  6. const sortCardsBy = new ReactiveVar('');
  7. Template.boardMenuPopup.events({
  8. 'click .js-rename-board': Popup.open('boardChangeTitle'),
  9. 'click .js-custom-fields'() {
  10. Sidebar.setView('customFields');
  11. Popup.back();
  12. },
  13. 'click .js-open-archives'() {
  14. Sidebar.setView('archives');
  15. Popup.back();
  16. },
  17. 'click .js-change-board-color': Popup.open('boardChangeColor'),
  18. 'click .js-change-language': Popup.open('changeLanguage'),
  19. 'click .js-archive-board ': Popup.afterConfirm('archiveBoard', function() {
  20. const currentBoard = Boards.findOne(Session.get('currentBoard'));
  21. currentBoard.archive();
  22. // XXX We should have some kind of notification on top of the page to
  23. // confirm that the board was successfully archived.
  24. FlowRouter.go('home');
  25. }),
  26. 'click .js-delete-board': Popup.afterConfirm('deleteBoard', function() {
  27. const currentBoard = Boards.findOne(Session.get('currentBoard'));
  28. Popup.back();
  29. Boards.remove(currentBoard._id);
  30. FlowRouter.go('home');
  31. }),
  32. 'click .js-outgoing-webhooks': Popup.open('outgoingWebhooks'),
  33. 'click .js-import-board': Popup.open('chooseBoardSource'),
  34. 'click .js-subtask-settings': Popup.open('boardSubtaskSettings'),
  35. 'click .js-card-settings': Popup.open('boardCardSettings'),
  36. 'click .js-minicard-settings': Popup.open('boardMinicardSettings'),
  37. });
  38. Template.boardChangeTitlePopup.events({
  39. submit(event, templateInstance) {
  40. const newTitle = templateInstance
  41. .$('.js-board-name')
  42. .val()
  43. .trim();
  44. const newDesc = templateInstance
  45. .$('.js-board-desc')
  46. .val()
  47. .trim();
  48. if (newTitle) {
  49. this.rename(newTitle);
  50. this.setDescription(newDesc);
  51. Popup.back();
  52. }
  53. event.preventDefault();
  54. },
  55. });
  56. BlazeComponent.extendComponent({
  57. watchLevel() {
  58. const currentBoard = Boards.findOne(Session.get('currentBoard'));
  59. return currentBoard && currentBoard.getWatchLevel(Meteor.userId());
  60. },
  61. isStarred() {
  62. const boardId = Session.get('currentBoard');
  63. const user = Meteor.user();
  64. return user && user.hasStarred(boardId);
  65. },
  66. // Only show the star counter if the number of star is greater than 2
  67. showStarCounter() {
  68. const currentBoard = Boards.findOne(Session.get('currentBoard'));
  69. return currentBoard && currentBoard.stars >= 2;
  70. },
  71. /*
  72. showSort() {
  73. return Meteor.user().hasSortBy();
  74. },
  75. directionClass() {
  76. return this.currentDirection() === -1 ? DOWNCLS : UPCLS;
  77. },
  78. changeDirection() {
  79. const direction = 0 - this.currentDirection() === -1 ? '-' : '';
  80. Meteor.call('setListSortBy', direction + this.currentListSortBy());
  81. },
  82. currentDirection() {
  83. return Meteor.user().getListSortByDirection();
  84. },
  85. currentListSortBy() {
  86. return Meteor.user().getListSortBy();
  87. },
  88. listSortShortDesc() {
  89. return `list-label-short-${this.currentListSortBy()}`;
  90. },
  91. */
  92. events() {
  93. return [
  94. {
  95. 'click .js-edit-board-title': Popup.open('boardChangeTitle'),
  96. 'click .js-star-board'() {
  97. Meteor.user().toggleBoardStar(Session.get('currentBoard'));
  98. },
  99. 'click .js-open-board-menu': Popup.open('boardMenu'),
  100. 'click .js-change-visibility': Popup.open('boardChangeVisibility'),
  101. 'click .js-watch-board': Popup.open('boardChangeWatch'),
  102. 'click .js-open-archived-board'() {
  103. Modal.open('archivedBoards');
  104. },
  105. 'click .js-toggle-board-view': Popup.open('boardChangeView'),
  106. 'click .js-toggle-sidebar'() {
  107. Sidebar.toggle();
  108. },
  109. 'click .js-open-filter-view'() {
  110. Sidebar.setView('filter');
  111. },
  112. 'click .js-sort-cards': Popup.open('cardsSort'),
  113. /*
  114. 'click .js-open-sort-view'(evt) {
  115. const target = evt.target;
  116. if (target.tagName === 'I') {
  117. // click on the text, popup choices
  118. this.changeDirection();
  119. } else {
  120. // change the sort order
  121. Popup.open('listsort')(evt);
  122. }
  123. },
  124. */
  125. 'click .js-filter-reset'(event) {
  126. event.stopPropagation();
  127. Sidebar.setView();
  128. Filter.reset();
  129. },
  130. 'click .js-sort-reset'() {
  131. Session.set('sortBy', '');
  132. },
  133. 'click .js-open-search-view'() {
  134. Sidebar.setView('search');
  135. },
  136. 'click .js-multiselection-activate'() {
  137. const currentCard = Utils.getCurrentCardId();
  138. MultiSelection.activate();
  139. if (currentCard) {
  140. MultiSelection.add(currentCard);
  141. }
  142. },
  143. 'click .js-multiselection-reset'(event) {
  144. event.stopPropagation();
  145. MultiSelection.disable();
  146. },
  147. 'click .js-log-in'() {
  148. FlowRouter.go('atSignIn');
  149. },
  150. },
  151. ];
  152. },
  153. }).register('boardHeaderBar');
  154. Template.boardHeaderBar.helpers({
  155. canModifyBoard() {
  156. return (
  157. Meteor.user() &&
  158. Meteor.user().isBoardMember() &&
  159. !Meteor.user().isCommentOnly()
  160. );
  161. },
  162. boardView() {
  163. return Utils.boardView();
  164. },
  165. isSortActive() {
  166. return Session.get('sortBy') ? true : false;
  167. },
  168. });
  169. Template.boardChangeViewPopup.events({
  170. 'click .js-open-lists-view'() {
  171. Utils.setBoardView('board-view-lists');
  172. Popup.back();
  173. },
  174. 'click .js-open-swimlanes-view'() {
  175. Utils.setBoardView('board-view-swimlanes');
  176. Popup.back();
  177. },
  178. 'click .js-open-cal-view'() {
  179. Utils.setBoardView('board-view-cal');
  180. Popup.back();
  181. },
  182. });
  183. const CreateBoard = BlazeComponent.extendComponent({
  184. template() {
  185. return 'createBoard';
  186. },
  187. onCreated() {
  188. this.visibilityMenuIsOpen = new ReactiveVar(false);
  189. this.visibility = new ReactiveVar('private');
  190. this.boardId = new ReactiveVar('');
  191. Meteor.subscribe('tableVisibilityModeSettings');
  192. },
  193. notAllowPrivateVisibilityOnly(){
  194. return !TableVisibilityModeSettings.findOne('tableVisibilityMode-allowPrivateOnly').booleanValue;
  195. },
  196. visibilityCheck() {
  197. return this.currentData() === this.visibility.get();
  198. },
  199. setVisibility(visibility) {
  200. this.visibility.set(visibility);
  201. this.visibilityMenuIsOpen.set(false);
  202. },
  203. toggleVisibilityMenu() {
  204. this.visibilityMenuIsOpen.set(!this.visibilityMenuIsOpen.get());
  205. },
  206. toggleAddTemplateContainer() {
  207. $('#add-template-container').toggleClass('is-checked');
  208. },
  209. onSubmit(event) {
  210. event.preventDefault();
  211. const title = this.find('.js-new-board-title').value;
  212. const addTemplateContainer = $('#add-template-container.is-checked').length > 0;
  213. if (addTemplateContainer) {
  214. //const templateContainerId = Meteor.call('setCreateTemplateContainer');
  215. //Utils.goBoardId(templateContainerId);
  216. //alert('niinku template ' + Meteor.call('setCreateTemplateContainer'));
  217. this.boardId.set(
  218. Boards.insert({
  219. // title: TAPi18n.__('templates'),
  220. title: title,
  221. permission: 'private',
  222. type: 'template-container',
  223. }),
  224. );
  225. // Insert the card templates swimlane
  226. Swimlanes.insert({
  227. // title: TAPi18n.__('card-templates-swimlane'),
  228. title: 'Card Templates',
  229. boardId: this.boardId.get(),
  230. sort: 1,
  231. type: 'template-container',
  232. }),
  233. // Insert the list templates swimlane
  234. Swimlanes.insert(
  235. {
  236. // title: TAPi18n.__('list-templates-swimlane'),
  237. title: 'List Templates',
  238. boardId: this.boardId.get(),
  239. sort: 2,
  240. type: 'template-container',
  241. },
  242. );
  243. // Insert the board templates swimlane
  244. Swimlanes.insert(
  245. {
  246. //title: TAPi18n.__('board-templates-swimlane'),
  247. title: 'Board Templates',
  248. boardId: this.boardId.get(),
  249. sort: 3,
  250. type: 'template-container',
  251. },
  252. );
  253. Utils.goBoardId(this.boardId.get());
  254. } else {
  255. const visibility = this.visibility.get();
  256. this.boardId.set(
  257. Boards.insert({
  258. title,
  259. permission: visibility,
  260. }),
  261. );
  262. Swimlanes.insert({
  263. title: 'Default',
  264. boardId: this.boardId.get(),
  265. });
  266. Utils.goBoardId(this.boardId.get());
  267. }
  268. },
  269. events() {
  270. return [
  271. {
  272. 'click .js-select-visibility'() {
  273. this.setVisibility(this.currentData());
  274. },
  275. 'click .js-change-visibility': this.toggleVisibilityMenu,
  276. 'click .js-import': Popup.open('boardImportBoard'),
  277. submit: this.onSubmit,
  278. 'click .js-import-board': Popup.open('chooseBoardSource'),
  279. 'click .js-board-template': Popup.open('searchElement'),
  280. 'click .js-toggle-add-template-container': this.toggleAddTemplateContainer,
  281. },
  282. ];
  283. },
  284. }).register('createBoardPopup');
  285. (class HeaderBarCreateBoard extends CreateBoard {
  286. onSubmit(event) {
  287. super.onSubmit(event);
  288. // Immediately star boards crated with the headerbar popup.
  289. Meteor.user().toggleBoardStar(this.boardId.get());
  290. }
  291. }.register('headerBarCreateBoardPopup'));
  292. BlazeComponent.extendComponent({
  293. notAllowPrivateVisibilityOnly(){
  294. return !TableVisibilityModeSettings.findOne('tableVisibilityMode-allowPrivateOnly').booleanValue;
  295. },
  296. visibilityCheck() {
  297. const currentBoard = Boards.findOne(Session.get('currentBoard'));
  298. return this.currentData() === currentBoard.permission;
  299. },
  300. selectBoardVisibility() {
  301. const currentBoard = Boards.findOne(Session.get('currentBoard'));
  302. const visibility = this.currentData();
  303. currentBoard.setVisibility(visibility);
  304. Popup.back();
  305. },
  306. events() {
  307. return [
  308. {
  309. 'click .js-select-visibility': this.selectBoardVisibility,
  310. },
  311. ];
  312. },
  313. }).register('boardChangeVisibilityPopup');
  314. BlazeComponent.extendComponent({
  315. watchLevel() {
  316. const currentBoard = Boards.findOne(Session.get('currentBoard'));
  317. return currentBoard.getWatchLevel(Meteor.userId());
  318. },
  319. watchCheck() {
  320. return this.currentData() === this.watchLevel();
  321. },
  322. events() {
  323. return [
  324. {
  325. 'click .js-select-watch'() {
  326. const level = this.currentData();
  327. Meteor.call(
  328. 'watch',
  329. 'board',
  330. Session.get('currentBoard'),
  331. level,
  332. (err, ret) => {
  333. if (!err && ret) Popup.back();
  334. },
  335. );
  336. },
  337. },
  338. ];
  339. },
  340. }).register('boardChangeWatchPopup');
  341. /*
  342. BlazeComponent.extendComponent({
  343. onCreated() {
  344. //this.sortBy = new ReactiveVar();
  345. ////this.sortDirection = new ReactiveVar();
  346. //this.setSortBy();
  347. this.downClass = DOWNCLS;
  348. this.upClass = UPCLS;
  349. },
  350. allowedSortValues() {
  351. const types = [];
  352. const pushed = {};
  353. Meteor.user()
  354. .getListSortTypes()
  355. .forEach(type => {
  356. const key = type.replace(/^-/, '');
  357. if (pushed[key] === undefined) {
  358. types.push({
  359. name: key,
  360. label: `list-label-${key}`,
  361. shortLabel: `list-label-short-${key}`,
  362. });
  363. pushed[key] = 1;
  364. }
  365. });
  366. return types;
  367. },
  368. Direction() {
  369. return Meteor.user().getListSortByDirection() === -1
  370. ? this.downClass
  371. : this.upClass;
  372. },
  373. sortby() {
  374. return Meteor.user().getListSortBy();
  375. },
  376. setSortBy(type = null) {
  377. const user = Meteor.user();
  378. if (type === null) {
  379. type = user._getListSortBy();
  380. } else {
  381. let value = '';
  382. if (type.map) {
  383. // is an array
  384. value = (type[1] === -1 ? '-' : '') + type[0];
  385. }
  386. Meteor.call('setListSortBy', value);
  387. }
  388. //this.sortBy.set(type[0]);
  389. //this.sortDirection.set(type[1]);
  390. },
  391. events() {
  392. return [
  393. {
  394. 'click .js-sort-by'(evt) {
  395. evt.preventDefault();
  396. const target = evt.target;
  397. const sortby = target.getAttribute('name');
  398. const down = !!target.querySelector(`.${this.upClass}`);
  399. const direction = down ? -1 : 1;
  400. this.setSortBy([sortby, direction]);
  401. if (Utils.isMiniScreen) {
  402. Popup.back();
  403. }
  404. },
  405. },
  406. ];
  407. },
  408. }).register('listsortPopup');
  409. */
  410. BlazeComponent.extendComponent({
  411. events() {
  412. return [
  413. {
  414. 'click .js-sort-due'() {
  415. const sortBy = {
  416. dueAt: 1,
  417. };
  418. Session.set('sortBy', sortBy);
  419. sortCardsBy.set(TAPi18n.__('due-date'));
  420. Popup.back();
  421. },
  422. 'click .js-sort-title'() {
  423. const sortBy = {
  424. title: 1,
  425. };
  426. Session.set('sortBy', sortBy);
  427. sortCardsBy.set(TAPi18n.__('title'));
  428. Popup.back();
  429. },
  430. 'click .js-sort-created-asc'() {
  431. const sortBy = {
  432. createdAt: 1,
  433. };
  434. Session.set('sortBy', sortBy);
  435. sortCardsBy.set(TAPi18n.__('date-created-newest-first'));
  436. Popup.back();
  437. },
  438. 'click .js-sort-created-desc'() {
  439. const sortBy = {
  440. createdAt: -1,
  441. };
  442. Session.set('sortBy', sortBy);
  443. sortCardsBy.set(TAPi18n.__('date-created-oldest-first'));
  444. Popup.back();
  445. },
  446. },
  447. ];
  448. },
  449. }).register('cardsSortPopup');