edx-platform/cms/templates/certificates.html

<%inherit file="base.html" />
<%def name="online_help_token()"><% return "certificates" %></%def>
<%namespace name='static' file='static_content.html'/>
<%!
from contentstore import utils
from django.utils.translation import ugettext as _
from openedx.core.djangolib.js_utils import (
    dump_js_escaped_json, js_escaped_string
)
%>

<%block name="title">${_("Course Certificates")}</%block>
<%block name="bodyclass">is-signedin course view-certificates</%block>

<%block name="header_extras">
% for template_name in ["certificate-details", "certificate-editor", "signatory-editor", "signatory-details", "basic-modal", "modal-button", "list", "upload-dialog", "certificate-web-preview", "signatory-actions"]:
  <script type="text/template" id="${template_name}-tpl">
    <%static:include path="js/${template_name}.underscore" />
  </script>
% endfor
</%block>

<%block name="jsextra">
<script type="text/javascript">
window.CMS = window.CMS || {};
CMS.URL = CMS.URL || {};
CMS.User = CMS.User || {};
CMS.URL.UPLOAD_ASSET = '${upload_asset_url}';
CMS.User.isGlobalStaff = '${is_global_staff}'=='True' ? true : false;
</script>
</%block>

<%block name="requirejs">
% if has_certificate_modes:
  require(["js/certificates/factories/certificates_page_factory"], function(CertificatesPageFactory) {
      CertificatesPageFactory(
          ${certificates | n, dump_js_escaped_json},
          "${certificate_url | n, js_escaped_string}",
          "${course_outline_url | n, js_escaped_string}",
          ${course_modes | n, dump_js_escaped_json},
          ${certificate_web_view_url | n, dump_js_escaped_json},
          ${is_active | n, dump_js_escaped_json},
          ${certificate_activation_handler_url | n, dump_js_escaped_json}
      );
  });
% endif
</%block>

<%block name="content">
  <div class="wrapper-mast wrapper">
    <header class="mast has-actions has-subtitle">
      <h1 class="page-header">
        <small class="subtitle">${_("Settings")}</small>
        <span class="sr">&gt; </span>${_("Certificates")}
      </h1>
      <div class="preview-certificate nav-actions"></div>
    </header>
  </div>

  <div class="wrapper-content wrapper">
    <section class="content">
      <article class="content-primary" role="main">
        <div class="wrapper-certificates certificates-list">
          <h2 class="sr title">${_("Certificates")}</h2>
          % if certificates is None:
            <div class="notice notice-incontext notice-moduledisabled">
                <p class="copy">
                    ${_("This module is not enabled.")}
                </p>
            </div>
          % elif not has_certificate_modes:
            <div class="notice notice-incontext notice-moduledisabled">
                <p class="copy">
                    ${_("This course does not use a mode that offers certificates.")}
                </p>
            </div>
          % else:
            <div class="ui-loading">
                <p><span class="spin"><i class="icon fa fa-refresh" aria-hidden="true"></i></span> <span class="copy">${_("Loading")}</span></p>
            </div>
          % endif
        </div>
      </article>
      <aside class="content-supplementary" role="complementary">
        <div class="bit">
          <div class="certificates-doc">
            <h2 class="title-3">${_("Certificates")}</h2>
            <h3 class="title-3">${_("Working with Certificates")}</h3>
            <p>${_("Specify a course title to use on the certificate if the course's official title is too long to be displayed well.")}</p>
            <p>${_("For verified certificates, specify between one and four signatories and upload the associated images.")}</p>
            <p>${_("To edit or delete a certificate before it is activated, hover over the top right corner of the form and select {em_start}Edit{em_end} or the delete icon.").format(em_start="<strong>", em_end="</strong>")}</p>
            <p>${_("To view a sample certificate, choose a course mode and select {em_start}Preview Certificate{em_end}.").format(em_start='<strong>', em_end="</strong>")}</p>
            
            <h3 class="title-3">${_("Issuing Certificates to Learners")}</h3>
            <p>${_("To begin issuing certificates, a course team member with the Admin role selects {em_start}Activate{em_end}. Course team members without the Admin role cannot edit or delete an activated certificate.").format(em_start='<strong>', em_end="</strong>")}</p>
            <p>${_("{em_start}Do not{em_end} delete certificates after a course has started; learners who have already earned certificates will no longer be able to access them.").format(em_start="<strong>", em_end="</strong>")}</p>
            <p><a href="${get_online_help_info(online_help_token())['doc_url']}" target="_blank" class="button external-help-button">${_("Learn more about certificates")}</a></p>
          </div>
        </div>
        <div class="bit">
        % if context_course:
          <%
            details_url = utils.reverse_course_url('settings_handler', context_course.id)
            grading_url = utils.reverse_course_url('grading_handler', context_course.id)
            course_team_url = utils.reverse_course_url('course_team_handler', context_course.id)
            advanced_settings_url = utils.reverse_course_url('advanced_settings_handler', context_course.id)
          %>
        <h2 class="title-3">${_("Other Course Settings")}</h2>
          <nav class="nav-related" aria-label="${_('Other Course Settings')}">
            <ul>
              <li class="nav-item"><a href="${details_url}">${_("Details &amp; Schedule")}</a></li>
              <li class="nav-item"><a href="${grading_url}">${_("Grading")}</a></li>
              <li class="nav-item"><a href="${course_team_url}">${_("Course Team")}</a></li>
              <li class="nav-item"><a href="${advanced_settings_url}">${_("Advanced Settings")}</a></li>
              <li class="nav-item"><a href="${utils.reverse_course_url('group_configurations_list_handler', context_course.id)}">${_("Group Configurations")}</a></li>
            </ul>
          </nav>
        % endif
        </div>
      </aside>
    </section>
  </div>
</%block>