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

{% block title %}
Your partner is the computer
{% endblock %}

{% block content %}

<div class="card bg-light instructions">
    <p class="card-body">
     <p>   <b> You are P1: </b>
       You and P2(the computer) have {{Constants.endowment}} each
        from an investor to support your individual businesses. You can
        earn more by transferring some of your money to P2 (the computer) for investment.
        You can transfer TK.0, {{Constants.endowment}}
          or any amount in between.
    </p>

    <p>
         Any amount
        you send to P2 for investment will be <u>tripled</u>. <b>In addition, you can request back any
        amount from P2 as long as it is not more than
            the tripled amount P2 will receive. Even though you can request some money, P2 can send less than
        the money you requested. </b> </p>

       <b> But if P2 does not obey your request, there is a 50-50 chance that P2’s decision will be
           reviewed by the instructor of this study and they will be fined some amount of money which will
           be used to pay you the difference. In addition, P2 will lose an extra TK. 30 of his/her own money. <p></p> </b>

        <i> <b> For example, </b> if you request TK.20 out of TK. 30 back from P2 and P2 sends you only TK.15,
    there is a 50-50 chance that P2 will be fined TK.5 to pay you the difference and he/she will also
    lose TK.30 out of the TK.100 he/she has from the investor. </i>


       <!-- <b> You will earn</b>: The {{Constants.endowment}} you have, minus what
        you send P2 plus what he/she sends you back <u>plus the fine if your P2 is selected.</u> <p></p>

        <b>P2 will earn </b> : The {{Constants.endowment}} he/she has, plus 3 times what you
        send him/her, minus what he sends back to you and <u> the fine if he/she
        is selected.</u>
        Given this information, how much
        would you like to send P2? -->

    </p>

        {% formfields %}
       <p>

    </p>

</div>
</div>
               <p></p>
<!-- Button trigger modal -->
<button type="button" class="btn btn-primary" data-toggle="modal" data-target="#exampleModal">
  Next
</button>

<!-- Modal -->
<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="exampleModalLabel"> Remember the computer's decisions are similar to investment
            decisions made
        by people elsewhere </h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        <p> Is this your final decision?
	<tr>
	<td  id=“lane”></td></p>
	</tr>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-primary" data-dismiss="modal">No</button>
        <button class="btn btn-primary">Yes</button>
      </div>
    </div>
  </div>
</div>
</div>
</div>



 <script src="{% static "COP_Experiment/Basic.js" %}"></script>


{% endblock %}