{{ block title }}
{{ endblock }}

{{ block script }}
<script>
  let trial_coin = 0 
  let coin = 0

  // setIntervalを使う方法
function sleep(waitSec, callbackFunc) {

// 経過時間（秒）
var spanedSec = 0;

// 1秒間隔で無名関数を実行
var id = setInterval(function () {

    spanedSec++;

    // 経過時間 >= 待機時間の場合、待機終了。
    if (spanedSec >= waitSec) {

        // タイマー停止
        clearInterval(id);

        // 完了時、コールバック関数を実行
        if (callbackFunc) callbackFunc();
    }
}, 500);

}

  
  function slideshow_timer(){
    document.getElementById("omoteura").src="/static/global/coin.jpg";
    let coin = Math.floor(Math.random()*2) +1;
    sleep(1, function () {

      document.getElementById("omoteura").src= `/static/global/${coin}c.jpg`;

});
    
    trial_coin += 1;
    document.getElementById("tri_c_c").value = trial_coin;
    console.log(-1*coin+2)
    if(trial_coin==1){
      document.getElementById("obsc_1").value = -1*coin+2;
    }
    if(trial_coin==2){
      document.getElementById("obsc_2").value = -1*coin+2;
    }
    if(trial_coin==3){
      document.getElementById("obsc_3").value = -1*coin+2;
    }
    if(trial_coin==4){
      document.getElementById("obsc_4").value = -1*coin+2;
    }
    if(trial_coin==5){
      document.getElementById("obsc_5").value = -1*coin+2;
    }
    if(trial_coin==6){
      document.getElementById("obsc_6").value = -1*coin+2;
    }
    if(trial_coin==7){
      document.getElementById("obsc_7").value = -1*coin+2;
    }

  }


  ///配列の用意
  var arr = new Array(5);
  console.log(arr);

  //配列にデータを渡す関数
  function assign(a,b){
    arr[a] = b;
    console.log(arr);
  }

  //配列からiscoreを計算する関数
  function cal_iscore(){
    //player
    var headscount = arr.filter(value => value === '1').length;
    var tailscount = arr.filter(value => value === '0').length;
    console.log("表が出た回数：" +headscount,"裏が出た回数："+ tailscount);
    //subsession　report
    var hr = '{{total_headsr}}';
    var n = '{{sub_num_people}}';
    var tr = '{{total_tailsr}}';
    var hrrate = hr/(5*n-4);
    var trrate = tr/(5*n-4);
    console.log("報告された表の割合："+ hrrate,"報告された裏の割合："+ trrate)
    //subsession　prediction
    var log_sum_p = '{{ total_headsp }}';
    var hp = log_sum_p/n;
    var hprate =  Math.exp(hp);
    var tprate = 1-hprate;
    console.log("予測された表の割合の幾何平均："+ hrrate,"予測された裏の割合の幾何平均："+ trrate)
    //iscoreの平均
    var iscore = 
    headscount* Math.log(hrrate/hprate )
    +tailscount* Math.log(trrate/tprate );
    console.log(iscore)
    diciscore = document.getElementById('diciscore');
    diciscore.innerText =Math.round(iscore*1000)/1000;
  }
  

</script>
{{ endblock }}

{{ block content }}
<p>以下の「コインを投げる」ボタンを押してコインを投げ、表が出たか裏が出たかを報告するという操作を5回繰り返してください。</p>
<p>
  <b>但し、以下のルールをよく読んだ上で報告してください。</b>
</p>
<p>ルール1：報告された結果に基づいて、<b>(表が報告された回数)×¥1の追加報酬</b>が支払われます。この報酬は調査への参加に対する謝礼とは別に支払われます。</p>
<p>ルール2：この実験では、あなたには「情報スコア」と呼ばれる得点が計算されます。
<p>この「情報スコア」はあなたの回答がどの程度誠実で、情報として有益であるかを反映したものであり、近年マサチューセッツ工科大学の研究者によって考案されたアルゴリズムによって算出されます。この調査への回答が全て集まった後、あなたは「この情報スコア」の合計により順位づけられ、上位1/3に含まれている場合には<b>追加の報酬￥50</b>が支払われます。この報酬は調査への参加に対する謝礼とは別に支払われます。</p>
<p><b>この実験では回答の参考のために、あなたが報告した結果によって計算された情報スコアが表示されます。</b></p>

<button  type="button"  onclick="slideshow_timer();">コインを投げる</button>
      <p><img id ="omoteura" src="/static/global/coin.jpg" width="50" height="50"/></p>
<form>
    <fieldset>
      <p>あなたの情報スコアは<span id="diciscore" name = "iscore"> </span>です。</p>
      <p>1回目</p>
      <div>
        <input type="radio" id="0" name="coin_1" value="1" onclick="assign(this.id,this.value);cal_iscore()"/>
        <label for="contactChoice1">表</label>
        &nbsp;&nbsp;
        <input type="radio" id="0" name="coin_1" value="0" onclick="assign(this.id,this.value);cal_iscore()"/>
        <label for="contactChoice2">裏</label>

      </div>
      <br>
      <p>2回目</p>
      <div>
        <input type="radio" id="1" name="coin_2" value="1" onclick="assign(this.id,this.value);cal_iscore()"/>
        <label for="contactChoice1">表</label>
        &nbsp;&nbsp;
        <input type="radio" id="1" name="coin_2" value="0" onclick="assign(this.id,this.value);cal_iscore()"/>
        <label for="contactChoice2">裏</label>

      </div>

      <br>
      <p>3回目</p>
      <div>
        <input type="radio" id="2" name="coin_3" value="1" onclick="assign(this.id,this.value);cal_iscore()"/>
        <label for="contactChoice1">表</label>
        &nbsp;&nbsp;
        <input type="radio" id="2" name="coin_3" value="0" onclick="assign(this.id,this.value);cal_iscore()"/>
        <label for="contactChoice2">裏</label>

      </div>

      <br>
      <p>4回目</p>
      <div>
        <input type="radio" id="3" name="coin_4" value="1" onclick="assign(this.id,this.value);cal_iscore()"/>
        <label for="contactChoice1">表</label>
        &nbsp;&nbsp;
        <input type="radio" id="3" name="coin_4" value="0" onclick="assign(this.id,this.value);cal_iscore()"/>
        <label for="contactChoice2">裏</label>

      </div>

      <br>
      <p>5回目</p>
      <div>
        <input type="radio" id="4" name="coin_5" value="1" onclick="assign(this.id,this.value);cal_iscore()"/>
        <label for="contactChoice1">表</label>
        &nbsp;&nbsp;
        <input type="radio" id="4" name="coin_5" value="0" onclick="assign(this.id,this.value);cal_iscore()"/>
        <label for="contactChoice2">裏</label>

      </div>
      <input type="hidden" name="trial_coin" id= "tri_c_c" value="">
      <input type="hidden" name="obsc_1" id= "obsc_1" value="">
      <input type="hidden" name="obsc_2" id= "obsc_2" value="">
      <input type="hidden" name="obsc_3" id= "obsc_3" value="">
      <input type="hidden" name="obsc_4" id= "obsc_4" value="">
      <input type="hidden" name="obsc_5" id= "obsc_5" value="">
      <input type="hidden" name="obsc_6" id= "obsc_6" value="">
      <input type="hidden" name="obsc_7" id= "obsc_7" value="">
      
    </fieldset>
  </form>
  
   <br> {{ next_button }}

{{ endblock }}