212 lines
8.6 KiB
Plaintext
212 lines
8.6 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.') %>
|
||
<% provide(:hero_title, 'JamKazam has spent the last 6 years building the best platform in the world to let musicians play together live and in sync over the Internet.') %>
|
||
|
||
<div class="row">
|
||
|
||
<div class="col-md-8 col-sm-12">
|
||
<strong>Today tens of thousands of musicians use JamKazam to:</strong>
|
||
<ul>
|
||
<li>Rehearse with their bands from home</li>
|
||
<li>Join open sessions to meet & play with new friends</li>
|
||
<li>Co-write music live & interactively vs. trading files</li>
|
||
<li>Record session performances</li>
|
||
<li>Live broadcast session performances thru YouTube & Facebook</li>
|
||
|
||
</ul>
|
||
|
||
<p style="font-size:16px">Check out some examples of groups playing together on JamKazam:</p>
|
||
<iframe width="625" height="400" src="https://www.youtube.com/embed/euxDykIqUdo" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
|
||
|
||
</div>
|
||
|
||
|
||
<div class="col-md-4 col-sm-12">
|
||
|
||
<p>Sign up for a free account now and get <a href="https://jamkazam.freshdesk.com/support/solutions/articles/66000122535-what-are-jamkazam-s-free-vs-premium-features-">Gold premium subscription</a> features FREE for 30 days! After 30 days you can continue playing on our free plan or select a premium plan – whatever is right for you. When you sign up, we’ll send you an email with instructions on how to set up and play on the platform.</p>
|
||
|
||
<%= errors_for @user %>
|
||
<%= form_for(@user, :url => @signup_postback, :method => :post, html: { id: 'signup' }) do |f| %>
|
||
|
||
<div class="row mb-2">
|
||
<div class="col-md-6 col-sm-12">
|
||
<%= f.label :first_name, "First Name:" %>
|
||
<%= f.text_field :first_name %>
|
||
</div>
|
||
<div class="col-md-6 col-sm-12">
|
||
<%= f.label :last_name, "Last Name:" %>
|
||
<%= f.text_field :last_name %>
|
||
</div>
|
||
</div>
|
||
<div class="row mb-2">
|
||
<div class="col-12">
|
||
<%= f.label :email, "Email Address:" %>
|
||
<%= f.text_field :email %>
|
||
</div>
|
||
</div>
|
||
<div class="row mb-2">
|
||
<div class="col-md-12">
|
||
<%= f.label :password, "Choose a Password:" %>
|
||
<%= f.password_field :password %>
|
||
</div>
|
||
</div>
|
||
<div class="row mb-2">
|
||
<div class="col-md-12">
|
||
<%= f.label :password_confirmation, "Verify Password:" %>
|
||
<%= f.password_field :password_confirmation %>
|
||
</div>
|
||
</div>
|
||
<div class="row mt-3">
|
||
<div class="col-12">
|
||
<%= f.check_box :terms_of_service %> <label for="user_terms_of_service" style="font-size: 90%">I agree to the JamKazam <%= link_to "terms of service", corp_terms_path, :rel => "external" %></label>
|
||
</div>
|
||
</div>
|
||
<div class="row mb-2">
|
||
<div class="col-12 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%>" data-callback="recaptcha_success" data-expired-callback="recaptcha_expired">
|
||
</div>
|
||
<% end %>
|
||
</div>
|
||
</div>
|
||
<div class="row mb-2">
|
||
<div class="col-12"><br />
|
||
<button id="create-account-submit" onClick="$document.forms['signup'].submit()" style="width:100%">Sign Up for JamKazam</button>
|
||
</div>
|
||
</div>
|
||
<% end %>
|
||
|
||
</div>
|
||
</div>
|
||
|
||
<%= content_for(:scripts) do %>
|
||
<script type="text/javascript">
|
||
//window.signup.handle_location_changes()
|
||
|
||
// window.signup.handle_register_as_changes()
|
||
|
||
function recaptcha_success(response) {
|
||
//$("#create-account-submit").removeClass("disabled")
|
||
$("#create-account-submit").prop("disabled", false)
|
||
}
|
||
|
||
function recaptcha_expired(response) {
|
||
//$("#create-account-submit").addClass("disabled")
|
||
$("#create-account-submit").prop("disabled", true)
|
||
}
|
||
|
||
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())
|
||
// })
|
||
// }
|
||
// if(window.gon) {
|
||
// var $radios = $('input:radio[name="jam_ruby_user[desired_plan_code]"]');
|
||
// if(gon.plan_code) {
|
||
// $radios.filter(gon.plan_code, true)
|
||
// }
|
||
// else {
|
||
// $radios.filter('[value="<%= @plan_code %>"]').prop('checked', true)
|
||
// }
|
||
// }
|
||
|
||
// 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.after("<div class='error-text'>" + terms_of_service + "</div>")
|
||
}
|
||
}
|
||
|
||
</script>
|
||
<% end %>
|