{% extends "global/Base.html" %}
{% load otree_tags %}
{% block title %}Investment decision 2 out of 2{% endblock title %}

{% block content %}


    <p>
        The second round of the experiment will start now.
    </p>
    <p>
        Subsequently, you will again see information about two assets.
		As in the first round of the experiment, please invest your hypothetical wealth of 10&nbsp;000€ completely into the two assets. Your payment depends on your final investment decision and another simulation of returns for the two assets.
    </p>
    <div style="position: relative;">
        Please enter a starting value for your investment into Asset 2. The remainder of your 10&nbsp;000€  will be invested into Asset 1. You can try out alternative investment allocations up to return simulation 50. 
    </div>
    <div id = "investmentAnlage1" style="position: relative;">
        Investment into Asset 1: <br><br>
    </div>
    <p>
        {% for field in form %}
        {% formfield field %}
        {% endfor %}
    </p>

    <p>
        <input type="submit" value="Weiter" class="btn btn-primary btn-large btn-primary next-button">
    </p>
{% endblock %}

{% block scripts %}

    <script>
        $(':input').bind('input',function(){
            var weightTemp = parseFloat(String($(':input[name=percentAktien20]').val()).replace(',', '.'));
            document.getElementById('investmentAnlage1').innerHTML= "Investment into Asset 1: <br>".concat((10000 - weightTemp).toString(10), " €").replace('.', ',');

	        if (weightTemp > 10000 || weightTemp < 0){
                window.alert("Please enter a number between 0 and 10000!");
            }
        });

    </script>
{% endblock %}