choteaumt
/
adopt-a-hydrant
mirror of https://github.com/choteaumt/adopt-a-hydrant.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

[Delivers #10897619] Serve all forms dynamically

This commit is contained in:
Erik Michaels-Ober 2011-03-17 11:46:06 -07:00
parent 12cef81109
commit 8f61d2d207
11 changed files with 254 additions and 221 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
app/controllers/forms_controller.rb Normal file
View File

@ -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

2
app/controllers/hydrants_controller.rb
View File

@ -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

5
app/models/hydrant.rb
View File

@ -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

6
app/views/main/_adoption_form.html.erb → app/views/forms/_adoption_form.html.erb
View File

@ -1,8 +1,8 @@
<% style = user_signed_in? ? {} : {:style => "display: none;"}%>
<%= form_for hydrant, :remote => true, :html => {:class => "adoption_form"}.merge(style) do |f| %>
<%= form_for @hydrant, :remote => true, :html => {:id => "adoption_form"} 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" %>

15
app/views/main/_combo_form.html.erb → app/views/forms/_combo_form.html.erb
View File

@ -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 "existing", radio_button_tag("user", "existing").html_safe + "I already signed up" %><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'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;">

1
app/views/forms/_thank_you.html.erb Normal file
View File

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

2
app/views/forms/_user_profile.html.erb Normal file
View File

@ -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 %>

407
app/views/layouts/application.html.erb
View File

@ -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 openInfoWindow;
function addMarker(point, color, contentString) {
var activeHydrantId;
var activeMarker;
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) {
openInfoWindow.close();
if(activeInfoWindow) {
activeInfoWindow.close();
}
infoWindow.open(map, marker);
$('.adoption_form').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() || <%= 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);
$.get('<%= forms_path %>', {
'hydrant_id': hydrantId
}, function(data) {
var infoWindow = new google.maps.InfoWindow({
content: data,
maxWidth: 350
});
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'" %>;
<% if user = hydrant.user %>
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 %>
color = '/images/markers/<%= hydrant.user_id ? "green" : "red" %>.png';
addMarker(<%= hydrant.id %>, point, color);
<% end %>
addMarker(point, color, contentString);
<% 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() {
$('#combo_form input[type="radio"]').live('click', function() {
var self = $(this);
if('new' == self.val()) {
$('#user_forgot_password_fields').slideUp();
$('#user_existing_fields').slideUp();
$('#user_new_fields').slideDown();
$('.combo_form').data('state', 'user_new');
$('#sign_in_fields').slideUp();
$('#sign_up_fields').slideDown();
$('#combo_form').data('state', 'sign_up');
} else if('existing' == self.val()) {
$('#user_new_fields').slideUp();
$('#user_existing_fields').slideDown(function() {
$('.combo_form').data('state', 'user_existing');
$('#sign_up_fields').slideUp();
$('#sign_in_fields').slideDown(function() {
$('#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();
$('.combo_form').data('state', 'user_existing');
$('#sign_in_fields').slideDown();
$('#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" />

4
app/views/main/_user_profile.html.erb
View File

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

12
app/views/main/index.html.erb
View File

@ -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>

3
config/routes.rb
View File

@ -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