270 lines
10 KiB
Plaintext
270 lines
10 KiB
Plaintext
<% provide(:page_name, 'register') %>
|
|
<% provide(:title, 'Register') %>
|
|
<% provide(:description, 'Sign up for your JamKazam account to play music with others online in real time and network with musicians.') %>
|
|
|
|
<div class="content-wrapper register-page">
|
|
<h2 class="create-account-header"><div class="badge-number">1</div>Create your free JamKazam account</h2>
|
|
|
|
<%= form_for(@user, :url => @signup_postback, :method => :post) do |f| %>
|
|
|
|
<div class="register-left left w45">
|
|
<div class="register-container">
|
|
<div class="register-as">
|
|
Register as a:
|
|
<%= f.radio_button :musician, true, :class => "register-as register-musician" %>
|
|
Musician
|
|
|
|
<%= f.radio_button :musician, false, :class => "register-as register-fan" %>
|
|
Fan
|
|
</div>
|
|
|
|
<div class="field first_name">
|
|
<%= f.label :first_name, "First Name:" %>
|
|
<%= f.text_field :first_name %>
|
|
</div>
|
|
|
|
<div class="field last_name right-side">
|
|
<%= f.label :last_name, "Last Name:" %>
|
|
<%= f.text_field :last_name %>
|
|
</div>
|
|
|
|
<br clear="all"/>
|
|
|
|
<div class="field email">
|
|
<%= f.label :email, "Email Address:" %>
|
|
<%= f.text_field :email %>
|
|
</div>
|
|
|
|
<div class="field country right-side">
|
|
<%= f.label :country, "Country:" %>
|
|
<select id="country_select" name="jam_ruby_user[country]" autocomplete="off" class="easydropdown">
|
|
<option class="label" value="" <%= (@location.nil? || @location[:country].nil? || @location[:country].blank?) ? "selected" : "" %>>Select Country</option>
|
|
<% @countriesx.each do |country| %>
|
|
<% unless country[:countrycode].blank? %>
|
|
<option value="<%= country[:countrycode] %>" <%= @location[:country] == country[:countrycode] ? "selected" : "" %>><%= country[:countryname] %></option>
|
|
<% end %>
|
|
<% end %>
|
|
</select>
|
|
</div>
|
|
|
|
<br clear="all"/>
|
|
|
|
<div class="field state">
|
|
<%= f.label :state, "State/Province:" %>
|
|
<select id="region_select" name="jam_ruby_user[state]" autocomplete="off" class="easydropdown">
|
|
<option value="" <%= @location[:state].blank? ? "selected" : "" %>>State/Province</option>
|
|
<% @regions.each do |region| %>
|
|
<% unless region.blank? %>
|
|
<option value="<%= region[:region] %>" <%= @location[:state] == region[:region] ? "selected" : "" %>><%= region[:name] %></option>
|
|
<% end %>
|
|
<% end %>
|
|
|
|
</select>
|
|
</div>
|
|
|
|
<div class="field city right-side">
|
|
<%= f.label :state, "City:" %>
|
|
<select id="city_select" name="jam_ruby_user[city]" autocomplete="off" class="easydropdown">
|
|
<option value="" <%= @location[:city].blank? ? "selected" : "" %>>Select City</option>
|
|
<% @cities.each do |city| %>
|
|
<% unless city.blank? %>
|
|
<option value="<%= city %>" <%= @location[:city] == city ? "selected" : "" %>><%= city %></option>
|
|
<% end %>
|
|
<% end %>
|
|
|
|
</select>
|
|
</div>
|
|
|
|
<br clear="all"/>
|
|
|
|
<div class="field password">
|
|
<%= f.label :password, "Choose a Password:" %>
|
|
<%= f.password_field :password %>
|
|
</div>
|
|
|
|
<div class="field password_confirmation right-side">
|
|
<%= f.label :password_confirmation, "Verify Password:" %>
|
|
<%= f.password_field :password_confirmation %>
|
|
</div>
|
|
|
|
<br clear="all"/>
|
|
</div>
|
|
<!-- end left column -->
|
|
</div>
|
|
|
|
<!-- sign in right column -->
|
|
<div class="register-right right w45"><br/>
|
|
|
|
<div class="ftue-instrumentlist-wrapper">
|
|
<label class="instruments">What instruments can you play?</label>
|
|
|
|
<div class="ftue-instrumentlist">
|
|
<table id="instrument_selector" class="instrument_selector" width="100%" cellpadding="0" cellspacing="6">
|
|
<% Instrument.standard_list.each do |instrument| %>
|
|
<tr>
|
|
<td>
|
|
<input id="<%= instrument.id.gsub(" ", "") %>_checkbox" name="jam_ruby_user[instruments][<%= instrument.id %>][selected]" type="checkbox"/><%= instrument.description %>
|
|
</td>
|
|
<td align="right" width="50%">
|
|
<select id="<%= instrument.id.gsub(" ", "") %>_proficiency" name="jam_ruby_user[instruments][<%= instrument.id %>][proficiency]" class='proficiency_selector easydropdown'>
|
|
<option value="1">Beginner</option>
|
|
<option value="2">Intermediate</option>
|
|
<option value="3">Expert</option>
|
|
</select></td>
|
|
</tr>
|
|
<% end %>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="field terms_of_service">
|
|
<small>
|
|
<%= f.check_box :terms_of_service %>
|
|
<span>I have read and agree to the JamKazam <%= link_to "terms of service", corp_terms_path, :rel => "external" %>
|
|
.</span>
|
|
</small>
|
|
</div>
|
|
|
|
<div class="field recaptcha">
|
|
<% if Rails.application.config.recaptcha_enable %>
|
|
<div id="recaptcha_select" name="recaptcha_response_field" class="g-recaptcha" data-sitekey="<%=Rails.application.config.recaptcha_public_key%>">
|
|
</div>
|
|
<% end %>
|
|
</div>
|
|
|
|
<!--
|
|
<img src="images/content/captcha.png" width="152" height="50" align="left" class="mr10" /><small>Enter the characters from the box to the left:<br />
|
|
<input type="text" /> <br clear="all" /><br />
|
|
-->
|
|
|
|
<div class="actions">
|
|
<%= f.submit "CREATE ACCOUNT", class: "button-orange" %>
|
|
<%= link_to "CANCEL", root_path, :class=>'button-grey' %>
|
|
</div>
|
|
<br style="clear:both;"/><br/>
|
|
<!--<a href="/auth/facebook" class="right"><img src="/fb-signup-button.png"></a> -->
|
|
|
|
</div>
|
|
<br clear="all" />
|
|
<!-- end right column -->
|
|
|
|
<% end %>
|
|
|
|
</div>
|
|
<!-- end inner -->
|
|
|
|
<!-- end overlay content -->
|
|
|
|
|
|
|
|
|
|
<script type="text/javascript">
|
|
window.signup.handle_location_changes()
|
|
|
|
window.signup.handle_register_as_changes()
|
|
|
|
function get_first_error(field) {
|
|
if (errors[field] && errors[field].length > 0) {
|
|
return errors[field][0]
|
|
}
|
|
else {
|
|
return null;
|
|
}
|
|
}
|
|
|
|
// populate musician instruments from previous submit, if applicable
|
|
if (window.gon && gon.musician_instruments) {
|
|
$(gon.musician_instruments).each(function (index, value) {
|
|
$('#' + value.instrument_id.replace(" ", "") + "_checkbox").attr("checked", true);
|
|
$('#' + value.instrument_id.replace(" ", "") + "_proficiency").val(value.proficiency_level.toString())
|
|
})
|
|
}
|
|
|
|
// show signup errors, if any
|
|
if (window.gon && gon.signup_errors) {
|
|
var errors =
|
|
<%= @user.errors.to_json.html_safe %>
|
|
|
|
var email = get_first_error("email")
|
|
var first_name = get_first_error("first_name")
|
|
var last_name = get_first_error("last_name")
|
|
var musician_instruments = get_first_error("musician_instruments")
|
|
var password = get_first_error("password")
|
|
var password_confirmation = get_first_error("password_confirmation")
|
|
var terms_of_service = get_first_error("terms_of_service")
|
|
var country = get_first_error("country")
|
|
var state = get_first_error("state")
|
|
var city = get_first_error("city")
|
|
var recaptcha = get_first_error("recaptcha")
|
|
|
|
|
|
if (email) {
|
|
var emailInput = $('#jam_ruby_user_email');
|
|
emailInput.closest('div.field').addClass('error')
|
|
emailInput.after("<div class='error-text'>" + email + "</div>")
|
|
}
|
|
|
|
if (first_name) {
|
|
var firstNameInput = $('#jam_ruby_user_first_name');
|
|
firstNameInput.closest('div.field').addClass('error')
|
|
firstNameInput.after("<div class='error-text'>" + first_name + "</div>")
|
|
}
|
|
|
|
if (last_name) {
|
|
var lastNameInput = $('#jam_ruby_user_last_name');
|
|
lastNameInput.closest('div.field').addClass('error')
|
|
lastNameInput.after("<div class='error-text'>" + last_name + "</div>")
|
|
}
|
|
|
|
if (country) {
|
|
var countryInput = $('#country_select');
|
|
countryInput.closest('div.field').addClass('error')
|
|
countryInput.after("<div class='error-text'>" + country + "</div>")
|
|
}
|
|
|
|
if (state) {
|
|
var stateInput = $('#region_select');
|
|
stateInput.closest('div.field').addClass('error')
|
|
stateInput.after("<div class='error-text'>" + state + "</div>")
|
|
}
|
|
|
|
if (city) {
|
|
var cityInput = $('#city_select');
|
|
cityInput.closest('div.field').addClass('error')
|
|
cityInput.after("<div class='error-text'>" + city + "</div>")
|
|
}
|
|
|
|
if (recaptcha) {
|
|
var recaptchaInput = $('#recaptcha_select');
|
|
recaptchaInput.closest('div.field').addClass('error')
|
|
recaptchaInput.after("<div class='error-text'>" + recaptcha + "</div>")
|
|
}
|
|
|
|
if (musician_instruments) {
|
|
var musicianInstrumentsInput = $('#instrument_selector');
|
|
musicianInstrumentsInput.closest('div.ftue-instrumentlist-wrapper').addClass('error')
|
|
musicianInstrumentsInput.closest('div.ftue-instrumentlist').after("<div class='error-text'>" + musician_instruments + "</div>")
|
|
}
|
|
|
|
if (password) {
|
|
var passwordInput = $('#jam_ruby_user_password');
|
|
passwordInput.closest('div.field').addClass('error')
|
|
passwordInput.after("<div class='error-text'>" + password + "</div>")
|
|
}
|
|
|
|
if (password_confirmation) {
|
|
var passwordConfirmationInput = $('#jam_ruby_user_password_confirmation');
|
|
passwordConfirmationInput.closest('div.field').addClass('error')
|
|
passwordConfirmationInput.after("<div class='error-text'>" + password_confirmation + "</div>")
|
|
}
|
|
|
|
if (terms_of_service) {
|
|
var termsOfServiceInput = $('#jam_ruby_user_terms_of_service');
|
|
termsOfServiceInput.closest('small').addClass('error')
|
|
// termsOfServiceInput.closest('small').after("<div class='error-text'>" + terms_of_service + "</div>")
|
|
}
|
|
}
|
|
|
|
</script>
|
|
|