fix #524: unified component state flags

misago/emberapp/app/components/forms/avatar-crop-form.js

@@ -4,8 +4,8 @@ export default Ember.Component.extend({
   classNames: 'avatar-crop',
   cropit: Ember.inject.service('cropit'),
 
-  isLoading: true,
-  isCropping: false,
+  isLoaded: false,
+  isBusy: false,
 
   secret: '',
   isNested: false,
@@ -43,7 +43,7 @@ export default Ember.Component.extend({
   loadLibrary: function() {
     var self = this;
     this.get('cropit').load().then(function() {
-      self.set('isLoading', false);
+      self.set('isLoaded', true);
 
       Ember.run.scheduleOnce('afterRender', function() {
         // initialise cropper
@@ -92,8 +92,8 @@ export default Ember.Component.extend({
 
   actions: {
     crop: function() {
-      if (this.get('isCropping')) { return; }
-      this.set('isCropping', true);
+      if (this.get('isBusy')) { return; }
+      this.set('isBusy', true);
 
       var opName = 'crop_org';
       if (this.get('isNested')) {
@@ -119,7 +119,6 @@ export default Ember.Component.extend({
         self.set('activeForm', 'select-avatar-type-form');
       }, function(jhXHR) {
         if (self.isDestroyed) { return; }
-        self.set('isCropping', false);
         if (jhXHR.status === 400) {
           self.toast.error(jhXHR.responseJSON.detail);
         } else {
@@ -127,6 +126,7 @@ export default Ember.Component.extend({
         }
       }).finally(function() {
         if (self.isDestroyed) { return; }
+        self.set('isBusy', false);
       });
     },
 

misago/emberapp/app/components/forms/avatar-gallery-form.js

@@ -4,6 +4,7 @@ export default Ember.Component.extend({
   classNames: 'avatar-galleries',
 
   isBusy: false,
+
   activeItem: null,
 
   apiUrl: function() {

misago/emberapp/app/components/forms/avatar-upload-form.js

@@ -5,9 +5,10 @@ import { endsWith } from 'misago/utils/strings';
 export default Ember.Component.extend({
   classNames: 'avatar-upload',
 
+  isBusy: false,
   allowUpload: true,
+
   selectedImage: null,
-  isUploading: false,
   progress: 0,
   uploadHash: null,
 
@@ -27,7 +28,7 @@ export default Ember.Component.extend({
   }.on('willDestroyElement'),
 
   uploadImage: function(image) {
-    if (this.isDestroyed || this.get('isUploading')) { return; }
+    if (this.isDestroyed || this.get('isBusy')) { return; }
     this.set('allowUpload', false);
 
     // validate file
@@ -64,7 +65,7 @@ export default Ember.Component.extend({
     // begin upload!
     this.setProperties({
       'selectedImage': image,
-      'isUploading': true,
+      'isBusy': true,
       'progress': 0
     });
 
@@ -108,7 +109,7 @@ export default Ember.Component.extend({
       }
     }).finally(function() {
       if (self.isDestroyed) { return; }
-      self.set('isUploading', false);
+      self.set('isBusy', false);
     });
   },
 

misago/emberapp/app/components/forms/change-username-form.js

@@ -5,8 +5,8 @@ export default Ember.Component.extend({
   classNames: 'form-horizontal',
 
   isLoaded: false,
-  isErrored: false,
-  isSaving: false,
+  loadError: null,
+  isBusy: false,
 
   options: null,
   username: '',
@@ -32,11 +32,11 @@ export default Ember.Component.extend({
     }, function(jqXHR) {
       if (self.isDestroyed) { return; }
       if (typeof jqXHR.responseJSON !== 'undefined') {
-        self.set('isErrored', jqXHR.responseJSON);
+        self.set('loadError', jqXHR.responseJSON);
       } else if (jqXHR.status === 0) {
-        self.set('isErrored', {'detail': gettext('Lost connection with application.')});
+        self.set('loadError', {'detail': gettext('Lost connection with application.')});
       } else {
-        self.set('isErrored', {'detail': gettext('Application has errored.')});
+        self.set('loadError', {'detail': gettext('Application has errored.')});
       }
     });
   }.on('init'),
@@ -75,7 +75,7 @@ export default Ember.Component.extend({
   }.observes('username'),
 
   submit: function() {
-    if (this.get('isLoading')) {
+    if (this.get('isBusy')) {
       return false;
     }
 
@@ -93,7 +93,7 @@ export default Ember.Component.extend({
       return false;
     }
 
-    this.set('isSaving', true);
+    this.set('isBusy', true);
 
     var self = this;
     this.ajax.post(this.get('apiUrl'), data
@@ -105,7 +105,7 @@ export default Ember.Component.extend({
       self.error(jqXHR);
     }).finally(function() {
       if (self.isDestroyed) { return; }
-      self.set('isSaving', false);
+      self.set('isBusy', false);
     });
 
     return false;

misago/emberapp/app/components/forms/edit-signature-form.js

@@ -4,8 +4,8 @@ export default Ember.Component.extend({
   tagName: 'form',
 
   isLoaded: false,
-  isSaving: false,
-  isErrored: false,
+  loadError: false,
+  isBusy: false,
 
   options: null,
   signature: '',
@@ -27,17 +27,17 @@ export default Ember.Component.extend({
     }, function(jqXHR) {
       if (self.isDestroyed) { return; }
       if (typeof jqXHR.responseJSON !== 'undefined') {
-        self.set('isErrored', jqXHR.responseJSON);
+        self.set('loadError', jqXHR.responseJSON);
       } else if (jqXHR.status === 0) {
-        self.set('isErrored', {'detail': gettext('Lost connection with application.')});
+        self.set('loadError', {'detail': gettext('Lost connection with application.')});
       } else {
-        self.set('isErrored', {'detail': gettext('Application has errored.')});
+        self.set('loadError', {'detail': gettext('Application has errored.')});
       }
     });
   }.on('init'),
 
   submit: function() {
-    if (this.get('isSaving')) {
+    if (this.get('isBusy')) {
       return false;
     }
 
@@ -46,7 +46,7 @@ export default Ember.Component.extend({
       return false;
     }
 
-    this.set('isSaving', true);
+    this.set('isBusy', true);
 
     var self = this;
     this.ajax.post(this.get('apiUrl'), {'signature': this.get('signature')}
@@ -58,7 +58,7 @@ export default Ember.Component.extend({
       self.error(jqXHR);
     }).finally(function() {
       if (self.isDestroyed) { return; }
-      self.set('isSaving', false);
+      self.set('isBusy', false);
     });
 
     return false;

misago/emberapp/app/components/forms/forum-options-form.js

@@ -4,7 +4,7 @@ export default Ember.Component.extend({
   tagName: 'form',
   classNames: 'form-horizontal',
 
-  isSaving: false,
+  isBusy: false,
 
   subscribeToChoices: [
     {value: 0, label: gettext('No')},
@@ -58,7 +58,7 @@ export default Ember.Component.extend({
   }.property(),
 
   submit: function() {
-    if (this.get('isSaving')) {
+    if (this.get('isBusy')) {
       return false;
     }
 
@@ -69,7 +69,7 @@ export default Ember.Component.extend({
       subscribe_to_replied_threads: this.get('subscribe_to_replied_threads')
     };
 
-    this.set('isSaving', true);
+    this.set('isBusy', true);
 
     var self = this;
     this.ajax.post(this.get('apiUrl'), newOptions
@@ -81,7 +81,7 @@ export default Ember.Component.extend({
       self.error(jqXHR);
     }).finally(function() {
       if (self.isDestroyed) { return; }
-      self.set('isSaving', false);
+      self.set('isBusy', false);
     });
 
     return false;

misago/emberapp/app/components/forms/login-form.js

@@ -3,7 +3,8 @@ import Ember from 'ember';
 export default Ember.Component.extend({
   tagName: 'form',
 
-  isLoading: false,
+  isBusy: false,
+
   showActivation: false,
 
   username: '',
@@ -14,7 +15,7 @@ export default Ember.Component.extend({
   }.property(),
 
   submit: function() {
-    if (this.get('isLoading')) {
+    if (this.get('isBusy')) {
       return false;
     }
 
@@ -38,7 +39,7 @@ export default Ember.Component.extend({
       self.error(jqXHR);
     }).finally(function() {
       if (self.isDestroyed) { return; }
-      self.set('isLoading', false);
+      self.set('isBusy', false);
     });
 
     return false;

misago/emberapp/app/components/forms/register-form.js

@@ -6,9 +6,9 @@ export default Ember.Component.extend({
 
   zxcvbn: Ember.inject.service('zxcvbn'),
 
-  isReady: false,
-  isErrored: false,
-  isLoading: false,
+  isLoaded: false,
+  loadError: null,
+  isBusy: false,
 
   username: '',
   email: '',
@@ -69,16 +69,16 @@ export default Ember.Component.extend({
       if (self.isDestroyed) { return; }
 
       if (array[0].state === 'rejected') {
-        self.set('isErrored', true);
+        self.set('loadError', true);
         console.log('zxcvbn service failed to load.');
       }
 
       if (array[1].state === 'rejected') {
-        self.set('isErrored', true);
+        self.set('loadError', true);
         console.log('captcha service failed to load.');
       }
 
-      self.set('isReady', !self.get('isErrored'));
+      self.set('isLoaded', !self.get('loadError'));
       self.get('captcha').reset();
     });
   }.on('didInsertElement'),
@@ -160,7 +160,7 @@ export default Ember.Component.extend({
   }.observes('captcha.value'),
 
   submit: function() {
-    if (this.get('isLoading')) {
+    if (this.get('isBusy')) {
       return false;
     }
 
@@ -182,7 +182,7 @@ export default Ember.Component.extend({
       return false;
     }
 
-    this.set('isLoading', true);
+    this.set('isBusy', true);
 
     var self = this;
     this.ajax.post('users', data
@@ -194,7 +194,7 @@ export default Ember.Component.extend({
       self.error(jqXHR);
     }).finally(function() {
       if (self.isDestroyed) { return; }
-      self.set('isLoading', false);
+      self.set('isBusy', false);
     });
 
     return false;

misago/emberapp/app/components/forms/request-link-form.js

@@ -3,7 +3,8 @@ import Ember from 'ember';
 export default Ember.Component.extend({
   tagName: 'form',
 
-  isLoading: false,
+  isBusy: false,
+
   email: '',
 
   router: function() {
@@ -11,18 +12,18 @@ export default Ember.Component.extend({
   }.property(),
 
   submit: function() {
-    if (this.get('isLoading')) {
+    if (this.get('isBusy')) {
       return false;
     }
 
     var email = Ember.$.trim(this.get('email'));
 
-    if (email === "") {
+    if (email.length === 0) {
       this.toast.warning(gettext("Enter e-mail address."));
       return false;
     }
 
-    this.set('isLoading', true);
+    this.set('isBusy', true);
 
     var self = this;
     this.ajax.post(this.get('url'), {
@@ -35,7 +36,7 @@ export default Ember.Component.extend({
       self.error(jqXHR);
     }).finally(function() {
       if (self.isDestroyed) { return; }
-      self.set('isLoading', false);
+      self.set('isBusy', false);
     });
 
     return false;

misago/emberapp/app/components/forms/set-new-password-form.js

@@ -3,7 +3,8 @@ import Ember from 'ember';
 export default Ember.Component.extend({
   tagName: 'form',
 
-  isLoading: false,
+  isBusy: false,
+
   password: '',
 
   router: function() {
@@ -15,7 +16,7 @@ export default Ember.Component.extend({
   }.property('model'),
 
   submit: function() {
-    if (this.get('isLoading')) { return false; }
+    if (this.get('isBusy')) { return false; }
 
     var password = Ember.$.trim(this.get('password'));
 
@@ -24,7 +25,7 @@ export default Ember.Component.extend({
       return false;
     }
 
-    this.set('isLoading', true);
+    this.set('isBusy', true);
 
     var self = this;
     this.ajax.post(this.get('url'), {
@@ -36,7 +37,7 @@ export default Ember.Component.extend({
       if (self.isDestroyed) { return; }
       self.error(jqXHR);
     }).finally(function() {
-      self.set('isLoading', false);
+      self.set('isBusy', false);
     });
 
     return false;

misago/emberapp/app/components/modals/change-avatar-modal.js

@@ -3,8 +3,10 @@ import ModalComponent from 'misago/mixins/modal-component';
 
 export default Ember.Component.extend(ModalComponent, {
   className: 'modal-change-avatar',
+
   isLoaded: false,
-  error: false,
+  loadError: false,
+
   options: null,
 
   loadOptions: function() {
@@ -17,11 +19,11 @@ export default Ember.Component.extend(ModalComponent, {
     }, function(jqXHR) {
       if (self.isDestroyed) { return; }
       if (typeof jqXHR.responseJSON !== 'undefined') {
-        self.set('error', jqXHR.responseJSON);
+        self.set('loadError', jqXHR.responseJSON);
       } else if (jqXHR.status === 0) {
-        self.set('error', {detail: gettext('Lost connection with application.')});
+        self.set('loadError', {detail: gettext('Lost connection with application.')});
       } else {
-        self.set('error', {detail: gettext('Application has errored.')});
+        self.set('loadError', {detail: gettext('Application has errored.')});
       }
     });
   }.on('didInsertElement'),

misago/emberapp/app/templates/components/forms/avatar-crop-form.hbs

@@ -1,6 +1,4 @@
-{{#if isLoading}}
-<div class="loader"></div>
-{{else}}
+{{#if isLoaded}}
 <div class="image-cropper">
   <div class="cropit-image-preview"></div>
   <input type="range" class="cropit-image-zoom-input" />
@@ -9,22 +7,26 @@
 <div class="row">
   <div class="col-md-6 col-md-offset-3">
 
-    <button type="button" class="btn btn-primary btn-block {{if isCropping "disabled"}}" {{if isCropping "disabled"}} {{action "crop"}}>
-      {{#if isCropping}}
+    {{#if isBusy}}
+      <button type="button" class="btn btn-primary btn-block disabled" disabled="disabled">
         {{gettext "Cropping..."}}
+      </button>
+    {{else}}
+      <button type="button" class="btn btn-primary btn-block" {{action "crop"}}>
+      {{#if isNested}}
+        {{gettext "Set avatar"}}
       {{else}}
-        {{#if isNested}}
-          {{gettext "Set avatar"}}
-        {{else}}
-          {{gettext "Crop image"}}
-        {{/if}}
+        {{gettext "Crop image"}}
       {{/if}}
-    </button>
+      </button>
+    {{/if}}
 
-    <button type="button" class="btn btn-default btn-outlined btn-block {{if isCropping "disabled"}}" {{if isCropping "disabled"}} {{action "cancel"}}>
+    <button type="button" class="btn btn-default btn-outlined btn-block {{if isBusy "disabled"}}" {{if isBusy "disabled"}} {{action "cancel"}}>
       {{gettext "Cancel"}}
     </button>
 
   </div>
 </div>
+{{else}}
+<div class="loader"></div>
 {{/if}}

misago/emberapp/app/templates/components/forms/avatar-gallery-form.hbs

@@ -18,12 +18,14 @@
 {{/each}}
 <div class="row">
   <div class="col-md-6 col-md-offset-3">
-    <button type="button" class="btn btn-default btn-outlined btn-block {{if isBusy "disabled"}}" {{if isBusy "disabled"}} {{action "cancel"}}>
-      {{#if isBusy}}
+    {{#if isBusy}}
+      <button type="button" class="btn btn-default btn-outlined btn-block disabled" disabled="disabled">
         {{gettext "Setting avatar..."}}
-      {{else}}
+      </button>
+    {{else}}
+      <button type="button" class="btn btn-default btn-outlined btn-block" {{action "cancel"}}>
         {{gettext "Cancel"}}
-      {{/if}}
-    </button>
+      </button>
+    {{/if}}
   </div>
 </div>

misago/emberapp/app/templates/components/forms/avatar-upload-form.hbs

@@ -4,7 +4,7 @@
 
 <input class="file-upload" type="file">
 
-{{#if isUploading}}
+{{#if isBusy}}
 <div class="uploading-file">
   <img src="" alt="">
 
@@ -24,16 +24,22 @@
 
     {{#if allowUpload}}
     <div class="upload-file">
-      <button type="button" class="btn btn-primary btn-block {{if isUploading "disabled"}}" {{if isUploading "disabled"}} {{action "selectFile"}}>
-        {{gettext "Select file"}}
-      </button>
+      {{#if isBusy}}
+        <button type="button" class="btn btn-primary btn-block disabled" disabled="disabled">
+          {{gettext "Uploading..."}}
+        </button>
+      {{else}}
+        <button type="button" class="btn btn-primary btn-block" {{if isBusy "disabled"}} {{action "selectFile"}}>
+          {{gettext "Select file"}}
+        </button>
+      {{/if}}
       <p class="text-muted">
         {{gettext "%(files)s files smaller than %(limit)s" files=extensions limit=(file-size options.upload.limit)}}
       </p>
     </div>
     {{/if}}
 
-    <button type="button" class="btn btn-default btn-outlined btn-block {{if isUploading "disabled"}}" {{if isUploading "disabled"}} {{action "cancel"}}>
+    <button type="button" class="btn btn-default btn-outlined btn-block {{if isBusy "disabled"}}" {{if isBusy "disabled"}} {{action "cancel"}}>
       {{gettext "Cancel"}}
     </button>
 

misago/emberapp/app/templates/components/forms/change-username-form.hbs

@@ -22,9 +22,8 @@
       <div class="row">
         <div class="col-md-8 col-md-offset-4">
 
-          {{#if isSaving}}
-          <button type="button" class="btn btn-primary btn-block-sm" disabled="disabled">
-            <span class="fa fa-cog fa-spin"></span>
+          {{#if isBusy}}
+          <button type="button" class="btn btn-primary btn-block-sm disabled" disabled="disabled">
             {{gettext "Changing..."}}
           </button>
           {{else}}
@@ -42,7 +41,7 @@
       {{/if}}
     </div>
     {{/if}}
-  {{else if isErrored}}
+  {{else if loadError}}
   <div class="panel-error">
 
     <div class="error-icon">
@@ -50,7 +49,7 @@
     </div>
 
     <div class="error-message">
-      <p>{{isErrored.detail}}</p>
+      <p>{{loadError.detail}}</p>
     </div>
 
   </div>

misago/emberapp/app/templates/components/forms/edit-signature-form.hbs

@@ -6,8 +6,8 @@
   <div class="panel-body">
     {{misago-editor value=signature inputHeight=60 toolbar=false limit=options.limit}}
 
-    {{#if isSaving}}
-    <button type="button" class="btn btn-primary btn-block-sm" disabled="disabled">
+    {{#if isBusy}}
+    <button type="button" class="btn btn-primary btn-block-sm disabled" disabled="disabled">
       <span class="fa fa-cog fa-spin"></span>
       {{gettext "Saving changes..."}}
     </button>
@@ -24,7 +24,7 @@
     </div>
     {{/if}}
   </div>
-  {{else if isErrored}}
+  {{else if loadError}}
   <div class="panel-error">
 
     <div class="error-icon">
@@ -32,11 +32,11 @@
     </div>
 
     <div class="error-message">
-      {{#if isErrored.reason}}
-      <p class="lead">{{isErrored.detail}}</p>
-      {{{isErrored.reason}}}
+      {{#if loadError.reason}}
+      <p class="lead">{{loadError.detail}}</p>
+      {{{loadError.reason}}}
       {{else}}
-      <p>{{isErrored.detail}}</p>
+      <p>{{loadError.detail}}</p>
       {{/if}}
     </div>
 

misago/emberapp/app/templates/components/forms/forum-options-form.hbs

@@ -76,9 +76,8 @@
     <div class="row">
       <div class="col-md-7 col-md-offset-5">
 
-        {{#if isSaving}}
-        <button type="button" class="btn btn-primary btn-block-sm" disabled="disabled">
-          <span class="fa fa-cog fa-spin"></span>
+        {{#if isBusy}}
+        <button type="button" class="btn btn-primary btn-block-sm disabled" disabled="disabled">
           {{gettext "Saving changes..."}}
         </button>
         {{else}}

misago/emberapp/app/templates/components/forms/login-form.hbs

@@ -15,13 +15,12 @@
 </div>
 <div class="modal-footer">
   {{#if showActivation}}
-  {{#close-modal-button class="btn btn-block btn-success" goto="forgotten-password"}}
-    {{gettext "Activate account"}}
-  {{/close-modal-button}}
+    {{#close-modal-button class="btn btn-block btn-success" goto="forgotten-password"}}
+      {{gettext "Activate account"}}
+    {{/close-modal-button}}
   {{else}}
-    {{#if isLoading}}
-    <button type="button" class="btn btn-block btn-primary" disabled="disabled">
-      <span class="fa fa-cog fa-spin"></span>
+    {{#if isBusy}}
+    <button type="button" class="btn btn-block btn-primary disabled" disabled="disabled">
       {{gettext "Singing in..."}}
     </button>
     {{else}}

misago/emberapp/app/templates/components/forms/register-form.hbs

@@ -1,4 +1,4 @@
-{{#if isReady}}
+{{#if isLoaded}}
 <div class="modal-body">
 
   {{#form-row label=(gettext "Username:") for="id_username" label-class="col-md-4" control-class="col-md-8" validation=validation.username}}
@@ -35,9 +35,8 @@
 <div class="modal-footer">
   <div class="text-center">
 
-    {{#if isLoading}}
-    <button type="button" class="btn btn-primary" disabled="disabled">
-      <span class="fa fa-cog fa-spin"></span>
+    {{#if isBusy}}
+    <button type="button" class="btn btn-primary disabled" disabled="disabled">
       {{gettext "Registering..."}}
     </button>
     {{else}}
@@ -59,7 +58,7 @@
 
   </div>
 </div>
-{{else if isErrored}}
+{{else if loadError}}
 <div class="modal-body modal-message">
 
   <p class="lead">

misago/emberapp/app/templates/components/forms/request-link-form.hbs

@@ -4,9 +4,8 @@
   </div>
 </div>
 
-{{#if isLoading}}
-<button type="button" class="btn btn-block btn-primary" disabled="disabled">
-  <span class="fa fa-cog fa-spin"></span>
+{{#if isBusy}}
+<button type="button" class="btn btn-block btn-primary disabled" disabled="disabled">
   {{gettext "Sending request..."}}
 </button>
 {{else}}

misago/emberapp/app/templates/components/forms/set-new-password-form.hbs

@@ -4,9 +4,8 @@
   </div>
 </div>
 
-{{#if isLoading}}
-<button type="button" class="btn btn-block btn-primary" disabled="disabled">
-  <span class="fa fa-cog fa-spin"></span>
+{{#if isBusy}}
+<button type="button" class="btn btn-block btn-primary disabled" disabled="disabled">
   {{gettext "Sending request..."}}
 </button>
 {{else}}

misago/emberapp/app/templates/components/modals/change-avatar-modal.hbs

@@ -7,7 +7,7 @@
   <div class="modal-body">
     {{component activeForm options=options activeForm=activeForm}}
   </div>
-  {{else if error}}
+  {{else if loadError}}
   <div class="modal-body modal-message">
 
     <div class="message-icon">
@@ -15,11 +15,11 @@
     </div>
 
     <p class="lead">
-      {{error.detail}}
+      {{loadError.detail}}
     </p>
 
-    {{#if error.reason}}
-      {{{error.reason}}}
+    {{#if loadError.reason}}
+      {{{loadError.reason}}}
     {{/if}}
 
   </div>