{{ block title }} 第 {{player.num_subsession}} 輪 {{ endblock }}
{{ block content }} 
<p style="font-size: 23px;color:black;">選擇回合 （ <span style="color: red;font-size: 23px">A</span> ）</p>
<div class="card bg-light m-3" id="rule">
<div>
  <p>
  在每個選擇回合，每個大組中的受試者都需在 X 與 Y 兩方案中選擇一個，
  較多組員選擇的方案只會在每階段第 {{Constants.num_game_round}} 個遊戲回合 （ <span style="color:green;font-size: 16px">B</span> ）於大組內執行，
  但會影響整個階段。該方案將適用於所有同一大組組員。
  在同一輪中，若某一階段兩種選擇方案的人數一樣多，則按照上一階段的選擇結果執行。
  以下分別敘述兩個方案：
    <ol>
      <li>
      <strong><span style="color:black;font-weight:bold;font-size: 16px">X 方案：
      </span></strong>同一大組裡每位組員都是獨立個體，每位組員有 {{Constants.probability_die_for_x_text}} 的機率被選中， 
      每位組員都會單獨由電腦判斷一次， 
      「被選中」的組員在本輪結束時會損失 {{Constants.probability_death_loss_x_text}} 的大組累積報酬。
      </li>
      <li>
      <strong><span style="color:black;font-weight:bold;font-size: 16px">Y 方案：
      </span></strong>整個大組為一個整體，整組有 {{Constants.probability_die_for_y_text}} 的機率被選中，
      整組只會由電腦判斷一次，
      「被選中」的組員在本輪結束時會損失 {{Constants.probability_death_loss_y_text}} 的大組累積報酬。	
      </li>
    </ol>
  </p>

  <p><span style="color: red;font-size: 16px"> 此外，「被選中」也代表不能再參與本輪剩餘的選擇回合 （ <span style="color:red;font-size: 16px">A</span> ） 。</span></p>
  <p>確認以上實驗規則了解後，請按下 Yes 做選擇。</p>

</div>
</div>



<input type="button" name="id_currentTime" id="id_currentTime" value="Yes" />

<input type="hidden" name="start_timestamp" id="start_timestamp" />
<input type="hidden" name="end_timestamp" id="end_timestamp" />


<Div  id="displaytable" style="display:none">
  <br>
  
  <p  style="font-size: 20px;color:red;">你想要選擇 X 還是 Y 方案?</p>
    
        <label style="text-align: center">
            <img src="{{ static 'X1.png' }}" align="left" width="300px">
            <br>
            <input type="radio" name="img_choice" value="X" class="persist" id="vote_x">
        </label>

        <label style="text-align: center"> 
          <img src="{{ static 'Y.png' }}" align="right" width="290px">
          <br>
          <input type="radio" name="img_choice" value="Y" class="persist" id="vote_y">
      </label> 
    
    {{ formfield_errors 'img_choice' }} 

    <!-- <script src="{{ static 'persist-raw.js' }}"></script> -->
  
  <br>
  <button id="next_button" class="otree-btn-next btn btn-primary" style="display:none"> Next </button>
</Div>



<script>

  var id_currentTime = document.getElementById("id_currentTime");
  id_currentTime.onclick = function() {
      id_currentTime.disabled = true;
      document.getElementById("rule").style.display = "none";
      document.getElementById("displaytable").style.display = "block";
      document.getElementById("start_timestamp").value=performance.now();
      
  };

  var vote_x = document.getElementById("vote_x");
  vote_x.onclick = function() {
    
      
      document.getElementById("next_button").style.display = "block";
      
  };

  var vote_y = document.getElementById("vote_y");
  vote_y.onclick = function() {
    
      
      document.getElementById("next_button").style.display = "block";
      
  };
  
  var Next = document.getElementById("next_button");
  Next.onclick = function() {
    
      
      document.getElementById("end_timestamp").value=performance.now();
      
  };

  


</script>


 
{{ endblock }}