check if username is available in registration form

app/assets/javascripts/application.js

@@ -35,6 +35,7 @@
 //= require users
 //= require votes
 //= require annotatable
+//= require registration_form
 
 
 var initialize_modules = function() {
@@ -48,6 +49,7 @@ var initialize_modules = function() {
   App.PreventDoubleSubmission.initialize();
   App.IeAlert.initialize();
   App.Annotatable.initialize();
+  App.RegistrationForm.initialize();
 };
 
 $(function(){

app/assets/javascripts/registration_form.js.coffee

@@ -0,0 +1,25 @@
+App.RegistrationForm =
+
+  initialize: ->
+
+    registrationForm = $("form#new_user[action=\"/users\"]")
+    usernameInput = $("input#user_username")
+
+    clearUsernameMessage = ->
+      $("small").remove()
+
+    showUsernameMessage = (response) ->
+      klass = if response.available then "error no-error" else "error error"
+      usernameInput.after $("<small class=\"#{klass}\" style=\"margin-top: -16px;\">#{response.message}</small>")
+
+    validateUsername = (username) ->
+      request = $.post "/user/registrations/check_username?username=#{username}"
+      request.done (response) ->
+        showUsernameMessage(response)
+
+
+    if registrationForm.length > 0
+      usernameInput.on "focusout", ->
+        clearUsernameMessage()
+        username = usernameInput.val();
+        validateUsername(username) if username != ""