{{ block title }}
    Blue Chooses
{{ endblock }}
{{ block content }}

<style>
* {
  box-sizing: border-box;
}

/* Create two equal columns that floats next to each other */
.column {
  float: left;
  width: 50%;
  padding: 10px;
}

/* Clear floats after the columns */
.row:after {
  content: "";
  display: table;
  clear: both;
}
</style>

{% if ab_fields %}
    <div class="row">
        <div class="column">
            <table class="table">
                <tr>
                    <th>Link other?</th>
                </tr>
                {{ for field in a_fields }}
                    <tr>
                        <td> {{ formfield field }}</td>
                    </tr>
                {{ endfor }}
            </table>
        </div>
        <div class="column">
            <table class="table">
                <tr>
                    <th>Permanently severed</th>
                </tr>
                {{ for field in b_fields }}
                    <tr>
                        <td> {{ formfield field }}</td>
                    </tr>
                {{ endfor }}
            </table>
        </div>
    </div>
{% else %}
<div class="row">
    <div class="column">
        <table class="table">
            <tr>
                <th>Link other?</th>
            </tr>
            {{ for field in a_fields }}
                <tr>
                    <td> {{ formfield field }}</td>
                </tr>
            {{ endfor }}
        </table>
    </div>
</div>
{% endif %}

{{ next_button }}

<script>

    // Odds connecting to evens:
    // Player 2:
    if((document.getElementById('id_link_to_p2-1') !== null) && (document.getElementById('id_link_severed_to_p2-1') !== null)){

    document.getElementById('id_link_severed_to_p2-1').onclick = function() {
        forminputs.link_to_p2.value = 0;
        }
    document.getElementById('id_link_to_p2-1').onclick = function() {
        forminputs.link_severed_to_p2.value = 0;
        }
    }

    // Player 4:
    if((document.getElementById('id_link_to_p4-1') !== null) && (document.getElementById('id_link_severed_to_p4-1') !== null)){

    document.getElementById('id_link_severed_to_p4-1').onclick = function() {
        forminputs.link_to_p4.value = 0;
        }
    document.getElementById('id_link_to_p4-1').onclick = function() {
        forminputs.link_severed_to_p4.value = 0;
        }
    }

    // Player 6:
    if((document.getElementById('id_link_to_p6-1') !== null) && (document.getElementById('id_link_severed_to_p6-1') !== null)){

    document.getElementById('id_link_severed_to_p6-1').onclick = function() {
        forminputs.link_to_p6.value = 0;
        }
    document.getElementById('id_link_to_p6-1').onclick = function() {
        forminputs.link_severed_to_p6.value = 0;
        }
    }

    // Player 8:
    if((document.getElementById('id_link_to_p8-1') !== null) && (document.getElementById('id_link_severed_to_p8-1') !== null)){

    document.getElementById('id_link_severed_to_p8-1').onclick = function() {
        forminputs.link_to_p8.value = 0;
        }
    document.getElementById('id_link_to_p8-1').onclick = function() {
        forminputs.link_severed_to_p8.value = 0;
        }
    }

    // Player 1:
    if((document.getElementById('id_link_to_p1-1') !== null) && (document.getElementById('id_link_severed_to_p1-1') !== null)){

    document.getElementById('id_link_severed_to_p1-1').onclick = function() {
        forminputs.link_to_p1.value = 0;
        }
    document.getElementById('id_link_to_p1-1').onclick = function() {
        forminputs.link_severed_to_p1.value = 0;
        }
    }

    // Player 3:
    if((document.getElementById('id_link_to_p3-1') !== null) && (document.getElementById('id_link_severed_to_p3-1') !== null)){

    document.getElementById('id_link_severed_to_p3-1').onclick = function() {
        forminputs.link_to_p3.value = 0;
        }
    document.getElementById('id_link_to_p3-1').onclick = function() {
        forminputs.link_severed_to_p3.value = 0;
        }
    }

    // Player 5:
    if((document.getElementById('id_link_to_p5-1') !== null) && (document.getElementById('id_link_severed_to_p5-1') !== null)){

    document.getElementById('id_link_severed_to_p5-1').onclick = function() {
        forminputs.link_to_p5.value = 0;
        }
    document.getElementById('id_link_to_p5-1').onclick = function() {
        forminputs.link_severed_to_p5.value = 0;
        }
    }

    // Player 7:
    if((document.getElementById('id_link_to_p7-1') !== null) && (document.getElementById('id_link_severed_to_p7-1') !== null)){

    document.getElementById('id_link_severed_to_p7-1').onclick = function() {
        forminputs.link_to_p7.value = 0;
        }
    document.getElementById('id_link_to_p7-1').onclick = function() {
        forminputs.link_severed_to_p7.value = 0;
        }
    }


</script>

{{ endblock }}