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

{% load otree static %}
{% load analytical %}
{% load widget_tweaks %}

{% block styles %}
    <style>
    .otree-body {
        background-color: white;
        color: black;
        width: 450px;
        height: 100%;
        position: fixed;
        z-index: 1;
        overflow-x: hidden;
        padding-top: 20px;
        top:0;
    }

    .otree-btn-next {
        background-colour: green;
    }
    .otree-title {
        color: black;
    }

    .left {
        left: 0;
        background-color: white;
    }

    .right {
        height: 100%;
        position: fixed;
        width: 70%;
        top: 0;
        right: 0;
        background-color: white;
        overflow-x: hidden;
    }

    .centered img {
        display: block;
        margin-left: auto;
        margin-right: auto;
    }


    centered {
        width: 100%;
        margin-left: 0;
    }

    table, td ,th {
        border: 0px solid black;
    }

    table {
        border-collapse: collapse;
        width: 100%;
    }

    th {
        text-align: center;
    }

    td {

    }

    tr {
        height: 45px;
    }

    table.right_bot2{
        border-collapse: collapse;
        width: 100%;
        margin-bottom: 20px;
        height: 100%;
    }

    td.right_bot2{
        height: 100px;
    }





    </style>
{% endblock %}

{% block title %}
{% analytical_head_top %}
    <div class="left", align = "center">

        <img src="{% static logo_path %}"  width=30%/>
        <p>
            Résumé Evaluation
        </p>
    </div>
{% analytical_head_bottom %}
{% endblock %}



{% block content %}
{% analytical_body_top %}
{{ form.submitted2.errors }}


    <div class=" left">

        <td><button name="CV_to_view" value=0 class="btn btn-link btn-large">View Instructions</button></td>


        <div>
            <table>
                <tr>
                    <th>Resume Link</th>
                    <th>Name</th>
                    <th>Score</th>
                </tr>
                <tr>
                    <td><button name="CV_to_view" value=1 class="btn btn-link btn-large">Résumé 1</button></td>
                    <td>{{ form.Name_1 | attr:"placeholder:Applicant Name"}}</td>
                    <td>{{ form.CV_1 | attr:"placeholder:Score"}}</td>
                </tr>
                <tr>
                    <td><button name="CV_to_view" value=2 class="btn btn-link btn-large">Résumé 2</button></td>
                    <td>{{ form.Name_2 | attr:"placeholder:Applicant Name"}}</td>
                    <td>{{ form.CV_2 | attr:"placeholder:Score"}}</td>
                </tr>
                <tr>
                    <td><button name="CV_to_view" value=3 class="btn btn-link btn-large">Résumé 3</button></td>
                    <td>{{ form.Name_3 | attr:"placeholder:Applicant Name"}}</td>
                    <td>{{ form.CV_3 | attr:"placeholder:Score"}}</td>
                </tr>
                <tr>
                    <td><button name="CV_to_view" value=4 class="btn btn-link btn-large">Résumé 4</button></td>
                    <td>{{ form.Name_4 | attr:"placeholder:Applicant Name"}}</td>
                    <td>{{ form.CV_4 | attr:"placeholder:Score"}}</td>
                </tr>
                <tr>
                    <td><button name="CV_to_view" value=5 class="btn btn-link btn-large">Résumé 5</button></td>
                    <td>{{ form.Name_5 | attr:"placeholder:Applicant Name"}}</td>
                    <td>{{ form.CV_5 | attr:"placeholder:Score"}}</td>
                </tr>
                <tr>
                    <td><button name="CV_to_view" value=6 class="btn btn-link btn-large">Résumé 6</button></td>
                    <td>{{ form.Name_6 | attr:"placeholder:Applicant Name"}}</td>
                    <td>{{ form.CV_6 | attr:"placeholder:Score"}}</td>
                </tr>
            </table>
        </div>

        <div class="left", align = "right">
            <button name="submitted2" value="True" position="Right" class="btn btn-success btn-large">Submit</button>
        </div>

    </div>



<br />

    {% if not player.CV_viewing == 0 %}

        {% if player.treated1 == 1 %}
        <label>Notes for Experimenter regarding Résumé
            {% if player.CV_viewing == 1 %}
                1:</label>
                {{form.Notes_1}}
            {% endif %}
            {% if player.CV_viewing == 2 %}
                2:</label>
                {{form.Notes_2}}
            {% endif %}
            {% if player.CV_viewing == 3 %}
                3:</label>
                {{form.Notes_3}}
            {% endif %}
            {% if player.CV_viewing == 4 %}
                4:</label>
                {{form.Notes_4}}
            {% endif %}
            {% if player.CV_viewing == 5 %}
                5:</label>
                {{form.Notes_5}}
            {% endif %}
            {% if player.CV_viewing == 6 %}
                6:</label>
                {{form.Notes_6}}
            {% endif %}

        {% elif player.treated2 == 1 %}
        <label>Notes for our HR team regarding Résumé
            {% if player.CV_viewing == 1 %}
                1:</label>
                {{form.Notes_1}}
            {% endif %}
            {% if player.CV_viewing == 2 %}
                2:</label>
                {{form.Notes_2}}
            {% endif %}
            {% if player.CV_viewing == 3 %}
                3:</label>
                {{form.Notes_3}}
            {% endif %}
            {% if player.CV_viewing == 4 %}
                4:</label>
                {{form.Notes_4}}
            {% endif %}
            {% if player.CV_viewing == 5 %}
                5:</label>
                {{form.Notes_5}}
            {% endif %}
            {% if player.CV_viewing == 6 %}
                6:</label>
                {{form.Notes_6}}
            {% endif %}

        {% else %}
        <label>Notes regarding Résumé
            {% if player.CV_viewing == 1 %}
                1:</label>
                {{form.Notes_1}}
            {% endif %}
            {% if player.CV_viewing == 2 %}
                2:</label>
                {{form.Notes_2}}
            {% endif %}
            {% if player.CV_viewing == 3 %}
                3:</label>
                {{form.Notes_3}}
            {% endif %}
            {% if player.CV_viewing == 4 %}
                4:</label>
                {{form.Notes_4}}
            {% endif %}
            {% if player.CV_viewing == 5 %}
                5:</label>
                {{form.Notes_5}}
            {% endif %}
            {% if player.CV_viewing == 6 %}
                6:</label>
                {{form.Notes_6}}
            {% endif %}

        {% endif %}
    {% endif %}


    <div class="right">
        <div class="centered img">

            <img src="{% static image_path %}"  width=100%/>

        </div>
    </div>


{% endblock %}

{% analytical_body_bottom %}