Andal.LND/edx-platform
6
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge pull request #6260 from edx/will/combine-intro-and-make-payment

Browse Source 
Combine payment and intro step
This commit is contained in:
Will Daly
2014-12-15 14:59:26 -05:00
parent c6b1ca34a7 d3c3f73428
commit 788cc350dd
11 changed files with 142 additions and 105 deletions
Download Patch File Download Diff File Expand all files Collapse all files

49
lms/djangoapps/verify_student/tests/test_views.py
View File

@@ -967,8 +967,8 @@ class TestPayAndVerifyView(UrlResetMixin, ModuleStoreTestCase):
self._assert_displayed_mode(response, course_mode)
self._assert_steps_displayed(
response,
PayAndVerifyView.ALL_STEPS,
PayAndVerifyView.INTRO_STEP
PayAndVerifyView.PAYMENT_STEPS + PayAndVerifyView.VERIFICATION_STEPS,
PayAndVerifyView.MAKE_PAYMENT_STEP
)
self._assert_messaging(response, PayAndVerifyView.FIRST_TIME_VERIFY_MSG)
self._assert_requirements_displayed(response, [
@@ -977,15 +977,6 @@ class TestPayAndVerifyView(UrlResetMixin, ModuleStoreTestCase):
PayAndVerifyView.CREDIT_CARD_REQ,
])
def test_start_flow_skip_intro(self):
course = self._create_course("verified")
response = self._get_page("verify_student_start_flow", course.id, skip_first_step=True)
self._assert_steps_displayed(
response,
PayAndVerifyView.ALL_STEPS,
PayAndVerifyView.MAKE_PAYMENT_STEP
)
@ddt.data("expired", "denied")
def test_start_flow_expired_or_denied_verification(self, verification_status):
course = self._create_course("verified")
@@ -996,7 +987,7 @@ class TestPayAndVerifyView(UrlResetMixin, ModuleStoreTestCase):
# Expect the same content as when the user has not verified
self._assert_steps_displayed(
response,
PayAndVerifyView.STEPS_WITHOUT_PAYMENT,
[PayAndVerifyView.INTRO_STEP] + PayAndVerifyView.VERIFICATION_STEPS,
PayAndVerifyView.INTRO_STEP
)
self._assert_messaging(response, PayAndVerifyView.FIRST_TIME_VERIFY_MSG)
@@ -1020,8 +1011,8 @@ class TestPayAndVerifyView(UrlResetMixin, ModuleStoreTestCase):
self._assert_displayed_mode(response, course_mode)
self._assert_steps_displayed(
response,
PayAndVerifyView.STEPS_WITHOUT_VERIFICATION,
PayAndVerifyView.INTRO_STEP
PayAndVerifyView.PAYMENT_STEPS,
PayAndVerifyView.MAKE_PAYMENT_STEP
)
self._assert_messaging(response, PayAndVerifyView.FIRST_TIME_VERIFY_MSG)
self._assert_requirements_displayed(response, [
@@ -1036,7 +1027,7 @@ class TestPayAndVerifyView(UrlResetMixin, ModuleStoreTestCase):
self._assert_displayed_mode(response, course_mode)
self._assert_steps_displayed(
response,
PayAndVerifyView.STEPS_WITHOUT_PAYMENT,
[PayAndVerifyView.INTRO_STEP] + PayAndVerifyView.VERIFICATION_STEPS,
PayAndVerifyView.INTRO_STEP
)
self._assert_messaging(response, PayAndVerifyView.FIRST_TIME_VERIFY_MSG)
@@ -1056,8 +1047,8 @@ class TestPayAndVerifyView(UrlResetMixin, ModuleStoreTestCase):
response = self._get_page('verify_student_start_flow', course.id)
self._assert_steps_displayed(
response,
PayAndVerifyView.STEPS_WITHOUT_VERIFICATION,
PayAndVerifyView.INTRO_STEP
PayAndVerifyView.PAYMENT_STEPS,
PayAndVerifyView.MAKE_PAYMENT_STEP
)
self._assert_requirements_displayed(response, [
PayAndVerifyView.CREDIT_CARD_REQ,
@@ -1074,8 +1065,8 @@ class TestPayAndVerifyView(UrlResetMixin, ModuleStoreTestCase):
response = self._get_page('verify_student_start_flow', course.id)
self._assert_steps_displayed(
response,
PayAndVerifyView.STEPS_WITHOUT_VERIFICATION,
PayAndVerifyView.INTRO_STEP
PayAndVerifyView.PAYMENT_STEPS,
PayAndVerifyView.MAKE_PAYMENT_STEP
)
self._assert_requirements_displayed(response, [
PayAndVerifyView.CREDIT_CARD_REQ,
@@ -1110,7 +1101,7 @@ class TestPayAndVerifyView(UrlResetMixin, ModuleStoreTestCase):
# but we start after the payment step (because it's already completed).
self._assert_steps_displayed(
response,
PayAndVerifyView.ALL_STEPS,
PayAndVerifyView.PAYMENT_STEPS + PayAndVerifyView.VERIFICATION_STEPS,
PayAndVerifyView.FACE_PHOTO_STEP
)
@@ -1185,7 +1176,7 @@ class TestPayAndVerifyView(UrlResetMixin, ModuleStoreTestCase):
# Expect that the payment steps are NOT displayed
self._assert_steps_displayed(
response,
PayAndVerifyView.STEPS_WITHOUT_PAYMENT,
[PayAndVerifyView.INTRO_STEP] + PayAndVerifyView.VERIFICATION_STEPS,
PayAndVerifyView.INTRO_STEP
)
self._assert_requirements_displayed(response, [
@@ -1218,7 +1209,7 @@ class TestPayAndVerifyView(UrlResetMixin, ModuleStoreTestCase):
# but we start at the payment confirmation step
self._assert_steps_displayed(
response,
PayAndVerifyView.ALL_STEPS,
PayAndVerifyView.PAYMENT_STEPS + PayAndVerifyView.VERIFICATION_STEPS,
PayAndVerifyView.PAYMENT_CONFIRMATION_STEP,
)
@@ -1246,7 +1237,7 @@ class TestPayAndVerifyView(UrlResetMixin, ModuleStoreTestCase):
# but we start on the first verify step
self._assert_steps_displayed(
response,
PayAndVerifyView.ALL_STEPS,
PayAndVerifyView.PAYMENT_STEPS + PayAndVerifyView.VERIFICATION_STEPS,
PayAndVerifyView.FACE_PHOTO_STEP,
)
@@ -1264,7 +1255,7 @@ class TestPayAndVerifyView(UrlResetMixin, ModuleStoreTestCase):
# to the dashboard.
self._assert_steps_displayed(
response,
PayAndVerifyView.STEPS_WITHOUT_VERIFICATION,
PayAndVerifyView.PAYMENT_STEPS,
PayAndVerifyView.PAYMENT_CONFIRMATION_STEP,
)
@@ -1283,7 +1274,7 @@ class TestPayAndVerifyView(UrlResetMixin, ModuleStoreTestCase):
# payment confirmation step
self._assert_steps_displayed(
response,
PayAndVerifyView.STEPS_WITHOUT_VERIFICATION,
PayAndVerifyView.PAYMENT_STEPS,
PayAndVerifyView.PAYMENT_CONFIRMATION_STEP,
)
@@ -1318,8 +1309,8 @@ class TestPayAndVerifyView(UrlResetMixin, ModuleStoreTestCase):
self._assert_displayed_mode(response, course_mode)
self._assert_steps_displayed(
response,
PayAndVerifyView.ALL_STEPS,
PayAndVerifyView.INTRO_STEP
PayAndVerifyView.PAYMENT_STEPS + PayAndVerifyView.VERIFICATION_STEPS,
PayAndVerifyView.MAKE_PAYMENT_STEP
)
self._assert_messaging(response, PayAndVerifyView.UPGRADE_MSG)
self._assert_requirements_displayed(response, [
@@ -1336,8 +1327,8 @@ class TestPayAndVerifyView(UrlResetMixin, ModuleStoreTestCase):
response = self._get_page('verify_student_upgrade_and_verify', course.id)
self._assert_steps_displayed(
response,
PayAndVerifyView.STEPS_WITHOUT_VERIFICATION,
PayAndVerifyView.INTRO_STEP
PayAndVerifyView.PAYMENT_STEPS,
PayAndVerifyView.MAKE_PAYMENT_STEP
)
self._assert_messaging(response, PayAndVerifyView.UPGRADE_MSG)
self._assert_requirements_displayed(response, [

19
lms/djangoapps/verify_student/views.py
View File

@@ -259,16 +259,6 @@ class PayAndVerifyView(View):
ENROLLMENT_CONFIRMATION_STEP
]
STEPS_WITHOUT_PAYMENT = [
step for step in ALL_STEPS
if step not in PAYMENT_STEPS
]
STEPS_WITHOUT_VERIFICATION = [
step for step in ALL_STEPS
if step not in VERIFICATION_STEPS
]
Step = namedtuple(
'Step',
[
@@ -395,7 +385,7 @@ class PayAndVerifyView(View):
def get(
self, request, course_id,
always_show_payment=False,
current_step=INTRO_STEP,
current_step=None,
message=FIRST_TIME_VERIFY_MSG
):
"""Render the pay/verify requirements page.
@@ -462,6 +452,9 @@ class PayAndVerifyView(View):
)
requirements = self._requirements(display_steps)
if current_step is None:
current_step = display_steps[0]['name']
# Allow the caller to skip the first page
# This is useful if we want the user to be able to
# use the "back" button to return to the previous step.
@@ -605,6 +598,10 @@ class PayAndVerifyView(View):
if already_paid and not always_show_payment:
remove_steps |= set(self.PAYMENT_STEPS)
else:
# The "make payment" step doubles as an intro step,
# so if we're showing the payment step, hide the intro step.
remove_steps |= set([self.INTRO_STEP])
return [
{

1
lms/envs/common.py
View File

@@ -1077,6 +1077,7 @@ verify_student_js = [
'js/verify_student/views/error_view.js',
'js/verify_student/views/webcam_photo_view.js',
'js/verify_student/views/progress_view.js',
'js/verify_student/views/requirements_view.js',
'js/verify_student/views/step_view.js',
'js/verify_student/views/intro_step_view.js',
'js/verify_student/views/make_payment_step_view.js',

1
lms/static/js/verify_student/pay_and_verify.js
View File

@@ -41,6 +41,7 @@ var edx = edx || {};
requirements: el.data('requirements')
},
'make-payment-step': {
requirements: el.data('requirements'),
courseKey: el.data('course-key'),
minPrice: el.data('course-mode-min-price'),
suggestedPrices: (el.data('course-mode-suggested-prices') || "").split(","),

23
lms/static/js/verify_student/views/intro_step_view.js
View File

@@ -8,12 +8,21 @@ var edx = edx || {};
edx.verify_student = edx.verify_student || {};
// Currently, this view doesn't need to install any custom event handlers,
// since the button in the template reloads the page with a
// ?skip-intro=1 GET parameter. The reason for this is that we
// want to allow users to click "back" to see the requirements,
// and if they reload the page we want them to stay on the
// second step.
edx.verify_student.IntroStepView = edx.verify_student.StepView.extend({});
edx.verify_student.IntroStepView = edx.verify_student.StepView.extend({
// Currently, this view doesn't need to install any custom event handlers,
// since the button in the template reloads the page with a
// ?skip-intro=1 GET parameter. The reason for this is that we
// want to allow users to click "back" to see the requirements,
// and if they reload the page we want them to stay on the
// second step.
postRender: function() {
new edx.verify_student.RequirementsView({
el: $( '.requirements-container', this.el ),
requirements: this.stepData.requirements
}).render();
}
});
})( jQuery );

6
lms/static/js/verify_student/views/make_payment_step_view.js
View File

@@ -11,6 +11,12 @@ var edx = edx || {};
edx.verify_student.MakePaymentStepView = edx.verify_student.StepView.extend({
postRender: function() {
// Render requirements
new edx.verify_student.RequirementsView({
el: $( '.requirements-container', this.el ),
requirements: this.stepData.requirements
}).render();
// Enable the payment button once an amount is chosen
$( "input[name='contribution']" ).on( 'click', _.bind( this.enablePaymentButton, this ) );

29
lms/static/js/verify_student/views/requirements_view.js Normal file
View File

@@ -0,0 +1,29 @@
/**
* View for the requirements (webcam, credit card, etc.)
*/
var edx = edx || {};
(function( $, Backbone, _, gettext ) {
'use strict';
edx.verify_student = edx.verify_student || {};
edx.verify_student.RequirementsView = Backbone.View.extend({
template: "#requirements-tpl",
initialize: function( obj ) {
this.requirements = obj.requirements || {};
},
render: function() {
var renderedHtml = _.template(
$( this.template ).html(),
{ requirements: this.requirements }
);
$( this.el ).html( renderedHtml );
}
});
})( jQuery, Backbone, _, gettext );

58
lms/templates/verify_student/intro_step.underscore
View File

@@ -3,63 +3,7 @@
<h3 class="title"><%- introTitle %></h3>
<div class="instruction"><p><%- introMsg %></p></div>
<ul class="list-reqs">
<% if ( requirements['photo-id-required'] ) { %>
<li class="req req-1 req-id">
<h4 class="title"><%- gettext( "Identification" ) %></h4>
<div class="placeholder-art">
<i class="icon-list-alt icon-under"></i>
<i class="icon-user icon-over"></i>
</div>
<div class="copy">
<p>
<span class="copy-super"><%- gettext( "A photo identification document" ) %></span>
<span class="copy-sub"><%- gettext( "A driver's license, passport, or other government or school-issued ID with your name and picture on it." ) %></span>
</p>
</div>
</li>
<% } %>
<% if ( requirements['webcam-required']) { %>
<li class="req req-2 req-webcam">
<h4 class="title"><%- gettext( "Webcam" ) %></h4>
<div class="placeholder-art">
<i class="icon-facetime-video"></i>
</div>
<div class="copy">
<p>
<span class="copy-super"><%- gettext( "A webcam and a modern browser" ) %></span>
<span class="copy-sub"><strong>
<a rel="external" href="https://www.mozilla.org/en-US/firefox/new/">Firefox</a>,
<a rel="external" href="https://www.google.com/intl/en/chrome/browser/">Chrome</a>,
<a rel="external" href="http://www.apple.com/safari/">Safari</a>,
<a rel="external" href="http://windows.microsoft.com/en-us/internet-explorer/download-ie"><%- gettext("Internet Explorer 9 or later" ) %></a></strong>.
<%- gettext( "Please make sure your browser is updated to the most recent version possible." ) %>
</span>
</p>
</div>
</li>
<% } %>
<% if ( requirements['credit-card-required'] ) { %>
<li class="req req-3 req-payment">
<h4 class="title"><%- gettext( "Credit or Debit Card" ) %></h4>
<div class="placeholder-art">
<i class="icon-credit-card"></i>
</div>
<div class="copy">
<p>
<span class="copy-super"><%- gettext( "A major credit or debit card" ) %></span>
<span class="copy-sub"><%- gettext( "Visa, MasterCard, American Express, Discover, Diners Club, or JCB with the Discover logo." ) %></span>
</p>
</div>
</li>
<% } %>
</ul>
<div class="requirements-container"></div>
<% if ( nextStepTitle ) { %>
<nav class="nav-wizard is-ready">

2
lms/templates/verify_student/make_payment_step.underscore
View File

@@ -5,6 +5,8 @@
<p><%- gettext( "Make payment. TODO: actual copy here." ) %></p>
</div>
<div class="requirements-container"></div>
<div class="wrapper-task">
<ol class="review-tasks">
<% if ( suggestedPrices.length > 0 ) { %>

2
lms/templates/verify_student/pay_and_verify.html
View File

@@ -9,7 +9,7 @@ from verify_student.views import PayAndVerifyView
<%block name="bodyclass">register verification-process step-requirements</%block>
<%block name="pagetitle">${messages.page_title}</%block>
<%block name="header_extras">
% for template_name in ["progress", "webcam_photo", "error"]:
% for template_name in ["progress", "requirements", "webcam_photo", "error"]:
<script type="text/template" id="${template_name}-tpl">
<%static:include path="verify_student/${template_name}.underscore" />
</script>

57
lms/templates/verify_student/requirements.underscore Normal file
View File

@@ -0,0 +1,57 @@
<ul class="list-reqs">
<% if ( requirements['photo-id-required'] ) { %>
<li class="req req-1 req-id">
<h4 class="title"><%- gettext( "Identification" ) %></h4>
<div class="placeholder-art">
<i class="icon-list-alt icon-under"></i>
<i class="icon-user icon-over"></i>
</div>
<div class="copy">
<p>
<span class="copy-super"><%- gettext( "A photo identification document" ) %></span>
<span class="copy-sub"><%- gettext( "A driver's license, passport, or other government or school-issued ID with your name and picture on it." ) %></span>
</p>
</div>
</li>
<% } %>
<% if ( requirements['webcam-required'] ) { %>
<li class="req req-2 req-webcam">
<h4 class="title"><%- gettext( "Webcam" ) %></h4>
<div class="placeholder-art">
<i class="icon-facetime-video"></i>
</div>
<div class="copy">
<p>
<span class="copy-super"><%- gettext( "A webcam and a modern browser" ) %></span>
<span class="copy-sub"><strong>
<a rel="external" href="https://www.mozilla.org/en-US/firefox/new/">Firefox</a>,
<a rel="external" href="https://www.google.com/intl/en/chrome/browser/">Chrome</a>,
<a rel="external" href="http://www.apple.com/safari/">Safari</a>,
<a rel="external" href="http://windows.microsoft.com/en-us/internet-explorer/download-ie"><%- gettext("Internet Explorer 9 or later" ) %></a></strong>.
<%- gettext( "Please make sure your browser is updated to the most recent version possible." ) %>
</span>
</p>
</div>
</li>
<% } %>
<% if ( requirements['credit-card-required'] ) { %>
<li class="req req-3 req-payment">
<h4 class="title"><%- gettext( "Credit or Debit Card" ) %></h4>
<div class="placeholder-art">
<i class="icon-credit-card"></i>
</div>
<div class="copy">
<p>
<span class="copy-super"><%- gettext( "A major credit or debit card" ) %></span>
<span class="copy-sub"><%- gettext( "Visa, MasterCard, American Express, Discover, Diners Club, or JCB with the Discover logo." ) %></span>
</p>
</div>
</li>
<% } %>
</ul>