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

{% block title %}
     <center> Independent forecasts of demand for each product. </center>


<!--  this is where the heading of the page goes-->
{% endblock %}

{% block content %}

<!-- this is where we generate the forecast table. the values of each cell is sourced from the
Constants class in model where we run a loop to generate the forecast as per the rules -->
<table style ="width:100%">
    <tr>
        <th> </th>
        <th>Product# 1</th>
        <th>Product# 2</th>
        <th>Product# 3</th>
        <th>Product# 4</th>
        <th>Product# 5</th>
        <th>Product# 6</th>
        <th>Product# 7</th>
    </tr>

    <tr>
        <th>Forecaster A</th>
        <td> {{Constants.forecast_matrix_P1.0.0}}</td>
        <td> {{Constants.forecast_matrix_P1.0.1}}</td>
        <td> {{Constants.forecast_matrix_P1.0.2}}</td>
        <td> {{Constants.forecast_matrix_P1.0.3}}</td>
        <td> {{Constants.forecast_matrix_P1.0.4}}</td>
        <td> {{Constants.forecast_matrix_P1.0.5}}</td>
        <td> {{Constants.forecast_matrix_P1.0.6}}</td>
    </tr>

    <tr>
        <th>Forecaster B</th>
        <td> {{Constants.forecast_matrix_P1.1.0}}</td>
        <td> {{Constants.forecast_matrix_P1.1.1}}</td>
        <td> {{Constants.forecast_matrix_P1.1.2}}</td>
        <td> {{Constants.forecast_matrix_P1.1.3}}</td>
        <td> {{Constants.forecast_matrix_P1.1.4}}</td>
        <td> {{Constants.forecast_matrix_P1.1.5}}</td>
        <td> {{Constants.forecast_matrix_P1.1.6}}</td>

    </tr>

    <tr>
        <th>Forecaster C</th>
        <td> {{Constants.forecast_matrix_P1.2.0}}</td>
        <td> {{Constants.forecast_matrix_P1.2.1}}</td>
        <td> {{Constants.forecast_matrix_P1.2.2}}</td>
        <td> {{Constants.forecast_matrix_P1.2.3}}</td>
        <td> {{Constants.forecast_matrix_P1.2.4}}</td>
        <td> {{Constants.forecast_matrix_P1.2.5}}</td>
        <td> {{Constants.forecast_matrix_P1.2.6}}</td>

    </tr>

    <tr>
        <th>Forecaster D</th>
        <td> {{Constants.forecast_matrix_P1.3.0}}</td>
        <td> {{Constants.forecast_matrix_P1.3.1}}</td>
        <td> {{Constants.forecast_matrix_P1.3.2}}</td>
        <td> {{Constants.forecast_matrix_P1.3.3}}</td>
        <td> {{Constants.forecast_matrix_P1.3.4}}</td>
        <td> {{Constants.forecast_matrix_P1.3.5}}</td>
        <td> {{Constants.forecast_matrix_P1.3.6}}</td>

    </tr>

    <tr>
        <th>Forecaster E</th>
        <td> {{Constants.forecast_matrix_P1.4.0}}</td>
        <td> {{Constants.forecast_matrix_P1.4.1}}</td>
        <td> {{Constants.forecast_matrix_P1.4.2}}</td>
        <td> {{Constants.forecast_matrix_P1.4.3}}</td>
        <td> {{Constants.forecast_matrix_P1.4.4}}</td>
        <td> {{Constants.forecast_matrix_P1.4.5}}</td>
        <td> {{Constants.forecast_matrix_P1.4.6}}</td>

    </tr>

    <tr>
        <th>Forecaster F</th>
        <td> {{Constants.forecast_matrix_P1.5.0}}</td>
        <td> {{Constants.forecast_matrix_P1.5.1}}</td>
        <td> {{Constants.forecast_matrix_P1.5.2}}</td>
        <td> {{Constants.forecast_matrix_P1.5.3}}</td>
        <td> {{Constants.forecast_matrix_P1.5.4}}</td>
        <td> {{Constants.forecast_matrix_P1.5.5}}</td>
        <td> {{Constants.forecast_matrix_P1.5.6}}</td>

    </tr>

    <tr>
        <th>Forecaster G</th>
        <td> {{Constants.forecast_matrix_P1.6.0}}</td>
        <td> {{Constants.forecast_matrix_P1.6.1}}</td>
        <td> {{Constants.forecast_matrix_P1.6.2}}</td>
        <td> {{Constants.forecast_matrix_P1.6.3}}</td>
        <td> {{Constants.forecast_matrix_P1.6.4}}</td>
        <td> {{Constants.forecast_matrix_P1.6.5}}</td>
        <td> {{Constants.forecast_matrix_P1.6.6}}</td>

    </tr>

    <tr>
        <th>Forecaster H</th>
        <td> {{Constants.forecast_matrix_P1.7.0}}</td>
        <td> {{Constants.forecast_matrix_P1.7.1}}</td>
        <td> {{Constants.forecast_matrix_P1.7.2}}</td>
        <td> {{Constants.forecast_matrix_P1.7.3}}</td>
        <td> {{Constants.forecast_matrix_P1.7.4}}</td>
        <td> {{Constants.forecast_matrix_P1.7.5}}</td>
        <td> {{Constants.forecast_matrix_P1.7.6}}</td>

    </tr>

    <tr>
        <th>Forecaster I</th>
        <td> {{Constants.forecast_matrix_P1.8.0}}</td>
        <td> {{Constants.forecast_matrix_P1.8.1}}</td>
        <td> {{Constants.forecast_matrix_P1.8.2}}</td>
        <td> {{Constants.forecast_matrix_P1.8.3}}</td>
        <td> {{Constants.forecast_matrix_P1.8.4}}</td>
        <td> {{Constants.forecast_matrix_P1.8.5}}</td>
        <td> {{Constants.forecast_matrix_P1.8.6}}</td>

    </tr>



</table><br/>
<br>


<hr style="border: 1px solid black;" />
<b><u>Which product will you choose to produce? </u> </b><br/>

Above you can see demand forecasts for each product.  Examine the forecasts and choose which product to sell.
You earn a bonus equal to the true demand of the product that you pick multiplied by $.01 (for example, 200 => $2).
<b> You earn more bonus if you pick a product with higher true demand.</b><br/>
<br>

<center>{% formfield player.chosen_product label="Which product do you want to choose?" %}</center>
<!-- this is where the form field (the form to fill) is placed in the page and the value entered there goes to the
player.chosen value for the participant -->

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

{% endblock %}