Merge pull request #2146 from vikhyat/badge-system

Badge creation UI improvements

app/assets/javascripts/admin/controllers/admin_badges_controller.js

@@ -26,6 +26,14 @@ Discourse.AdminBadgesController = Ember.ArrayController.extend({
   **/
   canEditDescription: Em.computed.none('selectedItem.translatedDescription'),
 
+  /**
+    Disable saving if the currently selected item is being saved.
+
+    @property disableSave
+    @type {Boolean}
+  **/
+  disableSave: Em.computed.alias('selectedItem.saving'),
+
   actions: {
 
     /**
@@ -57,11 +65,9 @@ Discourse.AdminBadgesController = Ember.ArrayController.extend({
       @method save
     **/
     save: function() {
-      var badge = this.get('selectedItem');
+      if (!this.get('disableSave')) {
-      badge.set('disableSave', true);
+        this.get('selectedItem').save();
-      badge.save().then(function() {
+      }
-        badge.set('disableSave', false);
-      });
     },
 
     /**

app/assets/javascripts/admin/controllers/admin_controller.js

@@ -6,4 +6,8 @@
   @namespace Discourse
   @module Discourse
 **/
-Discourse.AdminController = Discourse.Controller.extend({});
+Discourse.AdminController = Discourse.Controller.extend({
+  showBadges: function() {
+    return this.get('currentUser.admin') && Discourse.SiteSettings.enable_badges;
+  }.property()
+});

app/assets/javascripts/admin/templates/admin.js.handlebars

@@ -14,6 +14,9 @@
           <li>{{#link-to 'adminSiteContents'}}{{i18n admin.site_content.title}}{{/link-to}}</li>
         {{/if}}
         <li>{{#link-to 'adminUsersList'}}{{i18n admin.users.title}}{{/link-to}}</li>
+        {{#if showBadges}}
+          <li>{{#link-to 'admin.badges'}}{{i18n admin.badges.title}}{{/link-to}}</li>
+        {{/if}}
         {{#if currentUser.admin}}
           <li>{{#link-to 'admin.groups'}}{{i18n admin.groups.title}}{{/link-to}}</li>
         {{/if}}
@@ -24,7 +27,6 @@
           <li>{{#link-to 'admin.customize'}}{{i18n admin.customize.title}}{{/link-to}}</li>
           <li>{{#link-to 'admin.api'}}{{i18n admin.api.title}}{{/link-to}}</li>
           <li>{{#link-to 'admin.backups'}}{{i18n admin.backups.title}}{{/link-to}}</li>
-          <li>{{#link-to 'admin.badges'}}{{i18n admin.badges.title}}{{/link-to}}</li>
         {{/if}}
       </ul>
 

app/assets/javascripts/admin/templates/badges.js.handlebars

@@ -8,7 +8,7 @@
         <a {{action selectBadge this}} {{bind-attr class="selected:active"}}>
           {{displayName}}
           {{#if newBadge}}
-          (*)
+            ({{i18n filters.new.lower_title}})
           {{/if}}
         </a>
       </li>
@@ -19,7 +19,7 @@
 
   {{#if selectedItem}}
   {{#with selectedItem}}
-  <div class='current-badge span12'>
+  <div class='current-badge span13'>
     <form class="form-horizontal">
       <div>
         <label for="name">{{i18n admin.badges.name}}</label>
@@ -51,7 +51,8 @@
       </div>
 
       <div class='buttons'>
-        <button {{action save}} {{bind-attr disabled=disableSave}} class='btn btn-primary'>{{i18n admin.badges.save}}</button>
+        <button {{action save}} {{bind-attr disabled=controller.disableSave}} class='btn btn-primary'>{{i18n admin.badges.save}}</button>
+        <span class='saving'>{{savingStatus}}</span>
         <a {{action destroy}} class='delete-link'>{{i18n admin.badges.delete}}</a>
       </div>
     </form>

app/assets/javascripts/discourse/models/badge.js

@@ -79,14 +79,19 @@ Discourse.Badge = Discourse.Model.extend({
     @returns {Promise} A promise that resolves to the updated `Discourse.Badge`
   **/
   save: function() {
+    this.set('savingStatus', I18n.t('saving'));
+    this.set('saving', true);
+
     var url = "/admin/badges",
         requestType = "POST",
         self = this;
+
     if (!this.get('newBadge')) {
       // We are updating an existing badge.
       url += "/" + this.get('id');
       requestType = "PUT";
     }
+
     return Discourse.ajax(url, {
       type: requestType,
       data: {
@@ -96,6 +101,8 @@ Discourse.Badge = Discourse.Model.extend({
       }
     }).then(function(json) {
       self.updateFromJson(json);
+      self.set('savingStatus', I18n.t('saved'));
+      self.set('saving', false);
       return self;
     });
   },

app/assets/stylesheets/common/admin/admin_base.scss

@@ -306,6 +306,25 @@ section.details {
       margin-left: 15px;
       margin-top: 5px;
     }
+
+    input, textarea, select {
+      width: 350px;
+    }
+
+    textarea {
+      height: 200px;
+    }
+  }
+
+  .buttons {
+    float: left;
+    width: 200px;
+    .saving {
+      padding: 5px 0 0 0;
+      margin-left: 10px;
+      width: 80px;
+      color: $secondary_text_color;
+    }
   }
 }