<template name="studyAssociationTable">
    <div id="studyAssociationTable">
        <div class="row">
            <div class="col-md-12">
                <h4>Instructions</h4>
                <p>Associate the selected studies with timepoints in the clinical trial. Only 1 follow-up time point can be associated at the same time.</p>
                <p>We have automatically retrieved all studies within 14 days (<strong>{{formatDA earliestDate}}</strong> to <strong>{{formatDA latestDate}}</strong>) of your selected studies, in case you forgot to
                select a study.</p>
            </div>
        </div>

        <table class="table table-striped">
            <thead>
                <tr>
                    <th class="center">Include Study?</th>
                    <th class="center">Study Date</th>
                    <th class="center">Patient Name</th>
                    <th class="center">Study Description</th>
                    <th class="center">Timepoint Type</th>
                </tr>
            </thead>

            <tbody>
                {{ #each relevantStudies }}
                <tr>
                    <td class="center">
                        <input type="checkbox" class="includeStudy" {{inlineIf autoselected false 'checked'}}/>
                    </td>
                    <td class="center studyDataCell {{ #if autoselected }}disabled{{ /if }}">
                        {{ #if autoselected}}
                            <p class="studyDate autoselected"
                               data-toggle="tooltip"
                               title="This study was autoselected.">
                                {{formatDA studyDate}}
                            </p>
                        {{ else }}
                            <p class="studyDate">{{formatDA studyDate}}</p>
                        {{ /if }}
                    </td>
                    <td class="center studyDataCell {{ #if autoselected }}disabled{{ /if }}">
                        <p>{{formatPN patientName}}</p>
                    </td>
                    <td class="studyDataCell {{ #if autoselected }}disabled{{ /if }}">
                        <p>{{studyDescription}}</p>
                    </td>
                    <td class="timepointOptions center studyDataCell noselect {{ #if autoselected }}disabled{{ /if }}">
                        {{ #each timepointOptions }}
                            <label class="noselect">
                                <input type="radio"
                                      name="{{../_id}}"
                                      value="{{value}}"
                                      class="timepointOption"
                                      {{ inlineIf checked true 'checked' }}
                                      {{ inlineIf autoselected true 'disabled' }}>
                                    {{name}}
                            </label>
                        {{ /each }}
                    </td>
                </tr>
                {{ /each }}
            </tbody>
        </table>
    </div>
</template>