Skip to content

E
edx-platform
Commit c4aa758d by Douglas Hall
Options

Merge pull request #11155 from edx/douglashall/HOL-18/register_form_override 

HOL-18 Register form microsite override
parents 82768d96 c2058dbe
Showing with 271 additions and 259 deletions
lms/templates/register-form.html 0 → 100644
<%!
import third_party_auth
from third_party_auth import pipeline, provider
from django.utils.translation import ugettext as _
from django_countries import countries
from student.models import UserProfile
%>
<%namespace file='main.html' import="stanford_theme_enabled"/>
<input type="hidden" name="csrfmiddlewaretoken" value="${ csrf_token }">
<!-- status messages -->
<div role="alert" class="status message">
<h3 class="message-title">${_("We're sorry, but this version of your browser is not supported. Try again using a different browser or a newer version of your browser.")}</h3>
</div>
<div role="alert" class="status message submission-error" tabindex="-1">
<h3 class="message-title">${_("The following errors occurred while processing your registration:")} </h3>
<ul class="message-copy"> </ul>
</div>
% if third_party_auth.is_enabled():
% if not running_pipeline:
<div class="form-actions form-third-party-auth">
% for enabled in provider.Registry.accepting_logins():
## Translators: provider_name is the name of an external, third-party user authentication service (like Google or LinkedIn).
<button type="submit" class="button button-primary button-${enabled.provider_id} register-${enabled.provider_id}" onclick="thirdPartySignin(event, '${pipeline_urls[enabled.provider_id]}');"><span class="icon fa ${enabled.icon_class}"></span>${_('Sign up with {provider_name}').format(provider_name=enabled.name)}</button>
% endfor
</div>
<span class="deco-divider">
## Developers: this is a sentence fragment, which is usually frowned upon. The design of the pags uses this fragment to provide an "else" clause underneath a number of choices. It's OK to leave it.
## Translators: this is the last choice of a number of choices of how to log in to the site.
<span class="copy">${_('or')}</span>
</span>
<p class="instructions">
${_('Create your own {platform_name} account below').format(platform_name=platform_name)}
<span class="note">${_('Required fields are noted by <strong class="indicator">bold text and an asterisk (*)</strong>.')}</span>
</p>
% else:
<p class="instructions">
## Translators: selected_provider is the name of an external, third-party user authentication service (like Google or LinkedIn).
${_("You've successfully signed in with {selected_provider}.").format(selected_provider='<strong>%s</strong>' % selected_provider)}<br />
${_("We just need a little more information before you start learning with {platform_name}.").format(platform_name=settings.PLATFORM_NAME)}
</p>
% endif
% else:
<p class="instructions">
${_("Please complete the following fields to register for an account. ")}<br />
${_('Required fields are noted by <strong class="indicator">bold text and an asterisk (*)</strong>.')}
</p>
% endif
<div class="group group-form group-form-requiredinformation">
<h2 class="sr">${_('Required Information')}</h2>
% if has_extauth_info is UNDEFINED:
<ol class="list-input">
<li class="field required text" id="field-email">
<label for="email">${_('E-mail')}</label>
<input class="" id="email" type="email" name="email" value="${email}" placeholder="${_('example: username@domain.com')}" required aria-required="true" />
</li>
<li class="field required text" id="field-name">
<label for="name">${_('Full Name')}</label>
<input id="name" type="text" name="name" value="${name}" placeholder="${_('example: Jane Doe')}" required aria-required="true" aria-describedby="name-tip" />
<span class="tip tip-input" id="name-tip">${_("Your legal name, used for any certificates you earn.")}</span>
</li>
<li class="field required text" id="field-username">
<label for="username">${_('Public Username')}</label>
<input id="username" type="text" name="username" value="${username}" placeholder="${_('example: JaneDoe')}" required aria-required="true" aria-describedby="username-tip"/>
<span class="tip tip-input" id="username-tip">${_('Will be shown in any discussions or forums you participate in')} <strong>(${_('cannot be changed later')})</strong></span>
</li>
% if third_party_auth.is_enabled() and running_pipeline:
<li class="is-disabled field optional password" id="field-password" hidden>
<label for="password">${_('Password')}</label>
<input id="password" type="password" name="password" value="" disabled required aria-required="true" />
</li>
% else:
<li class="field required password" id="field-password">
<label for="password">${_('Password')}</label>
<input id="password" type="password" name="password" value="" required aria-required="true" />
</li>
% endif
</ol>
% else:
<div class="message">
<h3 class="message-title">${_("Welcome {username}").format(username=extauth_id)}</h3>
<p class="message-copy">${_("Enter a Public Display Name:")}</p>
</div>
<ol class="list-input">
% if ask_for_email:
<li class="field required text" id="field-email">
<label for="email">${_("E-mail")}</label>
<input class="" id="email" type="email" name="email" value="" placeholder="${_('example: username@domain.com')}" />
</li>
% endif
<li class="field required text" id="field-username">
<label for="username">${_('Public Display Name')}</label>
<input id="username" type="text" name="username" value="${extauth_username}" placeholder="${_('example: JaneDoe')}" required aria-required="true" aria-describedby="username-tip" />
<span class="tip tip-input" id="id="username-tip>${_('Will be shown in any discussions or forums you participate in')} <strong>(${_('cannot be changed later')})</strong></span>
</li>
% if ask_for_fullname:
<li class="field required text" id="field-name">
<label for="name">${_('Full Name')}</label>
<input id="name" type="text" name="name" value="" placeholder="$_('example: Jane Doe')}" aria-describedby="name-tip" />
<span class="tip tip-input" id="name-tip">${_("Your legal name, used for any certificates you earn.")}</span>
</li>
% endif
</ol>
% endif
</div>
<div class="group group-form group-form-secondary group-form-personalinformation">
<h2 class="sr">${_("Additional Personal Information")}</h2>
<ol class="list-input">
% if settings.REGISTRATION_EXTRA_FIELDS['city'] != 'hidden':
<li class="field ${settings.REGISTRATION_EXTRA_FIELDS['city']} text" id="field-city">
<label for="city">${_('City')}</label>
<input id="city" type="text" name="city" value="" placeholder="${_('example: New York')}" aria-describedby="city-tip" ${'required aria-required="true"' if settings.REGISTRATION_EXTRA_FIELDS['city'] == 'required' else ''} />
</li>
% endif
% if settings.REGISTRATION_EXTRA_FIELDS['country'] != 'hidden':
<li class="field-group">
<div class="field ${settings.REGISTRATION_EXTRA_FIELDS['country']} select" id="field-country">
<label for="country">${_("Country")}</label>
<select id="country" name="country" ${'required aria-required="true"' if settings.REGISTRATION_EXTRA_FIELDS['country'] == 'required' else ''}>
<option value="">--</option>
%for code, country_name in countries:
<option value="${code}">${ unicode(country_name) }</option>
%endfor
</select>
</div>
</li>
% endif
% if settings.REGISTRATION_EXTRA_FIELDS['level_of_education'] != 'hidden':
<li class="field-group field-education-level">
<div class="field ${settings.REGISTRATION_EXTRA_FIELDS['level_of_education']} select" id="field-education-level">
<label for="education-level">${_("Highest Level of Education Completed")}</label>
<select id="education-level" name="level_of_education" ${'required aria-required="true"' if settings.REGISTRATION_EXTRA_FIELDS['level_of_education'] == 'required' else ''}>
<option value="">--</option>
%for code, ed_level in UserProfile.LEVEL_OF_EDUCATION_CHOICES:
<option value="${code}">${_(ed_level)}</option>
%endfor
</select>
</div>
</li>
% endif
% if settings.REGISTRATION_EXTRA_FIELDS['gender'] != 'hidden':
<li class="field-group field-gender">
<div class="field ${settings.REGISTRATION_EXTRA_FIELDS['gender']} select" id="field-gender">
<label for="gender">${_("Gender")}</label>
<select id="gender" name="gender" ${'required aria-required="true"' if settings.REGISTRATION_EXTRA_FIELDS['gender'] == 'required' else ''}>
<option value="">--</option>
%for code, gender in UserProfile.GENDER_CHOICES:
<option value="${code}">${_(gender)}</option>
%endfor
</select>
</div>
</li>
% endif
% if settings.REGISTRATION_EXTRA_FIELDS['year_of_birth'] != 'hidden':
<li class="field-group field-yob">
<div class="field ${settings.REGISTRATION_EXTRA_FIELDS['year_of_birth']} select" id="field-yob">
<label for="yob">${_("Year of Birth")}</label>
<select id="yob" name="year_of_birth" ${'required aria-required="true"' if settings.REGISTRATION_EXTRA_FIELDS['year_of_birth'] == 'required' else ''}>
<option value="">--</option>
%for year in UserProfile.VALID_YEARS:
<option value="${year}">${year}</option>
%endfor
</select>
</div>
% endif
</li>
</ol>
</div>
<div class="group group-form group-form-personalinformation2">
<ol class="list-input">
% if settings.REGISTRATION_EXTRA_FIELDS['mailing_address'] != 'hidden':
<li class="field ${settings.REGISTRATION_EXTRA_FIELDS['mailing_address']} text" id="field-address-mailing">
<label for="address-mailing">${_("Mailing Address")}</label>
<textarea id="address-mailing" name="mailing_address" value="" ${'required aria-required="true"' if settings.REGISTRATION_EXTRA_FIELDS['mailing_address'] == 'required' else ''}></textarea>
</li>
% endif
% if settings.REGISTRATION_EXTRA_FIELDS['goals'] != 'hidden':
<li class="field ${settings.REGISTRATION_EXTRA_FIELDS['goals']} text" id="field-goals">
<label for="goals">${_("Please share with us your reasons for registering with {platform_name}").format(platform_name=platform_name)}</label>
<textarea id="goals" name="goals" value="" ${'required aria-required="true"' if settings.REGISTRATION_EXTRA_FIELDS['goals'] == 'required' else ''}></textarea>
</li>
% endif
</ol>
</div>
<div class="group group-form group-form-accountacknowledgements">
<h2 class="sr">${_("Account Acknowledgements")}</h2>
<ol class="list-input">
<li class="field-group">
% if has_extauth_info is UNDEFINED or ask_for_tos :
<div class="field required checkbox" id="field-tos">
<input id="tos-yes" type="checkbox" name="terms_of_service" value="true" required aria-required="true" />
<label for="tos-yes">${_('I agree to the {link_start}Terms of Service{link_end}').format(
link_start='<a href="{url}" class="new-vp" tabindex="-1">'.format(url=marketing_link('TOS')),
link_end='</a>')}</label>
</div>
% endif
% if settings.REGISTRATION_EXTRA_FIELDS['honor_code'] != 'hidden':
## If the stanford theme isn't enabled, check if we have an Honor Code link in our marketing map
% if not stanford_theme_enabled() and marketing_link('HONOR') and marketing_link('HONOR') != '#':
<div class="field ${settings.REGISTRATION_EXTRA_FIELDS['honor_code']} checkbox" id="field-honorcode">
<input id="honorcode-yes" type="checkbox" name="honor_code" value="true" />
<%
## TODO: provide a better way to override these links
if stanford_theme_enabled():
honor_code_path = marketing_link('TOS') + "#honor"
else:
honor_code_path = marketing_link('HONOR')
%>
<label for="honorcode-yes">${_('I agree to the {link_start}Honor Code{link_end}').format(
link_start='<a href="{url}" class="new-vp" tabindex="-1">'.format(url=honor_code_path),
link_end='</a>')}</label>
</div>
% endif
% endif
</li>
</ol>
</div>
<div class="form-actions">
<button name="submit" type="submit" id="submit" class="action action-primary action-update register-button">${_('Register')} <span class="orn-plus">+</span> ${_('Create My Account')}</button>
</div>
lms/templates/register.html
...@@ -111,265 +111,11 @@ import calendar ...@@ -111,265 +111,11 @@ import calendar
<section class="register container"> <section class="register container">
<section role="main" class="content"> <section role="main" class="content">
<form role="form" id="register-form" method="post" data-remote="true" action="/create_account" novalidate> <form role="form" id="register-form" method="post" data-remote="true" action="/create_account" novalidate>
<%block name="register_form"> <%
<input type="hidden" name="csrfmiddlewaretoken" value="${ csrf_token }"> # allow for microsite override on the registration form
registration_form = microsite.get_template_path('register-form.html')
<!-- status messages --> %>
<div role="alert" class="status message"> <%include file="${registration_form}" />
<h3 class="message-title">${_("We're sorry, but this version of your browser is not supported. Try again using a different browser or a newer version of your browser.")}</h3>
</div>
<div role="alert" class="status message submission-error" tabindex="-1">
<h3 class="message-title">${_("The following errors occurred while processing your registration:")} </h3>
<ul class="message-copy"> </ul>
</div>
% if third_party_auth.is_enabled():
% if not running_pipeline:
<div class="form-actions form-third-party-auth">
% for enabled in provider.Registry.accepting_logins():
## Translators: provider_name is the name of an external, third-party user authentication service (like Google or LinkedIn).
<button type="submit" class="button button-primary button-${enabled.provider_id} register-${enabled.provider_id}" onclick="thirdPartySignin(event, '${pipeline_urls[enabled.provider_id]}');"><span class="icon fa ${enabled.icon_class}"></span>${_('Sign up with {provider_name}').format(provider_name=enabled.name)}</button>
% endfor
</div>
<span class="deco-divider">
## Developers: this is a sentence fragment, which is usually frowned upon. The design of the pags uses this fragment to provide an "else" clause underneath a number of choices. It's OK to leave it.
## Translators: this is the last choice of a number of choices of how to log in to the site.
<span class="copy">${_('or')}</span>
</span>
<p class="instructions">
${_('Create your own {platform_name} account below').format(platform_name=platform_name)}
<span class="note">${_('Required fields are noted by <strong class="indicator">bold text and an asterisk (*)</strong>.')}</span>
</p>
% else:
<p class="instructions">
## Translators: selected_provider is the name of an external, third-party user authentication service (like Google or LinkedIn).
${_("You've successfully signed in with {selected_provider}.").format(selected_provider='<strong>%s</strong>' % selected_provider)}<br />
${_("We just need a little more information before you start learning with {platform_name}.").format(platform_name=settings.PLATFORM_NAME)}
</p>
% endif
% else:
<p class="instructions">
${_("Please complete the following fields to register for an account. ")}<br />
${_('Required fields are noted by <strong class="indicator">bold text and an asterisk (*)</strong>.')}
</p>
% endif
<div class="group group-form group-form-requiredinformation">
<h2 class="sr">${_('Required Information')}</h2>
% if has_extauth_info is UNDEFINED:
<ol class="list-input">
<li class="field required text" id="field-email">
<label for="email">${_('E-mail')}</label>
<input class="" id="email" type="email" name="email" value="${email}" placeholder="${_('example: username@domain.com')}" required aria-required="true" />
</li>
<li class="field required text" id="field-name">
<label for="name">${_('Full Name')}</label>
<input id="name" type="text" name="name" value="${name}" placeholder="${_('example: Jane Doe')}" required aria-required="true" aria-describedby="name-tip" />
<span class="tip tip-input" id="name-tip">${_("Your legal name, used for any certificates you earn.")}</span>
</li>
<li class="field required text" id="field-username">
<label for="username">${_('Public Username')}</label>
<input id="username" type="text" name="username" value="${username}" placeholder="${_('example: JaneDoe')}" required aria-required="true" aria-describedby="username-tip"/>
<span class="tip tip-input" id="username-tip">${_('Will be shown in any discussions or forums you participate in')} <strong>(${_('cannot be changed later')})</strong></span>
</li>
% if third_party_auth.is_enabled() and running_pipeline:
<li class="is-disabled field optional password" id="field-password" hidden>
<label for="password">${_('Password')}</label>
<input id="password" type="password" name="password" value="" disabled required aria-required="true" />
</li>
% else:
<li class="field required password" id="field-password">
<label for="password">${_('Password')}</label>
<input id="password" type="password" name="password" value="" required aria-required="true" />
</li>
% endif
</ol>
% else:
<div class="message">
<h3 class="message-title">${_("Welcome {username}").format(username=extauth_id)}</h3>
<p class="message-copy">${_("Enter a Public Display Name:")}</p>
</div>
<ol class="list-input">
% if ask_for_email:
<li class="field required text" id="field-email">
<label for="email">${_("E-mail")}</label>
<input class="" id="email" type="email" name="email" value="" placeholder="${_('example: username@domain.com')}" />
</li>
% endif
<li class="field required text" id="field-username">
<label for="username">${_('Public Display Name')}</label>
<input id="username" type="text" name="username" value="${extauth_username}" placeholder="${_('example: JaneDoe')}" required aria-required="true" aria-describedby="username-tip" />
<span class="tip tip-input" id="id="username-tip>${_('Will be shown in any discussions or forums you participate in')} <strong>(${_('cannot be changed later')})</strong></span>
</li>
% if ask_for_fullname:
<li class="field required text" id="field-name">
<label for="name">${_('Full Name')}</label>
<input id="name" type="text" name="name" value="" placeholder="$_('example: Jane Doe')}" aria-describedby="name-tip" />
<span class="tip tip-input" id="name-tip">${_("Your legal name, used for any certificates you earn.")}</span>
</li>
% endif
</ol>
% endif
</div>
<div class="group group-form group-form-secondary group-form-personalinformation">
<h2 class="sr">${_("Additional Personal Information")}</h2>
<ol class="list-input">
% if settings.REGISTRATION_EXTRA_FIELDS['city'] != 'hidden':
<li class="field ${settings.REGISTRATION_EXTRA_FIELDS['city']} text" id="field-city">
<label for="city">${_('City')}</label>
<input id="city" type="text" name="city" value="" placeholder="${_('example: New York')}" aria-describedby="city-tip" ${'required aria-required="true"' if settings.REGISTRATION_EXTRA_FIELDS['city'] == 'required' else ''} />
</li>
% endif
% if settings.REGISTRATION_EXTRA_FIELDS['country'] != 'hidden':
<li class="field-group">
<div class="field ${settings.REGISTRATION_EXTRA_FIELDS['country']} select" id="field-country">
<label for="country">${_("Country")}</label>
<select id="country" name="country" ${'required aria-required="true"' if settings.REGISTRATION_EXTRA_FIELDS['country'] == 'required' else ''}>
<option value="">--</option>
%for code, country_name in countries:
<option value="${code}">${ unicode(country_name) }</option>
%endfor
</select>
</div>
</li>
% endif
% if settings.REGISTRATION_EXTRA_FIELDS['level_of_education'] != 'hidden':
<li class="field-group field-education-level">
<div class="field ${settings.REGISTRATION_EXTRA_FIELDS['level_of_education']} select" id="field-education-level">
<label for="education-level">${_("Highest Level of Education Completed")}</label>
<select id="education-level" name="level_of_education" ${'required aria-required="true"' if settings.REGISTRATION_EXTRA_FIELDS['level_of_education'] == 'required' else ''}>
<option value="">--</option>
%for code, ed_level in UserProfile.LEVEL_OF_EDUCATION_CHOICES:
<option value="${code}">${_(ed_level)}</option>
%endfor
</select>
</div>
</li>
% endif
% if settings.REGISTRATION_EXTRA_FIELDS['gender'] != 'hidden':
<li class="field-group field-gender">
<div class="field ${settings.REGISTRATION_EXTRA_FIELDS['gender']} select" id="field-gender">
<label for="gender">${_("Gender")}</label>
<select id="gender" name="gender" ${'required aria-required="true"' if settings.REGISTRATION_EXTRA_FIELDS['gender'] == 'required' else ''}>
<option value="">--</option>
%for code, gender in UserProfile.GENDER_CHOICES:
<option value="${code}">${_(gender)}</option>
%endfor
</select>
</div>
</li>
% endif
% if settings.REGISTRATION_EXTRA_FIELDS['year_of_birth'] != 'hidden':
<li class="field-group field-yob">
<div class="field ${settings.REGISTRATION_EXTRA_FIELDS['year_of_birth']} select" id="field-yob">
<label for="yob">${_("Year of Birth")}</label>
<select id="yob" name="year_of_birth" ${'required aria-required="true"' if settings.REGISTRATION_EXTRA_FIELDS['year_of_birth'] == 'required' else ''}>
<option value="">--</option>
%for year in UserProfile.VALID_YEARS:
<option value="${year}">${year}</option>
%endfor
</select>
</div>
% endif
</li>
</ol>
</div>
<div class="group group-form group-form-personalinformation2">
<ol class="list-input">
% if settings.REGISTRATION_EXTRA_FIELDS['mailing_address'] != 'hidden':
<li class="field ${settings.REGISTRATION_EXTRA_FIELDS['mailing_address']} text" id="field-address-mailing">
<label for="address-mailing">${_("Mailing Address")}</label>
<textarea id="address-mailing" name="mailing_address" value="" ${'required aria-required="true"' if settings.REGISTRATION_EXTRA_FIELDS['mailing_address'] == 'required' else ''}></textarea>
</li>
% endif
% if settings.REGISTRATION_EXTRA_FIELDS['goals'] != 'hidden':
<li class="field ${settings.REGISTRATION_EXTRA_FIELDS['goals']} text" id="field-goals">
<label for="goals">${_("Please share with us your reasons for registering with {platform_name}").format(platform_name=platform_name)}</label>
<textarea id="goals" name="goals" value="" ${'required aria-required="true"' if settings.REGISTRATION_EXTRA_FIELDS['goals'] == 'required' else ''}></textarea>
</li>
% endif
</ol>
</div>
<div class="group group-form group-form-accountacknowledgements">
<h2 class="sr">${_("Account Acknowledgements")}</h2>
<ol class="list-input">
<li class="field-group">
% if has_extauth_info is UNDEFINED or ask_for_tos :
<div class="field required checkbox" id="field-tos">
<input id="tos-yes" type="checkbox" name="terms_of_service" value="true" required aria-required="true" />
<label for="tos-yes">${_('I agree to the {link_start}Terms of Service{link_end}').format(
link_start='<a href="{url}" class="new-vp" tabindex="-1">'.format(url=marketing_link('TOS')),
link_end='</a>')}</label>
</div>
% endif
% if settings.REGISTRATION_EXTRA_FIELDS['honor_code'] != 'hidden':
## If the stanford theme isn't enabled, check if we have an Honor Code link in our marketing map
% if not self.stanford_theme_enabled() and marketing_link('HONOR') and marketing_link('HONOR') != '#':
<div class="field ${settings.REGISTRATION_EXTRA_FIELDS['honor_code']} checkbox" id="field-honorcode">
<input id="honorcode-yes" type="checkbox" name="honor_code" value="true" />
<%
## TODO: provide a better way to override these links
if self.stanford_theme_enabled():
honor_code_path = marketing_link('TOS') + "#honor"
else:
honor_code_path = marketing_link('HONOR')
%>
<label for="honorcode-yes">${_('I agree to the {link_start}Honor Code{link_end}').format(
link_start='<a href="{url}" class="new-vp" tabindex="-1">'.format(url=honor_code_path),
link_end='</a>')}</label>
</div>
% endif
% endif
</li>
</ol>
</div>
<div class="form-actions">
<button name="submit" type="submit" id="submit" class="action action-primary action-update register-button">${_('Register')} <span class="orn-plus">+</span> ${_('Create My Account')}</button>
</div>
</%block>
</form> </form>
</section> </section>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment