cardCustomFields.js 4.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211
  1. Template.cardCustomFieldsPopup.helpers({
  2. hasCustomField() {
  3. const card = Cards.findOne(Session.get('currentCard'));
  4. const customFieldId = this._id;
  5. return card.customFieldIndex(customFieldId) > -1;
  6. },
  7. });
  8. Template.cardCustomFieldsPopup.events({
  9. 'click .js-select-field'(event) {
  10. const card = Cards.findOne(Session.get('currentCard'));
  11. const customFieldId = this._id;
  12. card.toggleCustomField(customFieldId);
  13. event.preventDefault();
  14. },
  15. 'click .js-settings'(event) {
  16. EscapeActions.executeUpTo('detailsPane');
  17. Sidebar.setView('customFields');
  18. event.preventDefault();
  19. },
  20. });
  21. // cardCustomField
  22. const CardCustomField = BlazeComponent.extendComponent({
  23. getTemplate() {
  24. return `cardCustomField-${this.data().definition.type}`;
  25. },
  26. onCreated() {
  27. const self = this;
  28. self.card = Cards.findOne(Session.get('currentCard'));
  29. self.customFieldId = this.data()._id;
  30. },
  31. canModifyCard() {
  32. return (
  33. Meteor.user() &&
  34. Meteor.user().isBoardMember() &&
  35. !Meteor.user().isCommentOnly()
  36. );
  37. },
  38. });
  39. CardCustomField.register('cardCustomField');
  40. // cardCustomField-text
  41. (class extends CardCustomField {
  42. onCreated() {
  43. super.onCreated();
  44. }
  45. events() {
  46. return [
  47. {
  48. 'submit .js-card-customfield-text'(event) {
  49. event.preventDefault();
  50. const value = this.currentComponent().getValue();
  51. this.card.setCustomField(this.customFieldId, value);
  52. },
  53. },
  54. ];
  55. }
  56. }.register('cardCustomField-text'));
  57. // cardCustomField-number
  58. (class extends CardCustomField {
  59. onCreated() {
  60. super.onCreated();
  61. }
  62. events() {
  63. return [
  64. {
  65. 'submit .js-card-customfield-number'(event) {
  66. event.preventDefault();
  67. const value = parseInt(this.find('input').value, 10);
  68. this.card.setCustomField(this.customFieldId, value);
  69. },
  70. },
  71. ];
  72. }
  73. }.register('cardCustomField-number'));
  74. // cardCustomField-currency
  75. (class extends CardCustomField {
  76. onCreated() {
  77. super.onCreated();
  78. this.currencySymbol = this.data().definition.settings.currencySymbol;
  79. }
  80. formattedValue() {
  81. return `${this.currencySymbol}${this.data().value}`;
  82. }
  83. events() {
  84. return [
  85. {
  86. 'submit .js-card-customfield-currency'(event) {
  87. event.preventDefault();
  88. const value = Number(this.find('input').value, 10);
  89. this.card.setCustomField(this.customFieldId, value);
  90. },
  91. },
  92. ];
  93. }
  94. }.register('cardCustomField-currency'));
  95. // cardCustomField-date
  96. (class extends CardCustomField {
  97. onCreated() {
  98. super.onCreated();
  99. const self = this;
  100. self.date = ReactiveVar();
  101. self.now = ReactiveVar(moment());
  102. window.setInterval(() => {
  103. self.now.set(moment());
  104. }, 60000);
  105. self.autorun(() => {
  106. self.date.set(moment(self.data().value));
  107. });
  108. }
  109. showDate() {
  110. // this will start working once mquandalle:moment
  111. // is updated to at least moment.js 2.10.5
  112. // until then, the date is displayed in the "L" format
  113. return this.date.get().calendar(null, {
  114. sameElse: 'llll',
  115. });
  116. }
  117. showISODate() {
  118. return this.date.get().toISOString();
  119. }
  120. classes() {
  121. if (
  122. this.date.get().isBefore(this.now.get(), 'minute') &&
  123. this.now.get().isBefore(this.data().value)
  124. ) {
  125. return 'current';
  126. }
  127. return '';
  128. }
  129. showTitle() {
  130. return `${TAPi18n.__('card-start-on')} ${this.date.get().format('LLLL')}`;
  131. }
  132. events() {
  133. return [
  134. {
  135. 'click .js-edit-date': Popup.open('cardCustomField-date'),
  136. },
  137. ];
  138. }
  139. }.register('cardCustomField-date'));
  140. // cardCustomField-datePopup
  141. (class extends DatePicker {
  142. onCreated() {
  143. super.onCreated();
  144. const self = this;
  145. self.card = Cards.findOne(Session.get('currentCard'));
  146. self.customFieldId = this.data()._id;
  147. this.data().value && this.date.set(moment(this.data().value));
  148. }
  149. _storeDate(date) {
  150. this.card.setCustomField(this.customFieldId, date);
  151. }
  152. _deleteDate() {
  153. this.card.setCustomField(this.customFieldId, '');
  154. }
  155. }.register('cardCustomField-datePopup'));
  156. // cardCustomField-dropdown
  157. (class extends CardCustomField {
  158. onCreated() {
  159. super.onCreated();
  160. this._items = this.data().definition.settings.dropdownItems;
  161. this.items = this._items.slice(0);
  162. this.items.unshift({
  163. _id: '',
  164. name: TAPi18n.__('custom-field-dropdown-none'),
  165. });
  166. }
  167. selectedItem() {
  168. const selected = this._items.find(item => {
  169. return item._id === this.data().value;
  170. });
  171. return selected
  172. ? selected.name
  173. : TAPi18n.__('custom-field-dropdown-unknown');
  174. }
  175. events() {
  176. return [
  177. {
  178. 'submit .js-card-customfield-dropdown'(event) {
  179. event.preventDefault();
  180. const value = this.find('select').value;
  181. this.card.setCustomField(this.customFieldId, value);
  182. },
  183. },
  184. ];
  185. }
  186. }.register('cardCustomField-dropdown'));