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

{{ block styles }}
    <link href="{% static 'global/css/decision.css' %}" rel="stylesheet">
{{ endblock }}

{{ block scripts }}
    <script src="{% static 'global/js/decision.js' %}"></script> 

{{ endblock }}

{{ block PageContent }}
<div class="test-text" id="test-text"></div>

<div class="table-container" id="table-container">
    <div class="row top"> 
        <div class="table-item right">  </div>
        <div class="table-item"> <img src="{{ static C.imgCandidate }}" class="img-top"> </div>
        <div class="table-item"> <img src="{{ static C.imgCandidate }}" class="img-top"> </div>
    </div>
    <div class="row top">
        <div class="table-item right">  </div>
        <div class="table-item col-A"> Candidate <br> A </div>
        <div class="table-item col-B"> Candidate <br> B </div>
    </div>
    {{ for attr in lAttr }}
    <div class="row MT" id="{{ attr.id }}">
        <div class="table-item right"> {{ attr.name }} </div>
        <div class="table-item mt-tgt hide"> <img src="{{ static attr.valueA }}" class="img-button"> </div>
        <div class="table-item mt-tgt hide"> <img src="{{ static attr.valueB }}" class="img-button"> </div>
    </div>
    {{ endfor }}
    <div class="row btn-row">
        <div class="table-item right">  </div>
        <div class="table-item"> <button type="button" class="dec-btn" id="btn-A" onclick="endDecPage(0)"> Choose A </button> </div>
        <div class="table-item"> <button type="button" class="dec-btn " id="btn-B" onclick="endDecPage(1)"> Choose B </button> </div>
    </div>
</div>

<input type="hidden" id="sStart" name="sStartDec">
<input type="hidden" id="sEnd" name="sEndDec">
<input type="hidden" id="dRT" name="dRT_dec">
<input type="hidden" id="sNames" name="sNames">
<input type="hidden" id="sDT" name="sDT">
<input type="hidden" id="iDec" name="iChooseB">
<input type="hidden" id="time2first" name="dTime2first">



{{ endblock }}