Skip to content

E
edx-platform
Commit 6f810836 by marco Committed by Will Daly
Options

Template changes for course track AB-test

parent 714f9bb6
Showing with 251 additions and 4 deletions
common/templates/course_modes/choose.html
...@@ -67,6 +67,11 @@ $(document).ready(function() { ...@@ -67,6 +67,11 @@ $(document).ready(function() {
<%include file="/verify_student/_verification_header.html" args="course_name=course_name" /> <%include file="/verify_student/_verification_header.html" args="course_name=course_name" />
## TODO (ECOM-16): This is part of an AB-test of auto-registration.
## Once the test completes, we can make the winning configuration the default
## and remove this flag.
%if not autoreg:
<!-- /experiment-control -->
<div class="wrapper-register-choose wrapper-content-main"> <div class="wrapper-register-choose wrapper-content-main">
<article class="register-choose content-main"> <article class="register-choose content-main">
...@@ -214,6 +219,92 @@ $(document).ready(function() { ...@@ -214,6 +219,92 @@ $(document).ready(function() {
</article> </article>
</div> <!-- /wrapper-content-main --> </div> <!-- /wrapper-content-main -->
%else:
<!-- /experiment-variant-A -->
<div class="wrapper-register-choose wrapper-content-main exp-variant-A">
<article class="register-choose content-main">
%if not upgrade:
<h3 class="title">${_("Now choose your course track:")}</h3>
%endif
<form class="form-register-choose" method="post" name="enrollment_mode_form" id="enrollment_mode_form">
% if "verified" in modes:
<div class="register-choice register-choice-certificate">
<div class="wrapper-copy">
<span class="deco-ribbon"></span>
<h4 class="title">${_("Pursue a Verified Certificate")}</h4>
%if upgrade:
<div class="copy">
<p>${_("Plan to use your completed coursework for job applications, career advancement, or school applications? Upgrade to work toward a Verified Certificate of Achievement to document your accomplishment. A minimum fee applies.")}</p>
</div>
%else:
<div class="copy">
<p>${_("Plan to use your completed coursework for job applications, career advancement, or school applications? Then work toward a Verified Certificate of Achievement to document your accomplishment. A minimum fee applies.")}</p>
</div>
%endif
</div>
<div class="field field-certificate-contribution">
<h5 class="label">${_("Select your contribution for this course (min. $")} ${min_price} <span class="denomination-name">${currency}</span>${_("):")}</h5>
%if error:
<div class="msg msg-error msg-inline">
<div class="copy">
<p><i class="msg-icon icon-warning-sign"></i> ${error}</p>
</div>
</div>
%endif
<%include file="_contribution.html" args="suggested_prices=suggested_prices, currency=currency, chosen_price=chosen_price, min_price=min_price"/>
<ul class="list-actions">
<li class="action action-select">
%if upgrade:
<input type="submit" name="certificate_mode" value="${_('Upgrade Your Registration')}" />
%else:
<input type="submit" name="certificate_mode" value="${_('Pursue a Verified Certificate')}" />
%endif
</li>
</ul>
</div>
</div>
% endif
%if not upgrade:
% if "audit" in modes:
<span class="deco-divider">
<span class="copy">${_("or")}</span>
</span>
<div class="register-choice register-choice-audit">
<div class="wrapper-copy">
<h4 class="title">${_("Audit This Course")}</h4>
<div class="copy">
<p>${_("You can audit this course and still have complete access to the course material. If you complete and pass the course you will automatically earn an Honor Code Certificate free of charge.")}</p>
</div>
</div>
<ul class="list-actions">
<li class="action action-select">
<input type="submit" name="audit_mode" value="${_('Pursue an Honor Code Certificate')}" />
</li>
</ul>
</div>
% endif
%endif
<input type="hidden" name="csrfmiddlewaretoken" value="${ csrf_token }">
</form>
</article>
</div> <!-- /wrapper-content-main -->
%endif
<%include file="/verify_student/_verification_support.html" /> <%include file="/verify_student/_verification_support.html" />
</section> </section>
</div> </div>
......
lms/envs/dev.py
...@@ -37,6 +37,7 @@ FEATURES['ENABLE_SHOPPING_CART'] = True ...@@ -37,6 +37,7 @@ FEATURES['ENABLE_SHOPPING_CART'] = True
FEATURES['AUTOMATIC_VERIFY_STUDENT_IDENTITY_FOR_TESTING'] = True FEATURES['AUTOMATIC_VERIFY_STUDENT_IDENTITY_FOR_TESTING'] = True
FEATURES['ENABLE_S3_GRADE_DOWNLOADS'] = True FEATURES['ENABLE_S3_GRADE_DOWNLOADS'] = True
FEATURES['IS_EDX_DOMAIN'] = True # Is this an edX-owned domain? (used on instructor dashboard) FEATURES['IS_EDX_DOMAIN'] = True # Is this an edX-owned domain? (used on instructor dashboard)
FEATURES['ENABLE_PAYMENT_FAKE'] = True
FEEDBACK_SUBMISSION_EMAIL = "dummy@example.com" FEEDBACK_SUBMISSION_EMAIL = "dummy@example.com"
...@@ -280,7 +281,8 @@ if SEGMENT_IO_LMS_KEY: ...@@ -280,7 +281,8 @@ if SEGMENT_IO_LMS_KEY:
CC_PROCESSOR['CyberSource']['SHARED_SECRET'] = os.environ.get('CYBERSOURCE_SHARED_SECRET', '') CC_PROCESSOR['CyberSource']['SHARED_SECRET'] = os.environ.get('CYBERSOURCE_SHARED_SECRET', '')
CC_PROCESSOR['CyberSource']['MERCHANT_ID'] = os.environ.get('CYBERSOURCE_MERCHANT_ID', '') CC_PROCESSOR['CyberSource']['MERCHANT_ID'] = os.environ.get('CYBERSOURCE_MERCHANT_ID', '')
CC_PROCESSOR['CyberSource']['SERIAL_NUMBER'] = os.environ.get('CYBERSOURCE_SERIAL_NUMBER', '') CC_PROCESSOR['CyberSource']['SERIAL_NUMBER'] = os.environ.get('CYBERSOURCE_SERIAL_NUMBER', '')
CC_PROCESSOR['CyberSource']['PURCHASE_ENDPOINT'] = os.environ.get('CYBERSOURCE_PURCHASE_ENDPOINT', '') #CC_PROCESSOR['CyberSource']['PURCHASE_ENDPOINT'] = os.environ.get('CYBERSOURCE_PURCHASE_ENDPOINT', '')
CC_PROCESSOR['CyberSource']['PURCHASE_ENDPOINT'] = '/shoppingcart/payment_fake/'
########################## USER API ########################## ########################## USER API ##########################
EDX_API_KEY = None EDX_API_KEY = None
......
lms/static/sass/views/_verification.scss
...@@ -415,6 +415,57 @@ ...@@ -415,6 +415,57 @@
} }
} }
// CASE: page header - experiment variant A overrides
.page-header.exp-variant-A {
margin-bottom: 0;
border-bottom: none;
.title {
margin: 0;
}
.sts-label {
display: inline-block;
margin: 0;
border: none;
padding: 0;
text-transform: none;
}
.sts-course-org {
margin-right: 0;
}
.sts-label, .sts-course-org, .sts-course-number, .sts-course-name {
@extend %t-title5;
@extend %t-weight4;
@include font-size(14);
@include line-height(14);
display: inline-block;
color: $gray;
text-transform: none;
}
.wrapper-sts {
display: inline-block;
width: flex-grid(9,12);
margin-bottom: ($baseline/4);
}
.sts-course {
width: initial;
}
.title .sts-track {
display: inline-block;
.sts-track-value {
background: $m-blue-l1;
}
}
}
// ==================== // ====================
// UI : progress // UI : progress
...@@ -1123,6 +1174,14 @@ ...@@ -1123,6 +1174,14 @@
} }
} }
// CASE: supplemental content - experiment variant A overrides
.wrapper-content-supplementary.exp-variant-A {
.help-item-technical {
width: flex-grid(8,12);
}
}
// ==================== // ====================
// VIEW: select a track // VIEW: select a track
...@@ -1192,11 +1251,11 @@ ...@@ -1192,11 +1251,11 @@
border-color: $m-blue-d1; border-color: $m-blue-d1;
.wrapper-copy { .wrapper-copy {
width: flex-grid(5,8); width: flex-grid(8,8);
} }
.list-actions { .list-actions {
width: flex-grid(3,8); width: flex-grid(8,8);
} }
.action-select input { .action-select input {
...@@ -1221,7 +1280,6 @@ ...@@ -1221,7 +1280,6 @@
.list-actions { .list-actions {
margin: ($baseline/2) 0; margin: ($baseline/2) 0;
border-top: ($baseline/10) solid $m-gray-t1; border-top: ($baseline/10) solid $m-gray-t1;
padding-top: $baseline;
} }
.action-intro, .action-select { .action-intro, .action-select {
...@@ -1336,6 +1394,39 @@ ...@@ -1336,6 +1394,39 @@
} }
} }
// CASE: select a track - experiment variant A overrides
.wrapper-register-choose.exp-variant-A {
.register-choice {
width: flex-grid(12,12);
}
.deco-divider{
width: flex-grid(12,12);
}
.contribution-options {
width: flex-grid(8,12);
margin: 0;
&:after{
clear: none;
display: none;
}
}
.register-choice-certificate .list-actions {
border-top: none;
width: flex-grid(4,12);
float: right;
margin: ($baseline/4) 0;
.action-select {
width: initial;
}
}
}
// VIEW: requirements // VIEW: requirements
&.step-requirements { &.step-requirements {
......
lms/templates/verify_student/_verification_header.html
<%! from django.utils.translation import ugettext as _ %> <%! from django.utils.translation import ugettext as _ %>
## TODO (ECOM-16): This is part of an AB-test of auto-registration.
## Once the test completes, we can make the winning configuration the default
## and remove this flag.
%if not autoreg:
<!-- /experiment-control -->
<header class="page-header"> <header class="page-header">
<h2 class="title"> <h2 class="title">
%if upgrade: %if upgrade:
...@@ -31,3 +36,33 @@ ...@@ -31,3 +36,33 @@
</span> </span>
</h2> </h2>
</header> </header>
%else:
<!-- /experiment-variant-A -->
<header class="page-header exp-variant-A">
<h2 class="title">
<span class="wrapper-sts">
%if upgrade:
<span class="sts-label">${_("You are upgrading your registration for")}</span>
%elif reverify:
<span class="sts-label">${_("You are re-verifying for")}</span>
%else:
<span class="sts-label">${_("Congrats! You are now registered to audit")}</span>
%endif
<span class="sts-course-org">${course_org}'s</span>
<span class="sts-course-number">${course_num}</span>
<span class="sts-course-name">${course_name}.</span>
</span>
<span class="sts-track">
<span class="sts-track-value">
%if upgrade:
<span class="context">${_("Upgrading to:")}</span> ${_("ID Verified")}
%elif reverify:
<span class="context">${_("Re-verifying for:")}</span> ${_("ID Verified")}
%else:
<span class="context">${_("Registering as: ")}</span> ${_("ID Verified")}
%endif
</span>
</h2>
</header>
%endif
lms/templates/verify_student/_verification_support.html
<%! from django.utils.translation import ugettext as _ %> <%! from django.utils.translation import ugettext as _ %>
## TODO (ECOM-16): This is part of an AB-test of auto-registration.
## Once the test completes, we can make the winning configuration the default
## and remove this flag.
%if not autoreg:
<!-- /experiment-control -->
<div class="wrapper-content-supplementary"> <div class="wrapper-content-supplementary">
<aside class="content-supplementary"> <aside class="content-supplementary">
<ul class="list-help"> <ul class="list-help">
...@@ -35,3 +40,26 @@ ...@@ -35,3 +40,26 @@
</ul> </ul>
</aside> </aside>
</div> <!-- /wrapper-content-supplementary --> </div> <!-- /wrapper-content-supplementary -->
%else:
<!-- /experiment-variant-A -->
<div class="wrapper-content-supplementary exp-variant-A">
<aside class="content-supplementary">
<ul class="list-help">
<li class="help-item help-item-questions">
<h3 class="title">${_("Have questions?")}</h3>
<div class="copy">
<p>${_("Please read {a_start}our FAQs to view common questions about our certificates{a_end}.").format(a_start='<a rel="external" href="'+ marketing_link('WHAT_IS_VERIFIED_CERT') + '">', a_end="</a>")}</p>
</div>
</li>
<li class="help-item help-item-technical">
<h3 class="title">${_("Technical Requirements")}</h3>
<div class="copy">
<p>${_("Please make sure your browser is updated to the {a_start}most recent version possible{a_end}. Also, please make sure your <strong>web cam is plugged in, turned on, and allowed to function in your web browser (commonly adjustable in your browser settings).</strong>").format(a_start='<strong><a rel="external" href="http://browsehappy.com/">', a_end="</a></strong>")}</p>
</div>
</li>
</ul>
</aside>
</div> <!-- /wrapper-content-supplementary -->
%endif
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