<%namespace name='static' file='../../static_content.html'/>

<%! from django.utils.translation import ugettext as _
import json
%>

<%static:require_module module_name="js/certificates/factories/certificate_whitelist_factory" class_name="CertificateWhitelistFactory">
        CertificateWhitelistFactory('${json.dumps(certificate_white_list)}', "${generate_certificate_exceptions_url}", "${certificate_exception_view_url}", "${generate_bulk_certificate_exceptions_url}");
</%static:require_module>

<%static:require_module module_name="js/certificates/factories/certificate_invalidation_factory" class_name="CertificateInvalidationFactory">
        CertificateInvalidationFactory('${json.dumps(certificate_invalidations)}', '${certificate_invalidation_view_url}');
</%static:require_module>

<%page args="section_data"/>
<div class="certificates-wrapper">

    <div class="example-certificates">
        % if not section_data['html_cert_enabled']:
        <h2>${_('Example Certificates')}</h2>

        <div class="generate-example-certificates-wrapper">
            <p>${_('Generate example certificates for the course.')}</p>

            <form id="generate-example-certificates-form" method="post" action="${section_data['urls']['generate_example_certificates']}">
                <input type="hidden" name="csrfmiddlewaretoken" value="${csrf_token}">
                <input type="submit" class="btn-blue" id="generate-example-certificates-submit" value="${_('Generate Example Certificates')}"/>
            </form>
        </div>
        % endif

        % if section_data['example_certificate_status'] is not None:
        <div class="example-certificate-status-wrapper">
            <p>${_("Status:")}</p>
            <ul>
            % for cert_status in section_data['example_certificate_status']:
                % if cert_status['status'] == 'started':
                    <li>${_('Generating example {name} certificate').format(name=cert_status['description'])}</li>
                % elif cert_status['status'] == 'error':
                    <li>${_('Error generating example {name} certificate: {error}').format(name=cert_status['description'], error=cert_status['error_reason'])}</li>
                % elif cert_status['status'] == 'success':
                    <li><a href="${cert_status['download_url']}">${_('View {name} certificate').format(name=cert_status['description'])}</a></li>
                </li>
                % endif
            % endfor
            </ul>
            <button class="btn-blue" id="refresh-example-certificate-status">${_("Refresh Status")}</button>
        </div>
        % endif
    </div>

    <hr />

    <div class="enable-certificates">
        <h2>${_("Student-Generated Certificates")}</h2>
        % if section_data['enabled_for_course']:
            <form id="enable-certificates-form" method="post" action="${section_data['urls']['enable_certificate_generation']}">
                <input type="hidden" name="csrfmiddlewaretoken" value="${csrf_token}">
                <input type="hidden" id="certificates-enabled" name="certificates-enabled" value="false" />
                <input type="submit" class="btn-blue" id="disable-certificates-submit" value="${_('Disable Student-Generated Certificates')}"/>
            </form>
        % elif section_data['can_enable_for_course']:
            <form id="enable-certificates-form" method="post" action="${section_data['urls']['enable_certificate_generation']}">
                <input type="hidden" name="csrfmiddlewaretoken" value="${csrf_token}">
                <input type="hidden" id="certificates-enabled" name="certificates-enabled" value="true" />
                <input type="submit" class="btn-blue" id="enable-certificates-submit" value="${_('Enable Student-Generated Certificates')}"/>
            </form>
        % else:
            <p>${_("You must successfully generate example certificates before you enable student-generated certificates.")}</p>
            <button class="is-disabled" disabled>${_('Enable Student-Generated Certificates')}</button>
        % endif
    </div>

    % if section_data['instructor_generation_enabled'] and not (section_data['enabled_for_course'] and section_data['html_cert_enabled']):
        <hr class="section-divider" />

        <div class="start-certificate-generation">
            <h2>${_("Generate Certificates")}</h2>
            <form id="certificates-generating-form" method="post" action="${section_data['urls']['start_certificate_generation']}">
                % if section_data['html_cert_enabled'] and section_data['active_certificate'] is None:
                    <p>${_("Course certificate generation requires an activated web certificate configuration.")}</p>
                    <input type="button" id="disabled-btn-start-generating-certificates" class="is-disabled" aria-disabled="true" value="${_('Generate Certificates')}"/>
                % else:
                    <p class="under-heading">
                        ${_("When you are ready to generate certificates for your course, click Generate Certificates. You do not need to do this<br/>if you have set the certificate mode to on-demand generation.")}
                    </p>
                    <input type="button" class="btn-blue" id="btn-start-generating-certificates" value="${_('Generate Certificates')}" data-endpoint="${section_data['urls']['start_certificate_generation']}"/>
                %endif
            </form>
            <div class="certificate-generation-status"></div>
        </div>

        %if settings.FEATURES.get('ENABLE_INSTRUCTOR_BACKGROUND_TASKS'):
            <div class="running-tasks-container action-type-container">
                <hr>
                <h2> ${_("Pending Tasks")} </h2>
                <div class="running-tasks-section">
                    <p>${_("The status for any active tasks appears in a table below.")} </p>
                    <br />
                    <div class="running-tasks-table" data-endpoint="${ section_data['urls']['list_instructor_tasks_url'] }"></div>
                </div>
                <div class="no-pending-tasks-message"></div>
            </div>
        %endif
    % endif

    <hr>
    <p class="start-certificate-regeneration">
        <h2>${_("Regenerate Certificates")}</h2>
        <form id="certificate-regenerating-form" method="post" action="${section_data['urls']['start_certificate_regeneration']}">
            <p class="under-heading">
                ${_('To regenerate certificates for your course, choose the learners who will receive regenerated certificates and click <br/> Regenerate Certificates.')}
            </p>

                <label style="display: inline" for="certificate_status_${section_data['status'].downloadable}">
                    <input id="certificate_status_${section_data['status'].downloadable}" type="checkbox" name="certificate_statuses" value="${section_data['status'].downloadable}">
                    ${_("Regenerate for learners who have already received certificates. ({count})").format(count=section_data['certificate_statuses_with_count'].get(section_data['status'].downloadable, 0))}
                </label>
                <br/>
                <label style="display: inline" for="certificate_status_${section_data['status'].notpassing}">
                    <input id="certificate_status_${section_data['status'].notpassing}" type="checkbox" name="certificate_statuses" value="${section_data['status'].notpassing}">
                    ${_("Regenerate for learners who have not received certificates. ({count})").format(count=section_data['certificate_statuses_with_count'].get(section_data['status'].notpassing, 0))}
                </label>
                <br/>
                <label style="display: inline" for="certificate_status_${section_data['status'].error}">
                    <input id="certificate_status_${section_data['status'].error}" type="checkbox" name="certificate_statuses" value="${section_data['status'].error}">
                    ${_("Regenerate for learners in an error state. ({count})").format(count=section_data['certificate_statuses_with_count'].get(section_data['status'].error, 0))}
                </label>
                <br/>
                <br/>

            <input type="button" class="btn-blue" id="btn-start-regenerating-certificates" value="${_('Regenerate Certificates')}" data-endpoint="${section_data['urls']['start_certificate_regeneration']}"/>
        </form>
        <div class="certificate-regeneration-status"></div>

    <hr>
    <div class="certificate-generation-history">
        <h2 class="title">${_("Certificate Generation History")}</h2>
        <div class="certificate-generation-history-content">
            <table>
                <thead>
                <tr>
                    <td class="task-name"></td>
                    <td class="task-date"></td>
                    <td class="task-details"></td>
                </tr>
                </thead>
                <tbody>
                % for history in section_data['certificate_generation_history']:
                    <tr>
                        <td>${history.get_task_name().title()}</td>
                        <td>${history.created.strftime("%B %d, %Y")}</td>
                        <td>${history.get_certificate_generation_candidates()}</td>
                    </tr>
                % endfor
                </tbody>
            </table>
        </div>
    </div>

    <div class="certificate-exception-container">
        <hr class="section-divider">
        <h2> ${_("SET CERTIFICATE EXCEPTIONS")} </h2>
         <p class="under-heading info">
             ${_("Set exceptions to generate certificates for learners who did not qualify for a certificate but have " \
              "been given an exception by the course team. After you add learners to the exception list, click Generate " \
              "Exception Certificates below.")}
         </p>
        <div class="certificate-exception-section">
            <div id="certificate-white-list-editor"></div>
            <div class="bulk-white-list-exception"></div>
            <div class="white-listed-students" id="white-listed-students">
                <div class="ui-loading">
                    <span class="spin"><i class="icon fa fa-refresh" aria-hidden="true"></i></span> <span class="copy">${_('Loading')}</span>
                </div>
            </div>
            <br/>
        </div>
        <div class="no-pending-tasks-message"></div>
    </div>

    <hr class="section-divider" />

    <div class="certificate-invalidation-container">
        <h2> ${_("Invalidate Certificates")} </h2>
        <div id="certificate-invalidation">
            <div class="ui-loading">
                <span class="spin"><i class="icon fa fa-refresh" aria-hidden="true"></i></span> <span class="copy">${_('Loading')}</span>
            </div>
        </div>
    </div>

</div>
