pay_and_verify.html 4.9 KB
Newer Older
1 2 3 4 5 6 7 8 9
<%!
import json
from django.utils.translation import ugettext as _
from verify_student.views import PayAndVerifyView
%>
<%namespace name='static' file='../static_content.html'/>

<%inherit file="../main.html" />
<%block name="bodyclass">register verification-process step-requirements</%block>
10 11 12

<%block name="pagetitle">
  % if message_key == PayAndVerifyView.UPGRADE_MSG:
13
    ${_("Upgrade Your Enrollment For {course_name}.").format(course_name=course.display_name) | h}
14
  % elif message_key == PayAndVerifyView.PAYMENT_CONFIRMATION_MSG:
15
    ${_("Receipt For {course_name}").format(course_name=course.display_name) | h}
16
  % elif message_key in [PayAndVerifyView.VERIFY_NOW_MSG, PayAndVerifyView.VERIFY_LATER_MSG]:
17
    ${_("Verify For {course_name}").format(course_name=course.display_name) | h}
18
  % else:
19
    ${_("Enroll In {course_name}").format(course_name=course.display_name) | h}
20 21 22
  % endif
</%block>

23
<%block name="header_extras">
24 25
    <%
      template_names = (
26
          ["webcam_photo", "image_input", "error"] +
27 28
          ["intro_step", "make_payment_step", "payment_confirmation_step"] +
          ["face_photo_step", "id_photo_step", "review_photos_step", "enrollment_confirmation_step"]
29 30 31
      )
    %>
    % for template_name in template_names:
32 33 34 35 36 37 38
        <script type="text/template" id="${template_name}-tpl">
            <%static:include path="verify_student/${template_name}.underscore" />
        </script>
    % endfor
</%block>
<%block name="js_extra">
  <script src="${static.url('js/vendor/underscore.string.min.js')}"></script>
39
  <script src="${static.url('js/src/tooltip_manager.js')}"></script>
40 41 42 43 44 45 46 47 48 49 50 51 52 53 54
  <%static:js group='verify_student'/>
</%block>

<%block name="content">
## Top-level wrapper for errors
## JavaScript views may append to this wrapper
<div id="error-container" style="display: none;"></div>

<div class="container">
  <section class="wrapper carousel">
    ## Payment / Verification flow
    ## Most of these data attributes are used to dynamically render
    ## the steps, but some are just useful for A/B test setup.
    <div
      id="pay-and-verify-container"
55
      class="pay-and-verify"
56 57 58
      data-full-name='${user_full_name}'
      data-platform-name='${platform_name}'
      data-course-key='${course_key}'
59
      data-course-name='${course.display_name|h}'
60 61 62 63 64
      data-course-start-date='${course.start_datetime_text()}'
      data-courseware-url='${courseware_url}'
      data-course-mode-name='${course_mode.name}'
      data-course-mode-slug='${course_mode.slug}'
      data-course-mode-min-price='${course_mode.min_price}'
65
      data-course-mode-sku='${course_mode.sku or ''}'
66 67
      data-course-mode-suggested-prices='${course_mode.suggested_prices}'
      data-course-mode-currency='${course_mode.currency}'
68
      data-contribution-amount='${contribution_amount}'
jsa committed
69
      data-processors='${json.dumps(processors)}'
70
      data-verification-deadline='${verification_deadline}'
71
      data-display-steps='${json.dumps(display_steps) | h}'
72 73 74
      data-current-step='${current_step}'
      data-requirements='${json.dumps(requirements)}'
      data-msg-key='${message_key}'
75
      data-is-active='${is_active}'
76 77
      data-already-verified='${already_verified}'
      data-verification-good-until='${verification_good_until}'
78
      data-capture-sound='${capture_sound}'
79

80 81 82
      ## If we reached the verification flow from an in-course checkpoint,
      ## then pass the checkpoint location in so that we can associate
      ## the attempt with the checkpoint on submission.
83 84 85
      % if checkpoint_location is not None:
        data-checkpoint-location='${checkpoint_location}'
      % endif
86 87
    ></div>

88
    % if is_active:
89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110
    ## Support
    <div class="wrapper-content-supplementary">
      <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>

              % if PayAndVerifyView.WEBCAM_REQ in requirements:
              <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>webcam 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>
              % endif
          </ul>
        </aside>
    </div>
111
    % endif
112 113 114 115

  </section>
</div>
</%block>