188 lines
7.4 KiB
HTML
188 lines
7.4 KiB
HTML
<%! from django.utils.translation import ugettext as _ %>
|
|
|
|
<%inherit file="main.html" />
|
|
|
|
<%namespace name='static' file='static_content.html'/>
|
|
|
|
<%! from django.core.urlresolvers import reverse %>
|
|
<%! from django.utils.translation import ugettext as _ %>
|
|
|
|
<%block name="title"><title>${_("Log into your {platform_name} Account").format(platform_name=settings.PLATFORM_NAME)}</title></%block>
|
|
|
|
<%block name="js_extra">
|
|
<script type="text/javascript">
|
|
$(function() {
|
|
|
|
var view_name = 'view-login';
|
|
|
|
// adding js class for styling with accessibility in mind
|
|
$('body').addClass('js').addClass(view_name);
|
|
|
|
// new window/tab opening
|
|
$('a[rel="external"], a[class="new-vp"]')
|
|
.click( function() {
|
|
window.open( $(this).attr('href') );
|
|
return false;
|
|
});
|
|
|
|
// form field label styling on focus
|
|
$("form :input").focus(function() {
|
|
$("label[for='" + this.id + "']").parent().addClass("is-focused");
|
|
}).blur(function() {
|
|
$("label").parent().removeClass("is-focused");
|
|
});
|
|
});
|
|
|
|
(function() {
|
|
toggleSubmitButton(true);
|
|
|
|
$('#login-form').on('submit', function() {
|
|
toggleSubmitButton(false);
|
|
});
|
|
|
|
$('#login-form').on('ajax:error', function() {
|
|
toggleSubmitButton(true);
|
|
});
|
|
|
|
$('#login-form').on('ajax:success', function(event, json, xhr) {
|
|
if(json.success) {
|
|
var u=decodeURI(window.location.search);
|
|
next=u.split("next=")[1];
|
|
if (next && !isExternal(next)) {
|
|
location.href=next;
|
|
} else if(json.redirect_url){
|
|
location.href=json.redirect_url;
|
|
} else {
|
|
location.href="${reverse('dashboard')}";
|
|
}
|
|
} else if(json.hasOwnProperty('redirect')) {
|
|
var u=decodeURI(window.location.search);
|
|
if (!isExternal(json.redirect)) { // a paranoid check. Our server is the one providing json.redirect
|
|
location.href=json.redirect+u;
|
|
} // else we just remain on this page, which is fine since this particular path implies a login failure
|
|
// that has been generated via packet tampering (json.redirect has been messed with).
|
|
} else {
|
|
toggleSubmitButton(true);
|
|
$('.message.submission-error').addClass('is-shown').focus();
|
|
$('.message.submission-error .message-copy').html(json.value);
|
|
}
|
|
});
|
|
})(this);
|
|
|
|
function toggleSubmitButton(enable) {
|
|
var $submitButton = $('form .form-actions #submit');
|
|
|
|
if(enable) {
|
|
$submitButton.
|
|
removeClass('is-disabled').
|
|
removeProp('disabled').
|
|
html("${_('Log into My {platform_name} Account').format(platform_name=settings.PLATFORM_NAME)} <span class='orn-plus'>+</span> ${_('Access My Courses')}");
|
|
}
|
|
else {
|
|
$submitButton.
|
|
addClass('is-disabled').
|
|
prop('disabled', true).
|
|
html(gettext('Processing your account information …'));
|
|
}
|
|
}
|
|
</script>
|
|
</%block>
|
|
|
|
<section class="introduction">
|
|
<header>
|
|
<h1 class="sr">${_("PLEASE LOG IN to access your account and courses")}</h1>
|
|
</header>
|
|
</section>
|
|
|
|
<section class="login container">
|
|
<section role="main" class="content">
|
|
<form role="form" id="login-form" method="post" data-remote="true" action="/login_ajax" novalidate>
|
|
|
|
<!-- status messages -->
|
|
<div role="alert" class="status message">
|
|
<h3 class="message-title">${_("We're Sorry, {platform_name} accounts are unavailable currently").format(platform_name=settings.PLATFORM_NAME)}</h3>
|
|
<p class="message-copy">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</p>
|
|
</div>
|
|
|
|
<div role="alert" class="status message submission-error" tabindex="-1">
|
|
<h3 class="message-title">${_("The following errors occured while logging you in:")} </h3>
|
|
<ul class="message-copy">
|
|
<li>${_("Your email or password is incorrect")}</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<p class="instructions sr">
|
|
${_('Please provide the following information to log into your {platform_name} account. Required fields are noted by <strong class="indicator">bold text and an asterisk (*)</strong>.').format(platform_name=settings.PLATFORM_NAME)}
|
|
</p>
|
|
|
|
<fieldset class="group group-form group-form-requiredinformation">
|
|
<legend class="sr">${_('Required Information')}</legend>
|
|
|
|
<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="" placeholder="example: username@domain.com" required aria-required="true" aria-described-by="email-tip" />
|
|
<span class="tip tip-input" id="email-tip">${_("This is the e-mail address you used to register with {platform}").format(platform=settings.PLATFORM_NAME)}</span>
|
|
</li>
|
|
<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" />
|
|
<span class="tip tip-input">
|
|
<a href="#forgot-password-modal" rel="leanModal" class="pwd-reset action action-forgotpw">${_('Forgot password?')}</a>
|
|
</span>
|
|
</li>
|
|
</ol>
|
|
</fieldset>
|
|
|
|
<fieldset class="group group-form group-form-secondary group-form-accountpreferences">
|
|
<legend class="sr">${_('Account Preferences')}</legend>
|
|
|
|
<ol class="list-input">
|
|
<li class="field required checkbox" id="field-remember">
|
|
<input id="remember-yes" type="checkbox" name="remember" value="true" />
|
|
<label for="remember-yes">${_('Remember me')}</label>
|
|
</li>
|
|
</ol>
|
|
</fieldset>
|
|
|
|
% if course_id and enrollment_action:
|
|
<input type="hidden" name="enrollment_action" value="${enrollment_action | h}" />
|
|
<input type="hidden" name="course_id" value="${course_id | h}" />
|
|
% endif
|
|
|
|
<div class="form-actions">
|
|
<button name="submit" type="submit" id="submit" class="action action-primary action-update"></button>
|
|
</div>
|
|
</form>
|
|
</section>
|
|
|
|
<aside role="complementary">
|
|
<header>
|
|
<h2 class="sr">${_("Helpful Information")}</h2>
|
|
</header>
|
|
|
|
% if settings.MITX_FEATURES.get('AUTH_USE_OPENID'):
|
|
<!-- <div class="cta cta-login-options-openid">
|
|
<h3>${_("Login via OpenID")}</h3>
|
|
<p>${_('You can now start learning with {platform_name} by logging in with your <a rel="external" href="http://openid.net/">OpenID account</a>.').format(platform_name=settings.PLATFORM_NAME)}</p>
|
|
<a class="action action-login-openid" href="#">${_("Login via OpenID")}</a>
|
|
</div> -->
|
|
% endif
|
|
|
|
<div class="cta cta-help">
|
|
<h3>${_("Not Enrolled?")}</h3>
|
|
<p><a href="${reverse('register_user')}">${_("Sign up for {platform_name} today!").format(platform_name=settings.PLATFORM_NAME)}</a></p>
|
|
|
|
## Disable help unless the FAQ marketing link is enabled
|
|
% if settings.MKTG_URL_LINK_MAP.get('FAQ'):
|
|
<h3>${_("Need Help?")}</h3>
|
|
<p>${_("Looking for help in logging in or with your {platform_name} account?").format(platform_name=settings.PLATFORM_NAME)}
|
|
<a href="${marketing_link('FAQ')}">
|
|
${_("View our help section for answers to commonly asked questions.")}
|
|
</a></p>
|
|
% endif
|
|
</div>
|
|
</aside>
|
|
</section>
|
|
|