[Delivers #10897619] Serve all forms dynamically

app/controllers/forms_controller.rb

@@ -0,0 +1,18 @@
+class FormsController < ApplicationController
+  def index
+    @hydrant = Hydrant.find_by_id(params[:hydrant_id])
+    if @hydrant.adopted?
+      if user_signed_in? && current_user.id == @hydrant.user_id
+        render(:partial => "thank_you")
+      else
+        render(:partial => "user_profile")
+      end
+    else
+      if user_signed_in?
+        render(:partial => "adoption_form")
+      else
+        render(:partial => "combo_form")
+      end
+    end
+  end
+end

app/controllers/hydrants_controller.rb

@@ -4,7 +4,7 @@ class HydrantsController < ApplicationController
   def update
     @hydrant = Hydrant.find(params[:id])
     if @hydrant.update_attributes(params[:hydrant])
-      respond_with @hydrant
+      render(:json => @hydrant)
     else
       render(:json => {"errors" => @hydrant.errors})
     end

app/models/hydrant.rb

@@ -4,4 +4,9 @@ class Hydrant < ActiveRecord::Base
   def self.find_closest(lat, lng, limit=100)
     Hydrant.find_by_sql(["SELECT *, (3959 * ACOS(COS(RADIANS(?)) * COS(RADIANS(lat)) * COS(radians(lng) - RADIANS(?)) + SIN(RADIANS(?)) * SIN(RADIANS(lat)))) AS distance FROM hydrants ORDER BY distance LIMIT ?", lat, lng, lat, limit])
   end
+
+  def adopted?
+    !user.nil?
+  end
+
 end

app/views/forms/_adoption_form.html.erb

@@ -1,8 +1,8 @@
-<% style = user_signed_in? ? {} : {:style => "display: none;"}%>
+<%= form_for @hydrant, :remote => true, :html => {:id => "adoption_form"} do |f| %>
-<%= form_for hydrant, :remote => true, :html => {:class => "adoption_form"}.merge(style) do |f| %>
+  <h2>Adopt this Hydrant</h2>
   <div id="adoption_fields">
     <%= f.hidden_field "id" %>
-    <%= f.hidden_field "user_id", :value => (user_signed_in? ? current_user.id : nil) %>
+    <%= f.hidden_field "user_id", :value => current_user.id %>
     <%= f.label "name", "Give your hydrant a name", :id => "hydrant_name_label" %>
     <%= f.text_field "name", :tabindex => 1 %>
     <%= f.submit "Adopt!", :tabindex => 2, :id => "adoption_form_submit" %>

app/views/forms/_combo_form.html.erb

@@ -1,11 +1,12 @@
-<%= form_for :user, :remote => true, :html => {:class => "combo_form"} do |f| %>
+<%= form_for :user, :remote => true, :html => {:id => "combo_form"} do |f| %>
+  <h2>Adopt this Hydrant</h2>
   <div id="common_fields">
     <%= f.label "email", "Email address", :id => "user_email_label" %>
     <%= f.text_field "email", :tabindex => 1 %>
-    <%= f.label "new" , radio_button_tag("user", "new", true, :tabindex => 2).html_safe + "I haven\\'t signed up yet" %><br />
+    <%= f.label "new" , radio_button_tag("user", "new", true, :tabindex => 2).html_safe + "I haven't signed up yet" %><br />
-    <%= f.label "existing", radio_button_tag("user", "existing").html_safe + "I already signed up" %><br />
+    <%= f.label "existing", radio_button_tag("user", "existing").html_safe + "I've already signed up" %><br />
   </div>
-  <div id="user_new_fields">
+  <div id="sign_up_fields">
     <%= f.label "name", "Name", :id => "user_name_label" %>
     <%= f.text_field "name", :tabindex => 3 %>
     <%= f.label "organization", "Organization", :id => "user_organization_label" %>
@@ -16,14 +17,14 @@
     <%= f.text_field "sms_number", :tabindex => 6 %>
     <%= f.label "password_confirmation", "Choose a password", :id => "user_password_confirmation_label" %>
     <%= f.password_field "password_confirmation", :tabindex => 7 %>
-    <%= f.submit "Sign up", :tabindex => 8, :id => "user_new_submit" %>
+    <%= f.submit "Sign up", :tabindex => 8, :id => "sign_up_submit" %>
     <p>By signing up, you agree to the <%= link_to "Terms of Service", "#", :tabindex => 9 %>.</p>
   </div>
-  <div id="user_existing_fields" style="display: none;">
+  <div id="sign_in_fields" style="display: none;">
     <%= f.label "password", "Password", :id => "user_password_label" %>
     <%= f.password_field "password", :tabindex => 0 %>
     <%= f.label "remember_me", (f.check_box("remember_me", :checked => true, :tabindex => 0).html_safe + "Stay signed in"), :id => "user_remember_me_label" %><br />
-    <%= f.submit "Sign in", :tabindex => 0, :id => "user_existing_submit" %>
+    <%= f.submit "Sign in", :tabindex => 0, :id => "sign_in_submit" %>
     <p><%= link_to "Forgot your password?", "#", :id => "user_forgot_password_link", :tabindex => 0 %></p>
   </div>
   <div id="user_forgot_password_fields" style="display: none;">

app/views/forms/_thank_you.html.erb

@@ -0,0 +1 @@
+<h2>Thank you for adopting this hydrant!</h2>

app/views/forms/_user_profile.html.erb

@@ -0,0 +1,2 @@
+<h2><%= @hydrant.name ? @hydrant.name.titleize : "This hydrant" %> has been adopted by <%= @hydrant.user.name %></h2>
+<%= @hydrant.user.organization ? "<h3>of #{@hydrant.user.organization}</h3>".html_safe : nil %>

app/views/layouts/application.html.erb

@@ -22,9 +22,10 @@
         mapTypeId: google.maps.MapTypeId.ROADMAP
       };
       map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
-      comboFormString = '<%= render(:partial => "combo_form").gsub("\n", "") %>';
+      var activeHydrantId;
-      var openInfoWindow;
+      var activeMarker;
-      function addMarker(point, color, contentString) {
+      var activeInfoWindow;
+      function addMarker(hydrantId, point, color) {
         var image = new google.maps.MarkerImage(color,
           new google.maps.Size(27.0, 37.0),
           new google.maps.Point(0, 0),
@@ -41,231 +42,227 @@
           icon: image,
           shadow: shadow
         });
-        var infoWindow = new google.maps.InfoWindow({
-          content: contentString,
-          maxWidth: 350
-        });
         google.maps.event.addListener(marker, 'click', function() {
-          if(openInfoWindow) {
+          if(activeInfoWindow) {
-            openInfoWindow.close();
+            activeInfoWindow.close();
           }
-          infoWindow.open(map, marker);
+          $.get('<%= forms_path %>', {
-          $('.adoption_form').submit(function() {
+            'hydrant_id': hydrantId
-            $.post('<%= hydrant_path :format => "json" %>', {
+          }, function(data) {
-              'id': $('#hydrant_id').val(),
+            var infoWindow = new google.maps.InfoWindow({
-              'commit': $('#adoption_form_submit').val(),
+              content: data,
-              'utf8': '✓',
+              maxWidth: 350
-              'authenticity_token': $('input[name="authenticity_token"]').val(),
-              '_method': 'put',
-              'hydrant': {
-                'user_id': $('#hydrant_user_id').val() || <%= user_signed_in? ? current_user.id : false %>,
-                'name': $('#hydrant_name').val()
-              }
-            }, function(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)
-              );
-              marker.setIcon(image);
-              marker.setAnimation(google.maps.Animation.BOUNCE);
             });
-            return false;
+            infoWindow.open(map, marker);
+            activeHydrantId = hydrantId;
+            activeMarker = marker;
+            activeInfoWindow = infoWindow;
           });
-          $('.combo_form').submit(function() {
-            var errors = []
-            if(!/[\w\.%\+\-]+@[\w\-]+\.+[\w]{2,}/.test($('#user_email').val())) {
-              errors.push($('#user_email'));
-              $('#user_email_label').addClass('error', 500);
-              $('#user_email').addClass('error', 500);
-            } else {
-              $('#user_email_label').removeClass('error');
-              $('#user_email').removeClass('error');
-            }
-            if(!$(this).data('state') || $(this).data('state') === 'user_new') {
-              if($('#user_name').val() === '') {
-                errors.push($('#user_name'));
-                $('#user_name_label').addClass('error', 500);
-                $('#user_name').addClass('error', 500);
-              } else {
-                $('#user_name_label').removeClass('error');
-                $('#user_name').removeClass('error');
-              }
-              if($('#user_password_confirmation').val().length < 6 || $('#user_password_confirmation').val().length > 20) {
-                errors.push($('#user_password_confirmation'));
-                $('#user_password_confirmation_label').addClass('error', 500);
-                $('#user_password_confirmation').addClass('error', 500);
-              } else {
-                $('#user_password_confirmation_label').removeClass('error');
-                $('#user_password_confirmation').removeClass('error');
-              }
-              if(errors.length > 0) {
-                errors[0].focus();
-              } else {
-                $.post('<%= user_registration_path :format => "json" %>', {
-                  'commit': $('#user_new_submit').val(),
-                  'utf8': '✓',
-                  'authenticity_token': $('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);
-                    }
-                    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 {
-                    $('.combo_form').slideUp();
-                    $('.adoption_form').slideDown(function() {
-                      $('#hydrant_user_id').val(data.user.id);
-                    });
-                  }
-                });
-              }
-            } else if($(this).data('state') === 'user_existing') {
-              if($('#user_password').val().length < 6 || $('#user_password').val().length > 20) {
-                errors.push($('#user_password'));
-                $('#user_password_label').addClass('error', 500);
-                $('#user_password').addClass('error', 500);
-              } else {
-                $('#user_password_label').removeClass('error');
-                $('#user_password').removeClass('error');
-              }
-              if(errors.length > 0) {
-                errors[0].focus();
-              } else {
-                $.post('<%= user_session_path :format => "json" %>', {
-                  'commit': $('#user_existing_submit').val(),
-                  'utf8': '✓',
-                  'authenticity_token': $('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').focus();
-                    $('#user_password_label').addClass('error', 500);
-                    $('#user_password').addClass('error', 500);
-                  } else {
-                    $('.combo_form').slideUp();
-                    $('.adoption_form').slideDown(function() {
-                      $('#hydrant_user_id').val(data.user.id);
-                    });
-                  }
-                });
-              }
-            } else if($(this).data('state') === 'user_forgot_password') {
-              if(errors.length > 0) {
-                errors[0].focus();
-              } else {
-                $.post('<%= user_password_path :format => "json" %>', {
-                  'commit': $('#user_forgot_password_submit').val(),
-                  'utf8': '✓',
-                  'authenticity_token': $('input[name="authenticity_token"]').val(),
-                  'user': {
-                    'email': $('#user_email').val()
-                  }
-                }, function(data) {
-                  if(data.errors) {
-                    $('#user_email').focus();
-                    $('#user_email_label').addClass('error', 500);
-                    $('#user_email').addClass('error', 500);
-                  } else {
-                    $('#user_forgot_password_fields').slideUp();
-                    $('#user_existing_fields').slideDown();
-                  }
-                });
-              }
-            }
-            return false;
-          });
-          openInfoWindow = infoWindow;
         });
       }
       <% @hydrants.each do |hydrant| %>
       point = new google.maps.LatLng(<%= hydrant.lat %>, <%= hydrant.lng %>);
-      color = <%= hydrant.user_id ? "'/images/markers/green.png'" : "'/images/markers/red.png'" %>;
+      color = '/images/markers/<%= hydrant.user_id ? "green" : "red" %>.png';
-      <% if user = hydrant.user %>
+      addMarker(<%= hydrant.id %>, point, color);
-      contentString = '<%= render(:partial => "user_profile", :locals => {:user => user}).gsub("\n", "") %>'
-      <% else %>
-        <% if user_signed_in? %>
-          contentString = '<h2>Adopt this Hydrant</h2><%= render(:partial => "adoption_form", :locals => {:hydrant => hydrant}).gsub("\n", "") %>'
-        <% else %>
-          contentString = '<h2>Adopt this Hydrant</h2>' + comboFormString + '<%= render(:partial => "adoption_form", :locals => {:hydrant => hydrant}).gsub("\n", "") %>'
-        <% end %>
       <% end %>
-      addMarker(point, color, contentString);
+      $('#combo_form input[type="radio"]').live('click', function() {
-      <% end %>
-      $('#location_form').submit(function() {
-        if($('#address').val() === '') {
-          $('#address').focus();
-          $('#address_label').addClass('error', 500);
-          $('#address').addClass('error', 500);
-          return false;
-        }
-      });
-      $('.combo_form input[type="radio"]').live('click', function() {
         var self = $(this);
         if('new' == self.val()) {
           $('#user_forgot_password_fields').slideUp();
-          $('#user_existing_fields').slideUp();
+          $('#sign_in_fields').slideUp();
-          $('#user_new_fields').slideDown();
+          $('#sign_up_fields').slideDown();
-          $('.combo_form').data('state', 'user_new');
+          $('#combo_form').data('state', 'sign_up');
         } else if('existing' == self.val()) {
-          $('#user_new_fields').slideUp();
+          $('#sign_up_fields').slideUp();
-          $('#user_existing_fields').slideDown(function() {
+          $('#sign_in_fields').slideDown(function() {
-          $('.combo_form').data('state', 'user_existing');
+          $('#combo_form').data('state', 'sign_in');
             $('#user_forgot_password_link').click(function() {
-              $('#user_existing_fields').slideUp();
+              $('#sign_in_fields').slideUp();
               $('#user_forgot_password_fields').slideDown(function() {
                 $('#user_remembered_password').click(function() {
                   $('#user_forgot_password_fields').slideUp();
-                  $('#user_existing_fields').slideDown();
+                  $('#sign_in_fields').slideDown();
-                  $('.combo_form').data('state', 'user_existing');
+                  $('#combo_form').data('state', 'sign_in');
                 });
               });
-              $('.combo_form').data('state', 'user_forgot_password');
+              $('#combo_form').data('state', 'user_forgot_password');
             });
           });
         }
       });
-    })
+      $('#combo_form').live('submit', function() {
+        var errors = []
+        if(!/[\w\.%\+\]+@[\w\]+\.+[\w]{2,}/.test($('#user_email').val())) {
+          errors.push($('#user_email'));
+          $('#user_email_label').addClass('error', 500);
+          $('#user_email').addClass('error', 500);
+        } else {
+          $('#user_email_label').removeClass('error');
+          $('#user_email').removeClass('error');
+        }
+        if(!$(this).data('state') || $(this).data('state') === 'sign_up') {
+          if($('#user_name').val() === '') {
+            errors.push($('#user_name'));
+            $('#user_name_label').addClass('error', 500);
+            $('#user_name').addClass('error', 500);
+          } else {
+            $('#user_name_label').removeClass('error');
+            $('#user_name').removeClass('error');
+          }
+          if($('#user_password_confirmation').val().length < 6 || $('#user_password_confirmation').val().length > 20) {
+            errors.push($('#user_password_confirmation'));
+            $('#user_password_confirmation_label').addClass('error', 500);
+            $('#user_password_confirmation').addClass('error', 500);
+          } else {
+            $('#user_password_confirmation_label').removeClass('error');
+            $('#user_password_confirmation').removeClass('error');
+          }
+          if(errors.length > 0) {
+            errors[0].focus();
+          } else {
+            $.post('<%= user_registration_path :format => "json" %>', {
+              'commit': $('#sign_up_submit').val(),
+              'utf8': '✓',
+              'authenticity_token': $('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);
+                }
+                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 {
+                $.get('<%= forms_path %>', {
+                  'hydrant_id': activeHydrantId
+                }, function(data) {
+                  activeInfoWindow.setContent(data);
+                });
+              }
+            });
+          }
+        } else if($(this).data('state') === 'sign_in') {
+          if($('#user_password').val().length < 6 || $('#user_password').val().length > 20) {
+            errors.push($('#user_password'));
+            $('#user_password_label').addClass('error', 500);
+            $('#user_password').addClass('error', 500);
+          } else {
+            $('#user_password_label').removeClass('error');
+            $('#user_password').removeClass('error');
+          }
+          if(errors.length > 0) {
+            errors[0].focus();
+          } else {
+            $.post('<%= user_session_path :format => "json" %>', {
+              'commit': $('#sign_in_submit').val(),
+              'utf8': '✓',
+              'authenticity_token': $('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').focus();
+                $('#user_password_label').addClass('error', 500);
+                $('#user_password').addClass('error', 500);
+              } else {
+                $.get('<%= forms_path %>', {
+                  'hydrant_id': activeHydrantId
+                }, function(data) {
+                  activeInfoWindow.setContent(data);
+                });
+              }
+            });
+          }
+        } else if($(this).data('state') === 'user_forgot_password') {
+          if(errors.length > 0) {
+            errors[0].focus();
+          } else {
+            $.post('<%= user_password_path :format => "json" %>', {
+              'commit': $('#user_forgot_password_submit').val(),
+              'utf8': '✓',
+              'authenticity_token': $('input[name="authenticity_token"]').val(),
+              'user': {
+                'email': $('#user_email').val()
+              }
+            }, function(data) {
+              if(data.errors) {
+                $('#user_email').focus();
+                $('#user_email_label').addClass('error', 500);
+                $('#user_email').addClass('error', 500);
+              } else {
+                $('#user_forgot_password_fields').slideUp();
+                $('#sign_in_fields').slideDown();
+              }
+            });
+          }
+        }
+        return false;
+      });
+      $('#adoption_form').live('submit', function() {
+        $.post('<%= hydrant_path :format => "json" %>', {
+          'id': $('#hydrant_id').val(),
+          'commit': $('#adoption_form_submit').val(),
+          'utf8': '✓',
+          'authenticity_token': $('input[name="authenticity_token"]').val(),
+          '_method': 'put',
+          'hydrant': {
+            'user_id': $('#hydrant_user_id').val(),
+            'name': $('#hydrant_name').val()
+          }
+        }, function(data) {
+          $.get('<%= forms_path %>', {
+            '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;
+      });
+    });
     </script>
     <%= csrf_meta_tag %>
     <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />

app/views/main/_user_profile.html.erb

@@ -1,4 +0,0 @@
-<h2>Adopted by <%= user.name %></h2>
-<% if user.organization %>
-<h3>of <%= user.organization %></h3>
-<% end %>

app/views/main/index.html.erb

@@ -19,3 +19,15 @@
 </div>
 <div id="map_canvas">
 </div>
+<script type="text/javascript">
+$(function() {
+  $('#location_form').submit(function() {
+    if($('#address').val() === '') {
+      $('#address').focus();
+      $('#address_label').addClass('error', 500);
+      $('#address').addClass('error', 500);
+      return false;
+    }
+  });
+});
+</script>

config/routes.rb

@@ -6,6 +6,7 @@ AdoptAHydrant::Application.routes.draw do
   }
   resource :user
   resource :hydrant
-  get 'sitemap(.format)' => 'sitemaps#index', :as => 'sitemap'
+  get 'sitemap' => 'sitemaps#index', :as => 'sitemap'
+  get 'forms' => 'forms#index', :as => 'forms'
   root :to => 'main#index'
 end