hackvan · hackvan · Oct 10, 2017 · Oct 10, 2017 · Oct 10, 2017
diff --git a/app/assets/stylesheets/comments.scss b/app/assets/stylesheets/comments.scss
@@ -53,7 +53,6 @@ a.comment-user {
 }
 
 .comment-form>form textarea {
-    width: 470px;
     resize: vertical;
     box-shadow: 0 1px 2px rgba(12, 13, 14, 0.1) inset;
     padding: 8px 10px;
@@ -67,21 +66,11 @@ a.comment-user {
 .comment-form > form input {
     margin-left: 10px;
     margin-top: 1px;
-    /* display: block; */
-    /* cursor: pointer; */
-    /* color: #FFF; */
     background-color: #0095ff;
     border-color: #07c;
-    /* box-shadow: inset 0 1px 0 #66bfff; */
     padding: .61538462em 1em;
     min-height: 2.46153846em;
-    /* box-sizing: border-box; */
-    /* font-weight: 400; */
     line-height: 1;
-    /* text-align: center; */
-    /* text-decoration: none; */
-    /* border-radius: 2px; */
-    /* border: 1px solid transparent; */
 }
 .comment-form > form input:hover {
   background-color: #337ab7;
@@ -95,3 +84,8 @@ a.comment-user {
   margin-right: 20px;
   font-size: 12px;
 }
+
+.form-error {
+  margin-right: 20px;
+  font-size: 12px;
+}
diff --git a/app/controllers/answers/comments_controller.rb b/app/controllers/answers/comments_controller.rb
@@ -3,7 +3,10 @@ class Answers::CommentsController < CommentsController
 
   def create
     super
-    redirect_to url_for(@commentable.question)
+    respond_to do |format|
+      format.html { redirect_to url_for(@commentable.question) }
+      format.js
+    end
   end
 
   private

diff --git a/app/controllers/comments_controller.rb b/app/controllers/comments_controller.rb
@@ -7,11 +7,7 @@ def new
 
   def create
     @comment = @commentable.comments.new(comment_params)
-    if @comment.save
-      flash[:success] = 'El comentario ha sido registrado con éxito.'
-    else
-      flash[:danger] = 'El comentario no puede estar en blanco.'
-    end
+    @comment.save
   end
 
   private

diff --git a/app/controllers/questions/comments_controller.rb b/app/controllers/questions/comments_controller.rb
@@ -3,7 +3,10 @@ class Questions::CommentsController < CommentsController
 
   def create
     super
-    redirect_to @commentable
+    respond_to do |format|
+      format.html { redirect_to @commentable }
+      format.js
+    end
   end
 
   private

diff --git a/app/views/answers/_answer.html.erb b/app/views/answers/_answer.html.erb
@@ -57,7 +57,7 @@
           <div class="comments">
             <table>
               <tbody>
-                <%= render 'comments/comment', commentable: answer %>
+                <%= render answer.comments %>
               </tbody>
               <tfoot>
                 <tr>

diff --git a/app/views/comments/_comment.html.erb b/app/views/comments/_comment.html.erb
@@ -1,12 +1,10 @@
-<% commentable.comments.each do |comment| %>
-  <tr class="comment">
-    <td class="comment-actions">
-    </td>
-    <td class="comment-text">
-      <span><%= comment.body %></span>
-      –
-      <%= mail_to comment.user.email, nil, class: "comment-user" %>
-      <span class="comment-date"><%= time_ago_in_words comment.created_at %></span>
-    </td>
-  </tr>
-<% end %>
+<tr class="comment">
+  <td class="comment-actions">
+  </td>
+  <td class="comment-text">
+    <span><%= comment.body %></span>
+    –
+    <%= mail_to comment.user.email, nil, class: "comment-user" %>
+    <span class="comment-date"><%= time_ago_in_words comment.created_at %></span>
+  </td>
+</tr>
diff --git a/app/views/comments/_form.html.erb b/app/views/comments/_form.html.erb
@@ -1,23 +1,23 @@
-<%# commentable = local_assigns[:commentable] %>
-<%= form_with model: [commentable, Comment.new], url: url_path, local: true do |form| %>
+<%= form_with model: [commentable, commentable.comments.new], url: url_path do |form| %>
   <table>
     <tbody>
       <tr>
         <td>
-          <% if commentable.is_a? Question %>
-            <%= form.text_area :body, class: "form-control", cols: "68", rows: "2", placeholder: "Use los comentarios para solicitar mas información o sugerir mejoras. Evite responder las preguntas en los comentarios." %>
-          <% else %>
-            <%= form.text_area :body, class: "form-control", cols: "68", rows: "2", placeholder: 'Use los comentarios para solicitar mas información o sugerir mejoras. Evite comentarios como "+1" o "gracias".' %>
-          <% end %>
+          <div id="comment-text">
+            <% if commentable.is_a? Question %>
+              <%= form.text_area :body, class: "form-control", cols: "68", rows: "2", placeholder: "Use los comentarios para solicitar mas información o sugerir mejoras. Evite responder las preguntas en los comentarios." %>
+            <% else %>
+              <%= form.text_area :body, class: "form-control", cols: "68", rows: "2", placeholder: 'Use los comentarios para solicitar mas información o sugerir mejoras. Evite comentarios como "+1" o "gracias".' %>
+            <% end %>
+          </div>
         </td>
         <td class="vt">
           <%= form.submit "Comentar", class: "btn btn-info" %>
         </td>
       </tr>
       <tr>
         <td colspan="2">
-          <span class="text-counter cool">ingrese al menos 15 caracteres</span>
-          <span class="form-error"></span>
+          <span id="comment-alert" class="text-counter cool"><%= I18n.t(:comment_alert_default, scope: :custom) %></span>
         </td>
       </tr>
     </tbody>

diff --git a/app/views/comments/create.js.erb b/app/views/comments/create.js.erb
@@ -0,0 +1,21 @@
+var $commentable = $('.<%= @comment.commentable.class.name.downcase %>[data-id=<%= @comment.commentable.id %>]');
+
+$commentable.find('.comment-form #comment-text')
+  .removeClass('field_with_errors');
+$commentable.find('.comment-form #comment-alert')
+  .html('<%= I18n.t(:comment_alert_default, scope: :custom) %>');
+
+
+<% if @comment.errors.empty? %>
+  $commentable.find('.comments > table > tbody')
+    .append('<%= j(render "comment", comment: @comment) %>');
+
+  $commentable.find('.comment-form textarea')
+    .val('');
+<% else %>
+  $commentable.find('.comment-form #comment-text')
+    .addClass('field_with_errors');
+
+  $commentable.find('#comment-alert')
+    .html('<%= @comment.errors.full_messages[0] %>');
+<% end %>
diff --git a/app/views/questions/show.html.erb b/app/views/questions/show.html.erb
@@ -65,7 +65,7 @@
               <div class="comments">
                 <table>
                   <tbody>
-                    <%= render 'comments/comment', commentable: @question %>
+                    <%= render @question.comments %>
                   </tbody>
                   <tfoot>
                     <tr>

diff --git a/config/locales/es.yml b/config/locales/es.yml
@@ -5,6 +5,7 @@ es:
     login_failed: ¡Combinación de Correo electrónico y Contraseña incorrecta!
     sign_up_success: ¡Bienvenido a FlowOverStack!
     form_has_error: El formulario contiene
+    comment_alert_default: Ingrese al menos 15 caracteres
   activerecord:
     models:
       answer: Respuesta
@@ -16,7 +17,7 @@ es:
       answer:
         body: Cuerpo
       comment:
-        body: Cuerpo
+        body: Comentario
       question:
         title: Titulo
         body: Descripción