Commit d3c3f734 by Will Daly

Combine payment and intro step

parent 18f69809
...@@ -967,8 +967,8 @@ class TestPayAndVerifyView(UrlResetMixin, ModuleStoreTestCase): ...@@ -967,8 +967,8 @@ class TestPayAndVerifyView(UrlResetMixin, ModuleStoreTestCase):
self._assert_displayed_mode(response, course_mode) self._assert_displayed_mode(response, course_mode)
self._assert_steps_displayed( self._assert_steps_displayed(
response, response,
PayAndVerifyView.ALL_STEPS, PayAndVerifyView.PAYMENT_STEPS + PayAndVerifyView.VERIFICATION_STEPS,
PayAndVerifyView.INTRO_STEP PayAndVerifyView.MAKE_PAYMENT_STEP
) )
self._assert_messaging(response, PayAndVerifyView.FIRST_TIME_VERIFY_MSG) self._assert_messaging(response, PayAndVerifyView.FIRST_TIME_VERIFY_MSG)
self._assert_requirements_displayed(response, [ self._assert_requirements_displayed(response, [
...@@ -977,15 +977,6 @@ class TestPayAndVerifyView(UrlResetMixin, ModuleStoreTestCase): ...@@ -977,15 +977,6 @@ class TestPayAndVerifyView(UrlResetMixin, ModuleStoreTestCase):
PayAndVerifyView.CREDIT_CARD_REQ, 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") @ddt.data("expired", "denied")
def test_start_flow_expired_or_denied_verification(self, verification_status): def test_start_flow_expired_or_denied_verification(self, verification_status):
course = self._create_course("verified") course = self._create_course("verified")
...@@ -996,7 +987,7 @@ class TestPayAndVerifyView(UrlResetMixin, ModuleStoreTestCase): ...@@ -996,7 +987,7 @@ class TestPayAndVerifyView(UrlResetMixin, ModuleStoreTestCase):
# Expect the same content as when the user has not verified # Expect the same content as when the user has not verified
self._assert_steps_displayed( self._assert_steps_displayed(
response, response,
PayAndVerifyView.STEPS_WITHOUT_PAYMENT, [PayAndVerifyView.INTRO_STEP] + PayAndVerifyView.VERIFICATION_STEPS,
PayAndVerifyView.INTRO_STEP PayAndVerifyView.INTRO_STEP
) )
self._assert_messaging(response, PayAndVerifyView.FIRST_TIME_VERIFY_MSG) self._assert_messaging(response, PayAndVerifyView.FIRST_TIME_VERIFY_MSG)
...@@ -1020,8 +1011,8 @@ class TestPayAndVerifyView(UrlResetMixin, ModuleStoreTestCase): ...@@ -1020,8 +1011,8 @@ class TestPayAndVerifyView(UrlResetMixin, ModuleStoreTestCase):
self._assert_displayed_mode(response, course_mode) self._assert_displayed_mode(response, course_mode)
self._assert_steps_displayed( self._assert_steps_displayed(
response, response,
PayAndVerifyView.STEPS_WITHOUT_VERIFICATION, PayAndVerifyView.PAYMENT_STEPS,
PayAndVerifyView.INTRO_STEP PayAndVerifyView.MAKE_PAYMENT_STEP
) )
self._assert_messaging(response, PayAndVerifyView.FIRST_TIME_VERIFY_MSG) self._assert_messaging(response, PayAndVerifyView.FIRST_TIME_VERIFY_MSG)
self._assert_requirements_displayed(response, [ self._assert_requirements_displayed(response, [
...@@ -1036,7 +1027,7 @@ class TestPayAndVerifyView(UrlResetMixin, ModuleStoreTestCase): ...@@ -1036,7 +1027,7 @@ class TestPayAndVerifyView(UrlResetMixin, ModuleStoreTestCase):
self._assert_displayed_mode(response, course_mode) self._assert_displayed_mode(response, course_mode)
self._assert_steps_displayed( self._assert_steps_displayed(
response, response,
PayAndVerifyView.STEPS_WITHOUT_PAYMENT, [PayAndVerifyView.INTRO_STEP] + PayAndVerifyView.VERIFICATION_STEPS,
PayAndVerifyView.INTRO_STEP PayAndVerifyView.INTRO_STEP
) )
self._assert_messaging(response, PayAndVerifyView.FIRST_TIME_VERIFY_MSG) self._assert_messaging(response, PayAndVerifyView.FIRST_TIME_VERIFY_MSG)
...@@ -1056,8 +1047,8 @@ class TestPayAndVerifyView(UrlResetMixin, ModuleStoreTestCase): ...@@ -1056,8 +1047,8 @@ class TestPayAndVerifyView(UrlResetMixin, ModuleStoreTestCase):
response = self._get_page('verify_student_start_flow', course.id) response = self._get_page('verify_student_start_flow', course.id)
self._assert_steps_displayed( self._assert_steps_displayed(
response, response,
PayAndVerifyView.STEPS_WITHOUT_VERIFICATION, PayAndVerifyView.PAYMENT_STEPS,
PayAndVerifyView.INTRO_STEP PayAndVerifyView.MAKE_PAYMENT_STEP
) )
self._assert_requirements_displayed(response, [ self._assert_requirements_displayed(response, [
PayAndVerifyView.CREDIT_CARD_REQ, PayAndVerifyView.CREDIT_CARD_REQ,
...@@ -1074,8 +1065,8 @@ class TestPayAndVerifyView(UrlResetMixin, ModuleStoreTestCase): ...@@ -1074,8 +1065,8 @@ class TestPayAndVerifyView(UrlResetMixin, ModuleStoreTestCase):
response = self._get_page('verify_student_start_flow', course.id) response = self._get_page('verify_student_start_flow', course.id)
self._assert_steps_displayed( self._assert_steps_displayed(
response, response,
PayAndVerifyView.STEPS_WITHOUT_VERIFICATION, PayAndVerifyView.PAYMENT_STEPS,
PayAndVerifyView.INTRO_STEP PayAndVerifyView.MAKE_PAYMENT_STEP
) )
self._assert_requirements_displayed(response, [ self._assert_requirements_displayed(response, [
PayAndVerifyView.CREDIT_CARD_REQ, PayAndVerifyView.CREDIT_CARD_REQ,
...@@ -1110,7 +1101,7 @@ class TestPayAndVerifyView(UrlResetMixin, ModuleStoreTestCase): ...@@ -1110,7 +1101,7 @@ class TestPayAndVerifyView(UrlResetMixin, ModuleStoreTestCase):
# but we start after the payment step (because it's already completed). # but we start after the payment step (because it's already completed).
self._assert_steps_displayed( self._assert_steps_displayed(
response, response,
PayAndVerifyView.ALL_STEPS, PayAndVerifyView.PAYMENT_STEPS + PayAndVerifyView.VERIFICATION_STEPS,
PayAndVerifyView.FACE_PHOTO_STEP PayAndVerifyView.FACE_PHOTO_STEP
) )
...@@ -1185,7 +1176,7 @@ class TestPayAndVerifyView(UrlResetMixin, ModuleStoreTestCase): ...@@ -1185,7 +1176,7 @@ class TestPayAndVerifyView(UrlResetMixin, ModuleStoreTestCase):
# Expect that the payment steps are NOT displayed # Expect that the payment steps are NOT displayed
self._assert_steps_displayed( self._assert_steps_displayed(
response, response,
PayAndVerifyView.STEPS_WITHOUT_PAYMENT, [PayAndVerifyView.INTRO_STEP] + PayAndVerifyView.VERIFICATION_STEPS,
PayAndVerifyView.INTRO_STEP PayAndVerifyView.INTRO_STEP
) )
self._assert_requirements_displayed(response, [ self._assert_requirements_displayed(response, [
...@@ -1218,7 +1209,7 @@ class TestPayAndVerifyView(UrlResetMixin, ModuleStoreTestCase): ...@@ -1218,7 +1209,7 @@ class TestPayAndVerifyView(UrlResetMixin, ModuleStoreTestCase):
# but we start at the payment confirmation step # but we start at the payment confirmation step
self._assert_steps_displayed( self._assert_steps_displayed(
response, response,
PayAndVerifyView.ALL_STEPS, PayAndVerifyView.PAYMENT_STEPS + PayAndVerifyView.VERIFICATION_STEPS,
PayAndVerifyView.PAYMENT_CONFIRMATION_STEP, PayAndVerifyView.PAYMENT_CONFIRMATION_STEP,
) )
...@@ -1246,7 +1237,7 @@ class TestPayAndVerifyView(UrlResetMixin, ModuleStoreTestCase): ...@@ -1246,7 +1237,7 @@ class TestPayAndVerifyView(UrlResetMixin, ModuleStoreTestCase):
# but we start on the first verify step # but we start on the first verify step
self._assert_steps_displayed( self._assert_steps_displayed(
response, response,
PayAndVerifyView.ALL_STEPS, PayAndVerifyView.PAYMENT_STEPS + PayAndVerifyView.VERIFICATION_STEPS,
PayAndVerifyView.FACE_PHOTO_STEP, PayAndVerifyView.FACE_PHOTO_STEP,
) )
...@@ -1264,7 +1255,7 @@ class TestPayAndVerifyView(UrlResetMixin, ModuleStoreTestCase): ...@@ -1264,7 +1255,7 @@ class TestPayAndVerifyView(UrlResetMixin, ModuleStoreTestCase):
# to the dashboard. # to the dashboard.
self._assert_steps_displayed( self._assert_steps_displayed(
response, response,
PayAndVerifyView.STEPS_WITHOUT_VERIFICATION, PayAndVerifyView.PAYMENT_STEPS,
PayAndVerifyView.PAYMENT_CONFIRMATION_STEP, PayAndVerifyView.PAYMENT_CONFIRMATION_STEP,
) )
...@@ -1283,7 +1274,7 @@ class TestPayAndVerifyView(UrlResetMixin, ModuleStoreTestCase): ...@@ -1283,7 +1274,7 @@ class TestPayAndVerifyView(UrlResetMixin, ModuleStoreTestCase):
# payment confirmation step # payment confirmation step
self._assert_steps_displayed( self._assert_steps_displayed(
response, response,
PayAndVerifyView.STEPS_WITHOUT_VERIFICATION, PayAndVerifyView.PAYMENT_STEPS,
PayAndVerifyView.PAYMENT_CONFIRMATION_STEP, PayAndVerifyView.PAYMENT_CONFIRMATION_STEP,
) )
...@@ -1318,8 +1309,8 @@ class TestPayAndVerifyView(UrlResetMixin, ModuleStoreTestCase): ...@@ -1318,8 +1309,8 @@ class TestPayAndVerifyView(UrlResetMixin, ModuleStoreTestCase):
self._assert_displayed_mode(response, course_mode) self._assert_displayed_mode(response, course_mode)
self._assert_steps_displayed( self._assert_steps_displayed(
response, response,
PayAndVerifyView.ALL_STEPS, PayAndVerifyView.PAYMENT_STEPS + PayAndVerifyView.VERIFICATION_STEPS,
PayAndVerifyView.INTRO_STEP PayAndVerifyView.MAKE_PAYMENT_STEP
) )
self._assert_messaging(response, PayAndVerifyView.UPGRADE_MSG) self._assert_messaging(response, PayAndVerifyView.UPGRADE_MSG)
self._assert_requirements_displayed(response, [ self._assert_requirements_displayed(response, [
...@@ -1336,8 +1327,8 @@ class TestPayAndVerifyView(UrlResetMixin, ModuleStoreTestCase): ...@@ -1336,8 +1327,8 @@ class TestPayAndVerifyView(UrlResetMixin, ModuleStoreTestCase):
response = self._get_page('verify_student_upgrade_and_verify', course.id) response = self._get_page('verify_student_upgrade_and_verify', course.id)
self._assert_steps_displayed( self._assert_steps_displayed(
response, response,
PayAndVerifyView.STEPS_WITHOUT_VERIFICATION, PayAndVerifyView.PAYMENT_STEPS,
PayAndVerifyView.INTRO_STEP PayAndVerifyView.MAKE_PAYMENT_STEP
) )
self._assert_messaging(response, PayAndVerifyView.UPGRADE_MSG) self._assert_messaging(response, PayAndVerifyView.UPGRADE_MSG)
self._assert_requirements_displayed(response, [ self._assert_requirements_displayed(response, [
......
...@@ -259,16 +259,6 @@ class PayAndVerifyView(View): ...@@ -259,16 +259,6 @@ class PayAndVerifyView(View):
ENROLLMENT_CONFIRMATION_STEP 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 = namedtuple(
'Step', 'Step',
[ [
...@@ -395,7 +385,7 @@ class PayAndVerifyView(View): ...@@ -395,7 +385,7 @@ class PayAndVerifyView(View):
def get( def get(
self, request, course_id, self, request, course_id,
always_show_payment=False, always_show_payment=False,
current_step=INTRO_STEP, current_step=None,
message=FIRST_TIME_VERIFY_MSG message=FIRST_TIME_VERIFY_MSG
): ):
"""Render the pay/verify requirements page. """Render the pay/verify requirements page.
...@@ -462,6 +452,9 @@ class PayAndVerifyView(View): ...@@ -462,6 +452,9 @@ class PayAndVerifyView(View):
) )
requirements = self._requirements(display_steps) requirements = self._requirements(display_steps)
if current_step is None:
current_step = display_steps[0]['name']
# Allow the caller to skip the first page # Allow the caller to skip the first page
# This is useful if we want the user to be able to # This is useful if we want the user to be able to
# use the "back" button to return to the previous step. # use the "back" button to return to the previous step.
...@@ -605,6 +598,10 @@ class PayAndVerifyView(View): ...@@ -605,6 +598,10 @@ class PayAndVerifyView(View):
if already_paid and not always_show_payment: if already_paid and not always_show_payment:
remove_steps |= set(self.PAYMENT_STEPS) 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 [ return [
{ {
......
...@@ -1077,6 +1077,7 @@ verify_student_js = [ ...@@ -1077,6 +1077,7 @@ verify_student_js = [
'js/verify_student/views/error_view.js', 'js/verify_student/views/error_view.js',
'js/verify_student/views/webcam_photo_view.js', 'js/verify_student/views/webcam_photo_view.js',
'js/verify_student/views/progress_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/step_view.js',
'js/verify_student/views/intro_step_view.js', 'js/verify_student/views/intro_step_view.js',
'js/verify_student/views/make_payment_step_view.js', 'js/verify_student/views/make_payment_step_view.js',
......
...@@ -41,6 +41,7 @@ var edx = edx || {}; ...@@ -41,6 +41,7 @@ var edx = edx || {};
requirements: el.data('requirements') requirements: el.data('requirements')
}, },
'make-payment-step': { 'make-payment-step': {
requirements: el.data('requirements'),
courseKey: el.data('course-key'), courseKey: el.data('course-key'),
minPrice: el.data('course-mode-min-price'), minPrice: el.data('course-mode-min-price'),
suggestedPrices: (el.data('course-mode-suggested-prices') || "").split(","), suggestedPrices: (el.data('course-mode-suggested-prices') || "").split(","),
......
...@@ -8,12 +8,21 @@ var edx = edx || {}; ...@@ -8,12 +8,21 @@ var edx = edx || {};
edx.verify_student = edx.verify_student || {}; edx.verify_student = edx.verify_student || {};
// Currently, this view doesn't need to install any custom event handlers, edx.verify_student.IntroStepView = edx.verify_student.StepView.extend({
// since the button in the template reloads the page with a
// ?skip-intro=1 GET parameter. The reason for this is that we // Currently, this view doesn't need to install any custom event handlers,
// want to allow users to click "back" to see the requirements, // since the button in the template reloads the page with a
// and if they reload the page we want them to stay on the // ?skip-intro=1 GET parameter. The reason for this is that we
// second step. // want to allow users to click "back" to see the requirements,
edx.verify_student.IntroStepView = edx.verify_student.StepView.extend({}); // 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 ); })( jQuery );
...@@ -11,6 +11,12 @@ var edx = edx || {}; ...@@ -11,6 +11,12 @@ var edx = edx || {};
edx.verify_student.MakePaymentStepView = edx.verify_student.StepView.extend({ edx.verify_student.MakePaymentStepView = edx.verify_student.StepView.extend({
postRender: function() { 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 // Enable the payment button once an amount is chosen
$( "input[name='contribution']" ).on( 'click', _.bind( this.enablePaymentButton, this ) ); $( "input[name='contribution']" ).on( 'click', _.bind( this.enablePaymentButton, this ) );
......
/**
* 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 );
...@@ -3,63 +3,7 @@ ...@@ -3,63 +3,7 @@
<h3 class="title"><%- introTitle %></h3> <h3 class="title"><%- introTitle %></h3>
<div class="instruction"><p><%- introMsg %></p></div> <div class="instruction"><p><%- introMsg %></p></div>
<ul class="list-reqs"> <div class="requirements-container"></div>
<% 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>
<% if ( nextStepTitle ) { %> <% if ( nextStepTitle ) { %>
<nav class="nav-wizard is-ready"> <nav class="nav-wizard is-ready">
......
...@@ -5,6 +5,8 @@ ...@@ -5,6 +5,8 @@
<p><%- gettext( "Make payment. TODO: actual copy here." ) %></p> <p><%- gettext( "Make payment. TODO: actual copy here." ) %></p>
</div> </div>
<div class="requirements-container"></div>
<div class="wrapper-task"> <div class="wrapper-task">
<ol class="review-tasks"> <ol class="review-tasks">
<% if ( suggestedPrices.length > 0 ) { %> <% if ( suggestedPrices.length > 0 ) { %>
......
...@@ -9,7 +9,7 @@ from verify_student.views import PayAndVerifyView ...@@ -9,7 +9,7 @@ from verify_student.views import PayAndVerifyView
<%block name="bodyclass">register verification-process step-requirements</%block> <%block name="bodyclass">register verification-process step-requirements</%block>
<%block name="pagetitle">${messages.page_title}</%block> <%block name="pagetitle">${messages.page_title}</%block>
<%block name="header_extras"> <%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"> <script type="text/template" id="${template_name}-tpl">
<%static:include path="verify_student/${template_name}.underscore" /> <%static:include path="verify_student/${template_name}.underscore" />
</script> </script>
......
<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>
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