custom.js.es6 6.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209
  1. export default {
  2. name: 'custom-routes',
  3. initialize() {
  4. if (window.location.pathname.indexOf('/w/') < 0) return;
  5. const Router = requirejs('wizard/router').default;
  6. const ApplicationRoute = requirejs('wizard/routes/application').default;
  7. const ajax = requirejs('wizard/lib/ajax').ajax;
  8. const StepModel = requirejs('wizard/models/step').default;
  9. const WizardStep = requirejs('wizard/components/wizard-step').default;
  10. const WizardField = requirejs('wizard/components/wizard-field').default;
  11. const getUrl = requirejs('discourse-common/lib/get-url').default;
  12. const FieldModel = requirejs('wizard/models/wizard-field').default;
  13. const autocomplete = requirejs('discourse/lib/autocomplete').default;
  14. const cook = requirejs('discourse/plugins/discourse-custom-wizard/wizard/lib/text-lite').cook;
  15. $.fn.autocomplete = autocomplete;
  16. // this is for discourse/lib/utilities.avatarImg;
  17. Discourse.getURLWithCDN = getUrl;
  18. Router.reopen({
  19. rootURL: getUrl('/w/')
  20. });
  21. Router.map(function() {
  22. this.route('custom', { path: '/:wizard_id' }, function() {
  23. this.route('steps');
  24. this.route('step', { path: '/steps/:step_id' });
  25. });
  26. });
  27. ApplicationRoute.reopen({
  28. redirect() {
  29. this.transitionTo('custom');
  30. },
  31. model() {}
  32. });
  33. WizardStep.reopen({
  34. classNameBindings: ['step.id'],
  35. animateInvalidFields() {
  36. Ember.run.scheduleOnce('afterRender', () => {
  37. $('.invalid input[type=text], .invalid textarea, .invalid input[type=checkbox]').wiggle(2, 100);
  38. });
  39. },
  40. ensureStartsAtTop: function() {
  41. window.scrollTo(0,0);
  42. }.observes('step.id'),
  43. showQuitButton: function() {
  44. const index = this.get('step.index');
  45. const required = this.get('wizard.required');
  46. return index === 0 && !required;
  47. }.property('step.index', 'wizard.required'),
  48. cookedDescription: function() {
  49. return cook(this.get('step.description'));
  50. }.property('step.description'),
  51. bannerImage: function() {
  52. const src = this.get('step.banner');
  53. if (!src) return;
  54. if (src.indexOf('/uploads/') > -1 || src.indexOf('/plugins/') > -1) {
  55. return getUrl(src);
  56. } else {
  57. return getUrl(`/images/wizard/${src}`);
  58. };
  59. }.property('step.banner'),
  60. handleMessage: function() {
  61. const message = this.get('step.message');
  62. this.sendAction('showMessage', message);
  63. }.observes('step.message'),
  64. advance() {
  65. this.set('saving', true);
  66. this.get('step').save()
  67. .then(response => {
  68. if (this.get('finalStep')) {
  69. this.get('wizard').finished(response);
  70. } else {
  71. this.sendAction('goNext', response);
  72. }
  73. })
  74. .catch(() => this.animateInvalidFields())
  75. .finally(() => this.set('saving', false));
  76. },
  77. actions: {
  78. quit() {
  79. this.get('wizard').skip();
  80. },
  81. done() {
  82. this.set('finalStep', true);
  83. this.send('nextStep');
  84. },
  85. showMessage(message) {
  86. this.sendAction('showMessage', message);
  87. }
  88. }
  89. });
  90. StepModel.reopen({
  91. save() {
  92. const wizardId = this.get('wizardId');
  93. const fields = {};
  94. this.get('fields').forEach(f => fields[f.id] = f.value);
  95. return ajax({
  96. url: `/w/${wizardId}/steps/${this.get('id')}`,
  97. type: 'PUT',
  98. data: { fields }
  99. }).catch(response => {
  100. if (response && response.responseJSON && response.responseJSON.errors) {
  101. let wizardErrors = [];
  102. response.responseJSON.errors.forEach(err => {
  103. if (err.field === wizardId) {
  104. wizardErrors.push(err.description);
  105. } else if (err.field) {
  106. this.fieldError(err.field, err.description);
  107. } else if (err) {
  108. wizardErrors.push(err);
  109. }
  110. });
  111. if (wizardErrors.length) {
  112. this.handleWizardError(wizardErrors.join('\n'));
  113. }
  114. throw response;
  115. }
  116. if (response && response.responseText) {
  117. const responseText = response.responseText;
  118. const start = responseText.indexOf('>') + 1;
  119. const end = responseText.indexOf('plugins');
  120. const message = responseText.substring(start, end);
  121. this.handleWizardError(message);
  122. throw message;
  123. }
  124. });
  125. },
  126. handleWizardError(message) {
  127. this.set('message', {
  128. state: 'error',
  129. text: message
  130. });
  131. Ember.run.later(() => this.set('message', null), 6000);
  132. }
  133. });
  134. WizardField.reopen({
  135. classNameBindings: ['field.id'],
  136. cookedDescription: function() {
  137. return cook(this.get('field.description'));
  138. }.property('field.description'),
  139. inputComponentName: function() {
  140. const type = this.get('field.type');
  141. const id = this.get('field.id');
  142. if (type === 'text-only') return false;
  143. return (type === 'component') ? Ember.String.dasherize(id) : `wizard-field-${type}`;
  144. }.property('field.type', 'field.id')
  145. });
  146. const StandardFields = ['text', 'textarea', 'dropdown', 'image', 'checkbox', 'user-selector', 'text-only', 'composer'];
  147. FieldModel.reopen({
  148. hasCustomCheck: false,
  149. customCheck() {
  150. return true;
  151. },
  152. check() {
  153. let valid = this.get('valid');
  154. if (!this.get('required')) {
  155. this.setValid(true);
  156. return true;
  157. }
  158. const hasCustomCheck = this.get('hasCustomCheck');
  159. if (hasCustomCheck) {
  160. valid = this.customCheck();
  161. } else {
  162. const val = this.get('value');
  163. const type = this.get('type');
  164. if (type === 'checkbox') {
  165. valid = val;
  166. } else if (StandardFields.indexOf(type) > -1) {
  167. valid = val && val.length > 0;
  168. }
  169. }
  170. this.setValid(valid);
  171. return valid;
  172. }
  173. });
  174. }
  175. };