{{ extends "global/Page.html" }}
{{ block title }}
  <h3 align = "center"> 
  </h3>
{{ endblock }}

{{ block content }}
<div class="upper-right"><br>
  {{ if group.treatment == 1 }}
    ◯
  {{ elif group.treatment == 2 }}
    △
  {{ elif group.treatment == 3 }}
    □
  {{ elif group.treatment == 4 }}
    ☆
  {{ else }}
    #
  {{ endif }}
</div>

<!-- Embedded video -->
<div align = "center">
      <video id="myVideo" width="853.3" height="480" controls>
        {{ if group.treatment == 1 }}
          <source src="{% static '0beh.mp4' %}" type="video/mp4">
        {{ elif group.treatment == 2 }}
          <source src="{% static '2beh.mp4' %}" type="video/mp4">
        {{ else }}
        {{ endif }}
        このブラウザでは動画が再生できません。手を挙げてスタッフにお知らせください。
      </video>

  <!-- Next button -->
  <br><br>
  <button id="buttonA"> 次へ </button>


    {{ if is_defined('view.is_debug') and view.is_debug }}         
    <!-- Cheatボタン -->
    <br><button id="cheatButton" class="btn btn-primary">Cheat</button>
    {{ endif}}

</div>
{{ endblock }}



{{ block scripts }}
<script>
      var video = document.getElementById("myVideo");

      function checkVideoEnded() {
          if (video.ended) {
              document.getElementById("buttonA").style.display = "block";
          } else {
              setTimeout(checkVideoEnded, 1000); 
          }
      }

      checkVideoEnded();

      function nextPage() {
        oTree.next();
      }
</script>
{{ endblock }}