From c5fc21e6a6615646b3fa443b6fd12a80b4fef331 Mon Sep 17 00:00:00 2001
From: John Firebaugh <john.firebaugh@gmail.com>
Date: Thu, 1 Aug 2013 12:02:12 -0700
Subject: [PATCH] Inline validation errors on sign up page

---
 app/assets/stylesheets/common.css.scss  | 12 +++++++++++-
 app/views/user/new.html.erb             |  8 ++++++--
 test/functional/user_controller_test.rb |  4 ----
 test/integration/user_creation_test.rb  |  2 --
 4 files changed, 17 insertions(+), 9 deletions(-)

diff --git a/app/assets/stylesheets/common.css.scss b/app/assets/stylesheets/common.css.scss
index b9306a4f1..7eec371b4 100644
--- a/app/assets/stylesheets/common.css.scss
+++ b/app/assets/stylesheets/common.css.scss
@@ -1712,7 +1712,17 @@ ul.results-list li { border-bottom: 1px solid #ccc; }
 .field_with_errors {
   padding: 2px;
   background-color: #ff7070;
-  display: table;
+  display: inline-block;
+}
+
+.formError {
+  display: inline-block;
+  padding: 5px 10px;
+  margin-top: 5px;
+  border-radius: 4px;
+  font-size: 12px;
+  color: #fff;
+  background-color: #ff7070;
 }
 
 /* Rules for rails validation error boxes */
diff --git a/app/views/user/new.html.erb b/app/views/user/new.html.erb
index 51808562f..6c89a7830 100644
--- a/app/views/user/new.html.erb
+++ b/app/views/user/new.html.erb
@@ -5,8 +5,6 @@
 <% end %>
 
 <%= form_for :user, :url => { :action => 'create' }, :html => { :class => 'signup-form-wrapper standard-form fillL col6 pad2' } do %>
-  <%= error_messages_for 'user' %>
-
   <%= hidden_field_tag('referer', h(@referer)) unless @referer.nil? %>
 
   <fieldset>
@@ -15,12 +13,14 @@
         <%= t 'user.new.email address' %>
       </label>
       <%= email_field(:user, :email, { :tabindex => 1 }) %>
+      <%= error_message_on(:user, :email) %>
     </div>
     <div class="form-row">
       <label for="email_confirmation" class="standard-label">
         <%= t 'user.new.confirm email address' %>
       </label>
       <%= email_field(:user, :email_confirmation, { :tabindex => 2 }) %>
+      <%= error_message_on(:user, :email_confirmation) %>
     </div>
     <span class="form-help deemphasize"><%= raw(t 'user.new.not displayed publicly') %></span>
   </fieldset>
@@ -31,6 +31,7 @@
         <%= t 'user.new.display name' %>
       </label>
       <%= text_field(:user, :display_name, { :tabindex => 3 }) %>
+      <%= error_message_on(:user, :display_name) %>
     </div>
     <span class="form-help deemphasize"><%= t 'user.new.display name description' %></span>
   </fieldset>
@@ -41,6 +42,7 @@
         <%= raw t 'user.new.openid', :logo => openid_logo %>
       </label>
       <%= url_field(:user, :openid_url, { :id => "openid_url", :tabindex => 4, :class => "openid_url" }) %>
+      <%= error_message_on(:user, :openid_url) %>
     </div>
     <span class="form-help deemphasize"><%= t 'user.new.openid no password' %></span>
   </fieldset>
@@ -51,12 +53,14 @@
         <%= t 'user.new.password' %>
       </label>
       <%= password_field(:user, :pass_crypt, {:tabindex => 5 }) %>
+      <%= error_message_on(:user, :pass_crypt) %>
     </div>
     <div class="form-row">
       <label class="standard-label">
         <%= t 'user.new.confirm password' %>
       </label>
       <%= password_field(:user, :pass_crypt_confirmation, { :tabindex => 6 }) %>
+      <%= error_message_on(:user, :pass_crypt_confirmation) %>
     </div>
   </fieldset>
 
diff --git a/test/functional/user_controller_test.rb b/test/functional/user_controller_test.rb
index 6ae27c6eb..20ea74696 100644
--- a/test/functional/user_controller_test.rb
+++ b/test/functional/user_controller_test.rb
@@ -259,7 +259,6 @@ class UserControllerTest < ActionController::TestCase
     end
     assert_response :success                                                                       
     assert_template 'new'
-    assert_select "div#errorExplanation"
     assert_select "form > fieldset > div.form-row > div.field_with_errors > input#user_email"
   end
   
@@ -279,7 +278,6 @@ class UserControllerTest < ActionController::TestCase
     end
     assert_response :success                                                                       
     assert_template 'new'
-    assert_select "div#errorExplanation"
     assert_select "form > fieldset > div.form-row > div.field_with_errors > input#user_email"
   end
     
@@ -299,7 +297,6 @@ class UserControllerTest < ActionController::TestCase
     end
     assert_response :success                                                                       
     assert_template 'new'
-    assert_select "div#errorExplanation"
     assert_select "form > fieldset > div.form-row > div.field_with_errors > input#user_display_name"
   end
   
@@ -319,7 +316,6 @@ class UserControllerTest < ActionController::TestCase
     end
     assert_response :success                                                                       
     assert_template 'new'
-    assert_select "div#errorExplanation"
     assert_select "form > fieldset > div.form-row > div.field_with_errors > input#user_display_name"
   end
 
diff --git a/test/integration/user_creation_test.rb b/test/integration/user_creation_test.rb
index 9945bd886..fcab978c8 100644
--- a/test/integration/user_creation_test.rb
+++ b/test/integration/user_creation_test.rb
@@ -29,7 +29,6 @@ class UserCreationTest < ActionController::IntegrationTest
       assert_response :success
       assert_template 'user/new'
       assert_equal response.headers['Content-Language'][0..1], localer.to_s[0..1] unless localer == :root
-      assert_select "div#errorExplanation"
       assert_select "form > fieldset > div.form-row > div.field_with_errors > input#user_email"
       assert_no_missing_translations
     end
@@ -48,7 +47,6 @@ class UserCreationTest < ActionController::IntegrationTest
       end
       assert_response :success
       assert_template 'user/new'
-      assert_select "div#errorExplanation"
       assert_select "form > fieldset > div.form-row > div.field_with_errors > input#user_display_name"
       assert_no_missing_translations
     end
-- 
2.39.5