{% extends "global/Page.html" %}
{% load otree static %}

{% block title %}

{% endblock %}

{% block content %}

<div style="text-align:center">

    <h2>
        Teil 2
    </h2>

    <br/><br/>
    Sie haben jetzt in diesem Teil die Möglichkeit, zusätzlich zum vorherigen Teil, Geld zu verdienen.
    <br/><br/>
    Sie haben eine Grundausstattung von <b>50 ECU</b>.<br/>
    Sie können so viel Sie möchten in eine risikoreiche Lotterie investieren.

    <br/><br/>

    Der investierte Betrag hat eine <b>50% Chance</b> erfolgreich zu sein. Wenn die Lotterie erfolgreich ist,
    erhalten Sie <b>3mal</b> den von Ihnen investierten Betrag zurück. Wenn nicht, verlieren Sie die investierten
    Euro.

    <br/><br/>

    Sie behalten alle Euro, die Sie nicht investiert haben, mit unverändertem Wert.

    <br/><br/><br/>


    Wie viele Euro wollen Sie in die risikoreiche Lotterie investieren?<br/><br/>



    <table align="center">
    <tr>
        <td>
            <div class="form-group required">
                <div class="controls  field-risk_invest">
                    <div class="input-group input-group-narrow">

                        <input type="number" name="risk_invest" value="None" step="1" min="0" max="50" required
                               id="id_risk_invest" class="form-control" />

                        <div class="input-group-append">
                            <span class="input-group-text">ECU</span>
                        </div>
                    </div>
                </div>
            </div>
        </td>
    </tr>
    </table>

    <br/><br/>

    Wenn Ihre Investition erfolgreich ist, erhalten Sie insgesamt <b><span id="result"></span> ECU</b>.<br>
    Wenn Ihre Investition nicht erfolgreich ist, erhalten Sie insgesamt <b><span id="result2"></span> ECU</b>.

        <br/><br/>

    Sie werden am Ende des Experiments darüber informiert, ob die Lotterie erfolgreich war.
</div>




<br/><br/>

<center>{% next_button %}</center>


{% endblock %}

{% block scripts %}

<script>
       var endowment = 50
       $("#result").text();

        $(".form-control").bind("keyup change", function () {

            var number_array = $(".form-control").map(
                function () {
                    return $(this).val()
                }).get();

            var sum = 0;
            number_array.forEach(function (num) {
                sum += parseInt(num) || 0;
            });

            $("#result").text((endowment - sum) + (sum * 3))

        });
</script>

<script>
       var endowment2 = 50
       $("#result2").text();

        $(".form-control").bind("keyup change", function () {

            var number_array2 = $(".form-control").map(
                function () {
                    return $(this).val()
                }).get();

            var sum2 = 0;
            number_array2.forEach(function (num) {
                sum2 += parseInt(num) || 0;
            });

            $("#result2").text((endowment2 - sum2))

        });
</script>
{% endblock %}