Add spinners to all AJAX requests and prevent accidental double-clicks

app/controllers/addresses_controller.rb

@@ -1,12 +1,10 @@
 class AddressesController < ApplicationController
-  respond_to :json
-
   def show
     @address = Address.find_lat_lng("#{params[:address]}, #{params[:city_state]}")
     unless @address.blank?
-      respond_with @address
+      render(:json => @address)
     else
-      render :json => {"errors" => {"address" => ["Could not find address."]}}
+      render(:json => {"errors" => {"address" => ["Could not find address."]}})
     end
   end
 end

app/controllers/hydrants_controller.rb

@@ -3,15 +3,15 @@ class HydrantsController < ApplicationController
     @hydrant = Hydrant.find_by_id(params[:hydrant_id])
     if @hydrant.adopted?
       if user_signed_in? && current_user.id == @hydrant.user_id
-        render(:partial => "users/thank_you")
+        render("users/thank_you", :layout => "info_window")
       else
-        render(:partial => "users/profile")
+        render("users/profile", :layout => "info_window")
       end
     else
       if user_signed_in?
-        render(:partial => "adopt")
+        render("adopt", :layout => "info_window")
       else
-        render(:partial => "users/new")
+        render("users/new", :layout => "info_window")
       end
     end
   end

app/controllers/passwords_controller.rb

@@ -1,10 +1,7 @@
 class PasswordsController < Devise::PasswordsController
-  respond_to :json, :only => [:create, :update]
-
   # POST /resource/password
   def create
     self.resource = resource_class.send_reset_password_instructions(params[resource_name])
-
     if resource.errors.empty?
       render(:json => {"success" => true})
     else
@@ -22,7 +19,6 @@ class PasswordsController < Devise::PasswordsController
   # PUT /resource/password
   def update
     self.resource = resource_class.reset_password_by_token(params[resource_name])
-
     if resource.errors.empty?
       render(:json => {"success" => true})
     else

app/controllers/users_controller.rb

@@ -1,12 +1,12 @@
 class UsersController < Devise::RegistrationsController
   def edit
-    render_with_scope :edit
+    render("edit", :layout => "info_window")
   end
 
   def update
     if resource.update_with_password(params[resource_name])
-      sign_in resource_name, resource, :bypass => true
-      redirect_to :controller => "hydrants", :action => "show", :hydrant_id => params[:hydrant_id]
+      sign_in(resource_name, resource, :bypass => true)
+      redirect_to(:controller => "hydrants", :action => "show", :hydrant_id => params[:hydrant_id])
     else
       clean_up_passwords(resource)
       render(:json => {"errors" => resource.errors})

app/views/hydrants/adopt.html.erb

@@ -2,7 +2,7 @@
   <h2>Adopt this Hydrant</h2>
   <%= f.hidden_field "id" %>
   <%= f.hidden_field "user_id", :value => current_user.id %>
-  <%= f.label "name", "Give your hydrant a name", :id => "hydrant_name_label" %>
+  <%= f.label "name", "Give this hydrant a name", :id => "hydrant_name_label" %>
   <%= f.text_field "name", :tabindex => 1 %>
   <%= f.submit "Adopt!", :tabindex => 2, :id => "adoption_form_submit" %>
   <p>By adopting this hydrant, you agree to the <%= link_to "Terms of Service", "#", :tabindex => 3 %>.</p>

app/views/layouts/info_window.html.erb

@@ -0,0 +1,6 @@
+<div id="loader" style="display: none;">
+  <img src="/images/ajax-loader.gif" />
+</div>
+<div id="info_window">
+  <%= yield %>
+</div>

public/javascripts/application.js

@@ -38,66 +38,81 @@ $(function() {
       if(activeInfoWindow) {
         activeInfoWindow.close();
       }
-      $.get('/hydrant', {
-        'hydrant_id': hydrantId
-      }, function(data) {
-        var infoWindow = new google.maps.InfoWindow({
-          content: data,
-          maxWidth: 350
-        });
-        infoWindow.open(map, marker);
-        activeHydrantId = hydrantId;
-        activeMarker = marker;
-        activeInfoWindow = infoWindow;
+      var infoWindow = new google.maps.InfoWindow({
+        maxWidth: 350
+      });
+      activeInfoWindow = infoWindow;
+      activeHydrantId = hydrantId;
+      activeMarker = marker;
+      $.ajax({
+        type: 'GET',
+        url: '/hydrant',
+        data: {
+          'hydrant_id': hydrantId
+        },
+        success: function(data) {
+          // Prevent race condition, which could lead to multiple windows being open at the same time.
+          if(infoWindow == activeInfoWindow) {
+            infoWindow.setContent(data);
+            infoWindow.open(map, marker);
+          }
+        }
       });
     });
     hydrantIds.push(hydrantId);
   }
   function addMarkersAround(lat, lng) {
-    $.get('/hydrants.json', {
-      'commit': $('#address_submit').val(),
-      'utf8': '✓',
-      'authenticity_token': $('#address_form input[name="authenticity_token"]').val(),
-      'lat': lat,
-      'lng': lng
-    }, function(data) {
-      if(data.errors) {
-        $('#address_label').addClass('error', 500);
-        $('#address').addClass('error', 500);
-        $('#address').focus();
-      } else {
-        var northMost;
-        var eastMost;
-        var southMost;
-        var westMost;
-        var i = 0;
-        $(data).each(function(index, hydrant) {
-          hydrant = hydrant.hydrant;
-          if(!northMost || northMost > hydrant.lat) {
-            northMost = hydrant.lat;
-          }
-          if(!eastMost || eastMost > hydrant.lng) {
-            eastMost = hydrant.lng;
-          }
-          if(!southMost || southMost < hydrant.lat) {
-            southMost = hydrant.lat;
-          }
-          if(!westMost || westMost < hydrant.lng) {
-            westMost = hydrant.lng;
-          }
-          setTimeout(function() {
-            point = new google.maps.LatLng(hydrant.lat, hydrant.lng);
-            color = '/images/markers/' + (hydrant.user_id ? 'green' : 'red') + '.png';
-            addMarker(hydrant.id, point, color);
-          }, i * 100);
-          if($.inArray(hydrant.id, hydrantIds) == -1) {
-            i += 1;
-          }
-        });
-        southWest = new google.maps.LatLng(southMost, westMost);
-        northEast = new google.maps.LatLng(northMost, eastMost);
-        bounds = new google.maps.LatLngBounds(southWest, northEast);
-        map.fitBounds(bounds);
+    $.ajax({
+      type: 'GET',
+      url: '/hydrants.json',
+      data: {
+        'commit': $('#address_submit').val(),
+        'utf8': '✓',
+        'authenticity_token': $('#address_form input[name="authenticity_token"]').val(),
+        'lat': lat,
+        'lng': lng
+      },
+      success: function(data) {
+        if(data.errors) {
+          $('#address_label').addClass('error', 500);
+          $('#address').addClass('error', 500);
+          $('#address').focus();
+        } else {
+          $('#address_label').removeClass('error', 500);
+          $('#address').removeClass('error', 500);
+          var northMost;
+          var eastMost;
+          var southMost;
+          var westMost;
+          var i = 0;
+          $(data).each(function(index, hydrant) {
+            hydrant = hydrant.hydrant;
+            if(!northMost || northMost > hydrant.lat) {
+              northMost = hydrant.lat;
+            }
+            if(!eastMost || eastMost > hydrant.lng) {
+              eastMost = hydrant.lng;
+            }
+            if(!southMost || southMost < hydrant.lat) {
+              southMost = hydrant.lat;
+            }
+            if(!westMost || westMost < hydrant.lng) {
+              westMost = hydrant.lng;
+            }
+            setTimeout(function() {
+              point = new google.maps.LatLng(hydrant.lat, hydrant.lng);
+              color = '/images/markers/' + (hydrant.user_id ? 'green' : 'red') + '.png';
+              addMarker(hydrant.id, point, color);
+            }, i * 100);
+            if($.inArray(hydrant.id, hydrantIds) == -1) {
+              i += 1;
+            }
+          });
+          southWest = new google.maps.LatLng(southMost, westMost);
+          northEast = new google.maps.LatLng(northMost, eastMost);
+          bounds = new google.maps.LatLngBounds(southWest, northEast);
+          map.fitBounds(bounds);
+        }
       }
     });
   }
@@ -106,24 +121,37 @@ $(function() {
     addMarkersAround(center.lat(), center.lng());
   });
   $('#address_form').submit(function() {
+    var submitButton = $("#address_form input[type='submit']");
+    $(submitButton).attr("disabled", true);
+    var submitButtonText = $(submitButton).attr("value");
+    $(submitButton).attr("value", "Please Wait...");
     if($('#address').val() === '') {
+      $(submitButton).attr("disabled", false);
+      $(submitButton).attr("value", submitButtonText);
       $('#address_label').addClass('error', 500);
       $('#address').addClass('error', 500);
       $('#address').focus();
     } else {
-      $.get('/address.json', {
-        'commit': $('#address_submit').val(),
-        'utf8': '✓',
-        'authenticity_token': $('#address_form input[name="authenticity_token"]').val(),
-        'city_state': $('#city_state').val(),
-        'address': $('#address').val()
-      }, function(data) {
-        if(data.errors) {
-          $('#address_label').addClass('error', 500);
-          $('#address').addClass('error', 500);
-          $('#address').focus();
-        } else {
-          addMarkersAround(data[0], data[1]);
+      $.ajax({
+        type: 'GET',
+        url: '/address.json',
+        data: {
+          'commit': $('#address_submit').val(),
+          'utf8': '✓',
+          'authenticity_token': $('#address_form input[name="authenticity_token"]').val(),
+          'city_state': $('#city_state').val(),
+          'address': $('#address').val()
+        },
+        success: function(data) {
+          $(submitButton).attr("disabled", false);
+          $(submitButton).attr("value", submitButtonText);
+          if(data.errors) {
+            $('#address_label').addClass('error', 500);
+            $('#address').addClass('error', 500);
+            $('#address').focus();
+          } else {
+            addMarkersAround(data[0], data[1]);
+          }
         }
       });
     }
@@ -155,6 +183,8 @@ $(function() {
     }
   });
   $('#combo_form').live('submit', function() {
+    var submitButton = $("#combo_form input[type='submit']");
+    $(submitButton).attr("disabled", true);
     var errors = []
     if(!/[\w\.%\+\]+@[\w\]+\.+[\w]{2,}/.test($('#user_email').val())) {
       errors.push($('#user_email'));
@@ -182,60 +212,78 @@ $(function() {
         $('#user_password_confirmation').removeClass('error');
       }
       if(errors.length > 0) {
+        $(submitButton).attr("disabled", false);
         errors[0].focus();
       } else {
-        $.post('/users.json', {
-          'commit': $('#user_sign_up_submit').val(),
-          'utf8': '✓',
-          'authenticity_token': $('#combo_form input[name="authenticity_token"]').val(),
-          'user': {
-            'email': $('#user_email').val(),
-            'name': $('#user_name').val(),
-            'organization': $('#user_organization').val(),
-            'voice_number': $('#user_voice_number').val(),
-            'sms_number': $('#user_sms_number').val(),
-            'password': $('#user_password_confirmation').val(),
-            'password_confirmation': $('#user_password_confirmation').val()
-          }
-        }, function(data) {
-          if(data.errors) {
-            if(data.errors.email) {
-              errors.push($('#user_email'));
-              $('#user_email_label').addClass('error', 500);
-              $('#user_email').addClass('error', 500);
+        $.ajax({
+          type: 'POST',
+          url: '/users.json',
+          data: {
+            'commit': $('#user_sign_up_submit').val(),
+            'utf8': '✓',
+            'authenticity_token': $('#combo_form input[name="authenticity_token"]').val(),
+            'user': {
+              'email': $('#user_email').val(),
+              'name': $('#user_name').val(),
+              'organization': $('#user_organization').val(),
+              'voice_number': $('#user_voice_number').val(),
+              'sms_number': $('#user_sms_number').val(),
+              'password': $('#user_password_confirmation').val(),
+              'password_confirmation': $('#user_password_confirmation').val()
             }
-            if(data.errors.name) {
-              errors.push($('#user_name'));
-              $('#user_name_label').addClass('error', 500);
-              $('#user_name').addClass('error', 500);
+          },
+          beforeSend: function() {
+            $('#info_window').hide();
+            $('#loader').show();
+          },
+          success: function(data) {
+            if(data.errors) {
+              $('#loader').hide();
+              $('#info_window').show();
+              $(submitButton).attr("disabled", false);
+              if(data.errors.email) {
+                errors.push($('#user_email'));
+                $('#user_email_label').addClass('error', 500);
+                $('#user_email').addClass('error', 500);
+              }
+              if(data.errors.name) {
+                errors.push($('#user_name'));
+                $('#user_name_label').addClass('error', 500);
+                $('#user_name').addClass('error', 500);
+              }
+              if(data.errors.organization) {
+                errors.push($('#user_organization'));
+                $('#user_organization_label').addClass('error', 500);
+                $('#user_organization').addClass('error', 500);
+              }
+              if(data.errors.voice_number) {
+                errors.push($('#user_voice_number'));
+                $('#user_voice_number_label').addClass('error', 500);
+                $('#user_voice_number').addClass('error', 500);
+              }
+              if(data.errors.sms_number) {
+                errors.push($('#user_sms_number'));
+                $('#user_sms_number_label').addClass('error', 500);
+                $('#user_sms_number').addClass('error', 500);
+              }
+              if(data.errors.password) {
+                errors.push($('#user_password_confirmation'));
+                $('#user_password_confirmation_label').addClass('error', 500);
+                $('#user_password_confirmation').addClass('error', 500);
+              }
+              errors[0].focus();
+            } else {
+              $.ajax({
+                type: 'GET',
+                url: '/hydrant',
+                data: {
+                  'hydrant_id': activeHydrantId
+                },
+                success: function(data) {
+                  activeInfoWindow.setContent(data);
+                }
+              });
             }
-            if(data.errors.organization) {
-              errors.push($('#user_organization'));
-              $('#user_organization_label').addClass('error', 500);
-              $('#user_organization').addClass('error', 500);
-            }
-            if(data.errors.voice_number) {
-              errors.push($('#user_voice_number'));
-              $('#user_voice_number_label').addClass('error', 500);
-              $('#user_voice_number').addClass('error', 500);
-            }
-            if(data.errors.sms_number) {
-              errors.push($('#user_sms_number'));
-              $('#user_sms_number_label').addClass('error', 500);
-              $('#user_sms_number').addClass('error', 500);
-            }
-            if(data.errors.password) {
-              errors.push($('#user_password_confirmation'));
-              $('#user_password_confirmation_label').addClass('error', 500);
-              $('#user_password_confirmation').addClass('error', 500);
-            }
-            errors[0].focus();
-          } else {
-            $.get('/hydrant', {
-              'hydrant_id': activeHydrantId
-            }, function(data) {
-              activeInfoWindow.setContent(data);
-            });
           }
         });
       }
@@ -249,50 +297,81 @@ $(function() {
         $('#user_password').removeClass('error');
       }
       if(errors.length > 0) {
+        $(submitButton).attr("disabled", false);
         errors[0].focus();
       } else {
-        $.post('/users/sign_in.json', {
-          'commit': $('#user_sign_in_submit').val(),
-          'utf8': '✓',
-          'authenticity_token': $('#combo_form input[name="authenticity_token"]').val(),
-          'user': {
-            'email': $('#user_email').val(),
-            'password': $('#user_password').val(),
-            'remember_me': $('#user_remember_me').val()
-          }
-        }, function(data) {
-          if(data.errors) {
-            $('#user_password_label').addClass('error', 500);
-            $('#user_password').addClass('error', 500);
-            $('#user_password').focus();
-          } else {
-            $.get('/hydrant', {
-              'hydrant_id': activeHydrantId
-            }, function(data) {
-              activeInfoWindow.setContent(data);
-            });
+        $.ajax({
+          type: 'POST',
+          url: '/users/sign_in.json',
+          data: {
+            'commit': $('#user_sign_in_submit').val(),
+            'utf8': '✓',
+            'authenticity_token': $('#combo_form input[name="authenticity_token"]').val(),
+            'user': {
+              'email': $('#user_email').val(),
+              'password': $('#user_password').val(),
+              'remember_me': $('#user_remember_me').val()
+            }
+          },
+          beforeSend: function() {
+            $('#info_window').hide();
+            $('#loader').show();
+          },
+          success: function(data) {
+            if(data.errors) {
+              $('#loader').hide();
+              $('#info_window').show();
+              $(submitButton).attr("disabled", false);
+              $('#user_password_label').addClass('error', 500);
+              $('#user_password').addClass('error', 500);
+              $('#user_password').focus();
+            } else {
+              $.ajax({
+                type: 'GET',
+                url: '/hydrant',
+                data: {
+                  'hydrant_id': activeHydrantId
+                },
+                success: function(data) {
+                  activeInfoWindow.setContent(data);
+                }
+              });
+            }
           }
         });
       }
     } else if($(this).data('state') === 'user_forgot_password') {
       if(errors.length > 0) {
+        $(submitButton).attr("disabled", false);
         errors[0].focus();
       } else {
-        $.post('/users/password.json', {
-          'commit': $('#user_forgot_password_submit').val(),
-          'utf8': '✓',
-          'authenticity_token': $('#combo_form input[name="authenticity_token"]').val(),
-          'user': {
-            'email': $('#user_email').val()
-          }
-        }, function(data) {
-          if(data.errors) {
-            $('#user_email_label').addClass('error', 500);
-            $('#user_email').addClass('error', 500);
-            $('#user_email').focus();
-          } else {
-            $('#user_forgot_password_fields').slideUp();
-            $('#user_sign_in_fields').slideDown();
+        $.ajax({
+          type: 'POST',
+          url: '/users/password.json',
+          data: {
+            'commit': $('#user_forgot_password_submit').val(),
+            'utf8': '✓',
+            'authenticity_token': $('#combo_form input[name="authenticity_token"]').val(),
+            'user': {
+              'email': $('#user_email').val()
+            }
+          },
+          beforeSend: function() {
+            $('#info_window').hide();
+            $('#loader').show();
+          },
+          success: function() {
+            if(data.errors) {
+              $('#loader').hide();
+              $('#info_window').show();
+              $(submitButton).attr("disabled", false);
+              $('#user_email_label').addClass('error', 500);
+              $('#user_email').addClass('error', 500);
+              $('#user_email').focus();
+            } else {
+              $('#user_forgot_password_fields').slideUp();
+              $('#user_sign_in_fields').slideDown();
+            }
           }
         });
       }
@@ -300,72 +379,121 @@ $(function() {
     return false;
   });
   $('#sign_out_form').live('submit', function() {
-    $.get('/users/sign_out.json', {
-      'commit': $('#sign_out_form_submit').val(),
-      'utf8': '✓',
-      'authenticity_token': $('#sign_out_form input[name="authenticity_token"]').val()
-    }, function(data) {
-      $.get('/hydrant', {
-        'hydrant_id': activeHydrantId
-      }, function(data) {
-        activeInfoWindow.setContent(data);
-      });
+    var submitButton = $("#sign_out_form input[type='submit']");
+    $(submitButton).attr("disabled", true);
+    $.ajax({
+      type: 'GET',
+      url: '/users/sign_out.json',
+      data: {
+        'commit': $('#sign_out_form_submit').val(),
+        'utf8': '✓',
+        'authenticity_token': $('#sign_out_form input[name="authenticity_token"]').val()
+      },
+      beforeSend: function() {
+        $('#info_window').hide();
+        $('#loader').show();
+      },
+      success: function(data) {
+        $.ajax({
+          type: 'GET',
+          url: '/hydrant',
+          data: {
+            'hydrant_id': activeHydrantId
+          },
+          success: function(data) {
+            activeInfoWindow.setContent(data);
+          }
+        });
+      }
     });
     return false;
   });
   $('#adoption_form').live('submit', function() {
-    $.post('/hydrant', {
-      'id': $('#hydrant_id').val(),
-      'commit': $('#adoption_form_submit').val(),
-      'utf8': '✓',
-      'authenticity_token': $('#adoption_form input[name="authenticity_token"]').val(),
-      '_method': 'put',
-      'hydrant': {
-        'user_id': $('#hydrant_user_id').val(),
-        'name': $('#hydrant_name').val()
+    var submitButton = $("#adoption_form input[type='submit']");
+    $(submitButton).attr("disabled", true);
+    $.ajax({
+      type: 'POST',
+      url: '/hydrant',
+      data: {
+        'id': $('#hydrant_id').val(),
+        'commit': $('#adoption_form_submit').val(),
+        'utf8': '✓',
+        'authenticity_token': $('#adoption_form input[name="authenticity_token"]').val(),
+        '_method': 'put',
+        'hydrant': {
+          'user_id': $('#hydrant_user_id').val(),
+          'name': $('#hydrant_name').val()
+        }
+      },
+      beforeSend: function() {
+        $('#info_window').hide();
+        $('#loader').show();
+      },
+      success: function(data) {
+        $.ajax({
+          type: 'GET',
+          url: '/hydrant',
+          data: {
+            'hydrant_id': activeHydrantId
+          },
+          success: function(data) {
+            activeInfoWindow.setContent(data);
+            activeInfoWindow.setContent(data);
+            image = new google.maps.MarkerImage('/images/markers/green.png',
+              new google.maps.Size(27.0, 37.0),
+              new google.maps.Point(0, 0),
+              new google.maps.Point(13.0, 18.0)
+            );
+            activeMarker.setIcon(image);
+            activeMarker.setAnimation(google.maps.Animation.BOUNCE);
+          }
+        });
       }
-    }, function(data) {
-      $.get('/hydrant', {
-        'hydrant_id': activeHydrantId
-      }, function(data) {
-        activeInfoWindow.setContent(data);
-        image = new google.maps.MarkerImage('/images/markers/green.png',
-          new google.maps.Size(27.0, 37.0),
-          new google.maps.Point(0, 0),
-          new google.maps.Point(13.0, 18.0)
-        );
-        activeMarker.setIcon(image);
-        activeMarker.setAnimation(google.maps.Animation.BOUNCE);
-      });
     });
     return false;
   });
   $('#abandon_form').live('submit', function() {
     var answer = window.confirm("Are you sure you want to abandon this hydrant?")
     if(answer) {
-      $.post('/hydrant', {
-        'id': $('#hydrant_id').val(),
-        'commit': $('#abandon_form_submit').val(),
-        'utf8': '✓',
-        'authenticity_token': $('#abandon_form input[name="authenticity_token"]').val(),
-        '_method': 'put',
-        'hydrant': {
-          'user_id': $('#hydrant_user_id').val(),
-          'name': $('#hydrant_name').val()
+      var submitButton = $("#abandon_form input[type='submit']");
+      $(submitButton).attr("disabled", true);
+      $.ajax({
+        type: 'POST',
+        url: '/hydrant',
+        data: {
+          'id': $('#hydrant_id').val(),
+          'commit': $('#abandon_form_submit').val(),
+          'utf8': '✓',
+          'authenticity_token': $('#abandon_form input[name="authenticity_token"]').val(),
+          '_method': 'put',
+          'hydrant': {
+            'user_id': $('#hydrant_user_id').val(),
+            'name': $('#hydrant_name').val()
+          }
+        },
+        beforeSend: function() {
+          $('#info_window').hide();
+          $('#loader').show();
+        },
+        success: function(data) {
+          $.ajax({
+            type: 'GET',
+            url: '/hydrant',
+            data: {
+              'hydrant_id': activeHydrantId
+            },
+            success: function(data) {
+              activeInfoWindow.setContent(data);
+              image = new google.maps.MarkerImage('/images/markers/red.png',
+                new google.maps.Size(27.0, 37.0),
+                new google.maps.Point(0, 0),
+                new google.maps.Point(13.0, 18.0)
+              );
+              activeMarker.setIcon(image);
+              activeMarker.setAnimation(null);
+            }
+          });
         }
-      }, function(data) {
-        $.get('/hydrant', {
-          'hydrant_id': activeHydrantId
-        }, function(data) {
-          activeInfoWindow.setContent(data);
-          image = new google.maps.MarkerImage('/images/markers/red.png',
-            new google.maps.Size(27.0, 37.0),
-            new google.maps.Point(0, 0),
-            new google.maps.Point(13.0, 18.0)
-          );
-          activeMarker.setIcon(image);
-          activeMarker.setAnimation(null);
-        });
       });
       return false;
     }
@@ -373,44 +501,71 @@ $(function() {
   $('#steal_form').live('submit', function() {
     var answer = window.confirm("Are you sure you want to steal this hydrant?")
     if(answer) {
-      $.post('/hydrant', {
-        'id': $('#hydrant_id').val(),
-        'commit': $('#steal_form_submit').val(),
-        'utf8': '✓',
-        'authenticity_token': $('#steal_form input[name="authenticity_token"]').val(),
-        '_method': 'put',
-        'hydrant': {
-          'user_id': $('#hydrant_user_id').val(),
-          'name': $('#hydrant_name').val()
+      var submitButton = $("#steal_form input[type='submit']");
+      $(submitButton).attr("disabled", true);
+      $.ajax({
+        type: 'POST',
+        url: '/hydrant',
+        data: {
+          'id': $('#hydrant_id').val(),
+          'commit': $('#steal_form_submit').val(),
+          'utf8': '✓',
+          'authenticity_token': $('#steal_form input[name="authenticity_token"]').val(),
+          '_method': 'put',
+          'hydrant': {
+            'user_id': $('#hydrant_user_id').val(),
+            'name': $('#hydrant_name').val()
+          }
+        },
+        beforeSend: function() {
+          $('#info_window').hide();
+          $('#loader').show();
+        },
+        success: function(data) {
+          $.ajax({
+            type: 'GET',
+            url: '/hydrant',
+            data: {
+              'hydrant_id': activeHydrantId
+            },
+            success: function(data) {
+              activeInfoWindow.setContent(data);
+              image = new google.maps.MarkerImage('/images/markers/red.png',
+                new google.maps.Size(27.0, 37.0),
+                new google.maps.Point(0, 0),
+                new google.maps.Point(13.0, 18.0)
+              );
+              activeMarker.setIcon(image);
+              activeMarker.setAnimation(null);
+            }
+          });
         }
-      }, function(data) {
-        $.get('/hydrant', {
-          'hydrant_id': activeHydrantId
-        }, function(data) {
-          activeInfoWindow.setContent(data);
-          image = new google.maps.MarkerImage('/images/markers/red.png',
-            new google.maps.Size(27.0, 37.0),
-            new google.maps.Point(0, 0),
-            new google.maps.Point(13.0, 18.0)
-          );
-          activeMarker.setIcon(image);
-          activeMarker.setAnimation(null);
-        });
       });
       return false;
     }
   });
   $('#edit_profile_form').live('submit', function() {
-    $.get('/users/edit', {
-      'commit': $('#edit_profile_form_submit').val(),
-      'utf8': '✓',
-      'authenticity_token': $('#edit_profile_form input[name="authenticity_token"]').val()
-    }, function(data) {
-      activeInfoWindow.setContent(data);
+    $.ajax({
+      type: 'GET',
+      url: '/users/edit',
+      data: {
+        'commit': $('#edit_profile_form_submit').val(),
+        'utf8': '✓',
+        'authenticity_token': $('#edit_profile_form input[name="authenticity_token"]').val()
+      },
+      beforeSend: function() {
+        $('#info_window').hide();
+        $('#loader').show();
+      },
+      success: function(data) {
+        activeInfoWindow.setContent(data);
+      }
     });
     return false;
   });
   $('#edit_form').live('submit', function() {
+    var submitButton = $("#edit_form input[type='submit']");
+    $(submitButton).attr("disabled", true);
     var errors = []
     if(!/[\w\.%\+\]+@[\w\]+\.+[\w]{2,}/.test($('#user_email').val())) {
       errors.push($('#user_email'));
@@ -445,65 +600,78 @@ $(function() {
       $('#user_current_password').removeClass('error');
     }
     if(errors.length > 0) {
+      $(submitButton).attr("disabled", false);
       errors[0].focus();
     } else {
-      $.post('/users.json', {
-        'id': $('#id').val(),
-        'hydrant_id': activeHydrantId,
-        'commit': $('#edit_form_submit').val(),
-        'utf8': '✓',
-        'authenticity_token': $('#edit_form input[name="authenticity_token"]').val(),
-        '_method': 'put',
-        'user': {
-          'email': $('#user_email').val(),
-          'name': $('#user_name').val(),
-          'organization': $('#user_organization').val(),
-          'voice_number': $('#user_voice_number').val(),
-          'sms_number': $('#user_sms_number').val(),
-          'password': $('#user_password').val(),
-          'password_confirmation': $('#user_password').val(),
-          'current_password': $('#user_current_password').val()
-        }
-      }, function(data) {
-        if(data.errors) {
-          if(data.errors.email) {
-            errors.push($('#user_email'));
-            $('#user_email_label').addClass('error', 500);
-            $('#user_email').addClass('error', 500);
+      $.ajax({
+        type: 'POST',
+        url: '/users.json',
+        data: {
+          'id': $('#id').val(),
+          'hydrant_id': activeHydrantId,
+          'commit': $('#edit_form_submit').val(),
+          'utf8': '✓',
+          'authenticity_token': $('#edit_form input[name="authenticity_token"]').val(),
+          '_method': 'put',
+          'user': {
+            'email': $('#user_email').val(),
+            'name': $('#user_name').val(),
+            'organization': $('#user_organization').val(),
+            'voice_number': $('#user_voice_number').val(),
+            'sms_number': $('#user_sms_number').val(),
+            'password': $('#user_password').val(),
+            'password_confirmation': $('#user_password').val(),
+            'current_password': $('#user_current_password').val()
           }
-          if(data.errors.name) {
-            errors.push($('#user_name'));
-            $('#user_name_label').addClass('error', 500);
-            $('#user_name').addClass('error', 500);
+        },
+        beforeSend: function() {
+          $('#info_window').hide();
+          $('#loader').show();
+        },
+        success: function(data) {
+          if(data.errors) {
+            $('#loader').hide();
+            $('#info_window').show();
+            $(submitButton).attr("disabled", false);
+            if(data.errors.email) {
+              errors.push($('#user_email'));
+              $('#user_email_label').addClass('error', 500);
+              $('#user_email').addClass('error', 500);
+            }
+            if(data.errors.name) {
+              errors.push($('#user_name'));
+              $('#user_name_label').addClass('error', 500);
+              $('#user_name').addClass('error', 500);
+            }
+            if(data.errors.organization) {
+              errors.push($('#user_organization'));
+              $('#user_organization_label').addClass('error', 500);
+              $('#user_organization').addClass('error', 500);
+            }
+            if(data.errors.voice_number) {
+              errors.push($('#user_voice_number'));
+              $('#user_voice_number_label').addClass('error', 500);
+              $('#user_voice_number').addClass('error', 500);
+            }
+            if(data.errors.sms_number) {
+              errors.push($('#user_sms_number'));
+              $('#user_sms_number_label').addClass('error', 500);
+              $('#user_sms_number').addClass('error', 500);
+            }
+            if(data.errors.password) {
+              errors.push($('#user_password'));
+              $('#user_password_label').addClass('error', 500);
+              $('#user_password').addClass('error', 500);
+            }
+            if(data.errors.current_password) {
+              errors.push($('#user_current_password'));
+              $('#user_current_password_label').addClass('error', 500);
+              $('#user_current_password').addClass('error', 500);
+            }
+            errors[0].focus();
+          } else {
+            activeInfoWindow.setContent(data);
           }
-          if(data.errors.organization) {
-            errors.push($('#user_organization'));
-            $('#user_organization_label').addClass('error', 500);
-            $('#user_organization').addClass('error', 500);
-          }
-          if(data.errors.voice_number) {
-            errors.push($('#user_voice_number'));
-            $('#user_voice_number_label').addClass('error', 500);
-            $('#user_voice_number').addClass('error', 500);
-          }
-          if(data.errors.sms_number) {
-            errors.push($('#user_sms_number'));
-            $('#user_sms_number_label').addClass('error', 500);
-            $('#user_sms_number').addClass('error', 500);
-          }
-          if(data.errors.password) {
-            errors.push($('#user_password'));
-            $('#user_password_label').addClass('error', 500);
-            $('#user_password').addClass('error', 500);
-          }
-          if(data.errors.current_password) {
-            errors.push($('#user_current_password'));
-            $('#user_current_password_label').addClass('error', 500);
-            $('#user_current_password').addClass('error', 500);
-          }
-          errors[0].focus();
-        } else {
-          activeInfoWindow.setContent(data);
         }
       });
     }