{{ block title }}
{{ endblock }}

{{ block script }}
<script>
    


    function cal_per(){
        var p0 = document.getElementById('id0').value;
        var p1 = document.getElementById('id1').value;
        var p2 = document.getElementById('id2').value;
        var p3 = document.getElementById('id3').value;
        var p4 = document.getElementById('id4').value;
        var p5 = document.getElementById('id5').value;
        p0 = parseFloat(p0);
        p1 = parseFloat(p1);
        p2 = parseFloat(p2);
        p3 = parseFloat(p3);
        p4 = parseFloat(p4);
        p5 = parseFloat(p5);
        
        total =p0+p1+p2+p3+p4+p5;
        console.log(total);
        totalp = document.getElementById('totalp');
        totalp.innerText = total;
        }
        
    
</script>
{{ endblock }}

{{ block content }}
<p> この調査で、自分を含めた全ての参加者について1~6の出目はそれぞれどのぐらいの割合で報告されると思いますか？全体で100%となるように、それぞれ1%以上の百分率で回答してください。また、回答は半角数字で行ってください。ページ下部の「合計を確認」ボタンを押すことで入力の合計を確認することができます。</p>
<p>また、この課題においてあなたは予測の正確さに応じて順位づけられ、上位1/3に含まれる場合には<b>￥5の追加報酬</b>が支払われます。</p>
    <label for="headsrate"><p></p></label>
    <br><p>1: <input type="number" id="id0" name="dice1rate_p" min="0" max="100" value="0">  %</p>
    <br><p>2: <input type="number" id="id1" name="dice2rate_p" min="0" max="100" value="0">  %</p>
    <br><p>3: <input type="number" id="id2" name="dice3rate_p" min="0" max="100" value="0">  %</p>
    <br><p>4: <input type="number" id="id3" name="dice4rate_p" min="0" max="100" value="0">  %</p>
    <br><p>5: <input type="number" id="id4" name="dice5rate_p" min="0" max="100" value="0">  %</p>
    <br><p>6: <input type="number" id="id5" name="dice6rate_p" min="0" max="100" value="0">  %</p>
    <p></p>

    <div style="padding: 10px; margin-bottom: 10px; border: 1px dotted #333333;">
        <button type="button" onclick="cal_per()" >合計を確認</button>
        現在の合計は<span id="totalp" name = "totalq">0</span>%です。

    </div>
    <p></p>

    {{ next_button }} 

{{ endblock }}