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

{% block title %}
    Round 1<br>
    Player {{player.id_in_group}}
{% endblock %}

{% block content %}
    <style>
        div.trees {
            float: left;
            padding-right: 0px;
        }
        p.cb {
            clear: both;
        }
    </style>

    <br>

        <div class = "trees">
            <p><img src="{% static image_path1 %}" alt="tree1" width="40%" height="40%"></p>
            <p>Tree 1</p>
        </div>
        <div class = "trees">
            <p><img src="{% static image_path2 %}" alt="tree2" width="40%" height="40%"></p>
            <p>Tree 2</p>
        </div>
    {% if num_trees > 2 %}
        <div class = "trees">
            <p><img src="{% static image_path3 %}" alt="tree3" width="40%" height="40%"></p>
            <p>Tree 3</p>
        </div>
    {% endif %}
    {% if num_trees > 3 %}
        <div class = "trees">
            <p><img src="{% static image_path4 %}" alt="tree4" width="40%" height="40%"></p>
            <p>Tree 4</p>
        </div>
    {% endif %}

    <p class="cb">
        伐採したい木の番号を入力してください（1 - {{Constants.num_trees}}）．<br>
        どの木も伐採しない場合は 0 を入力してください．<br>
        入力後，「Next」ボタンを押してください．<br>
    </p>

    {% formfield player.cut_input %}

    {% next_button %}

{% endblock %}