Merge pull request #779 from ZogStriP/flash-draft-status-for-new-users

flash draft status when requirements are not met for new users

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

@@ -459,6 +459,14 @@ Discourse.Composer = Discourse.Model.extend({
       });
   },
 
+  flashDraftStatusForNewUser: function() {
+    var $draftStatus = $('#draft-status');
+    if (Discourse.get('currentUser.trust_level') === 0) {
+      $draftStatus.toggleClass('flash', true);
+      setTimeout(function() { $draftStatus.removeClass('flash'); }, 250);
+    }
+  },
+
   updateDraftStatus: function() {
     var $title = $('#reply-title'),
         $reply = $('#wmd-input');
@@ -467,6 +475,7 @@ Discourse.Composer = Discourse.Model.extend({
     if ($title.is(':focus')) {
       var titleDiff = this.get('missingTitleCharacters');
       if (titleDiff > 0) {
+        this.flashDraftStatusForNewUser();
         return this.set('draftStatus', Em.String.i18n('composer.min_length.need_more_for_title', { n: titleDiff }));
       }
     // 'reply' is focused

app/assets/javascripts/discourse/templates/composer.js.handlebars

@@ -50,7 +50,7 @@
             </div>
             {{#if Discourse.currentUser}}
                <a href="#" {{action togglePreview target="controller"}} class='toggle-preview'>{{{content.toggleText}}}</a>
-               <div class='draft-status'></div>
+               <div id='draft-status'></div>
                {{#if view.loadingImage}}
                 <div id="image-uploading">
                   {{i18n image_selector.uploading_image}} {{view.uploadProgress}}% <a id="cancel-image-upload">{{i18n cancel}}</a>

app/assets/javascripts/discourse/views/composer_view.js

@@ -27,7 +27,7 @@ Discourse.ComposerView = Discourse.View.extend({
   }.property('content.composeState'),
 
   draftStatus: function() {
-    this.$('.draft-status').text(this.get('content.draftStatus') || "");
+    $('#draft-status').text(this.get('content.draftStatus') || "");
   }.observes('content.draftStatus'),
 
   // Disable fields when we're loading

app/assets/stylesheets/application/compose.css.scss

@@ -96,7 +96,7 @@
   .requirements-not-met {
     background-color: rgba(255, 0, 0, 0.12);
   }
-  .toggle-preview, .draft-status, #image-uploading {
+  .toggle-preview, #draft-status, #image-uploading {
     position: absolute;
     bottom: -31px;
     margin-top: 0px;
@@ -110,9 +110,12 @@
     font-size: 12px;
     color: darken($gray, 40);
   }
-  .draft-status {
+  #draft-status {
     right: 51%;
     color: lighten($black, 60);
+    &.flash {
+      color: lighten($red, 20);
+    }
   }
   @include transition(height 0.4s ease);
   width: 100%;

app/serializers/current_user_serializer.rb

@@ -10,7 +10,8 @@ class CurrentUserSerializer < BasicUserSerializer
              :reply_count,
              :topic_count,
              :enable_quoting,
-             :external_links_in_new_tab
+             :external_links_in_new_tab,
+             :trust_level
 
   # we probably want to move this into site, but that json is cached so hanging it off current user seems okish