{% load i18n %}
<div class="sequence proctored-exam entrance" data-exam-id="{{exam_id}}">
  <h3>
    {% blocktrans %}
      Try a proctored exam
    {% endblocktrans %}
  </h3>
  <p>
    {% blocktrans %}
      Get familiar with proctoring for real exams later in the course. This practice exam has no impact
      on your grade in the course.
    {% endblocktrans %}
  </p>
  <button class="gated-sequence start-timed-exam" data-ajax-url="{{enter_exam_endpoint}}" data-exam-id="{{exam_id}}" data-attempt-proctored=true data-start-immediately=false>
    <a>
      {% trans "Continue to my practice exam" %}
    </a>
    <p>
      {% blocktrans %}
        You will be guided through steps to set up online proctoring software and to perform various checks.
      {% endblocktrans %}
    </p>

    <i class="fa fa-arrow-circle-right practice-exam start-timed-exam" data-ajax-url="{{enter_exam_endpoint}}" data-exam-id="{{exam_id}}" data-attempt-proctored=true data-start-immediately=false></i>
  </button>
</div>
{% include 'proctoring/seq_proctored_practice_exam_footer.html' %}

<script type="text/javascript">

  var inProcess = false;

  var disableClickEvent = function () {
    inProcess = true;
    $('body').css('cursor', 'wait');
    $('.start-timed-exam').css('cursor', 'wait');
  };

  var enableClickEvent = function () {
    inProcess = false;
    $('body').css('cursor', 'auto');
    $('.start-timed-exam').css('cursor', 'auto');
  };

  $('.start-timed-exam').click(function () {
      if (!inProcess) {
        disableClickEvent();
        var action_url = $(this).data('ajax-url');
        var exam_id = $(this).data('exam-id');
        var attempt_proctored = $(this).data('attempt-proctored');
        var start_immediately = $(this).data('start-immediately');

        if (typeof action_url === "undefined") {
          enableClickEvent();
          return false;
        }
        var self = $(this);
        $.post(
          action_url,
          {
            "exam_id": exam_id,
            "attempt_proctored": attempt_proctored,
            "start_clock": start_immediately
          },
          function (data) {
            // reload the page, because we've unlocked it
            location.reload();
          }
        ).fail(function(){
          enableClickEvent();
          var msg = gettext(
            "There has been a problem starting your exam.\n\n" +
            "Possible reasons are that your account has not been fully activated,\n" +
            "you have are experiencing a network connection problem, or there has been\n" +
            "a service disruption. Please check these and try again."
          );
          alert(msg);
        });
      } else {
        return false;
      }
    }
  );
</script>