{{ form_start(form) }}
<div class="row">
    <div class="col-lg-4">

        {# These are the errors related to removed intervals #}
        {{ form_errors(form) }}

        {% if form.offsetExists('externalid') %}
            {{ form_row(form.externalid) }}
        {% endif %}
        {{ form_row(form.shortname) }}
        {{ form_row(form.name) }}
        {{ form_row(form.activatetimeString) }}
        {{ form_row(form.starttimeString) }}
        {{ form_row(form.starttimeEnabled) }}
        {{ form_row(form.freezetimeString) }}
        {{ form_row(form.endtimeString) }}
        {{ form_row(form.unfreezetimeString) }}
        {{ form_row(form.deactivatetimeString) }}
        {{ form_row(form.allowSubmit) }}
        {{ form_row(form.processBalloons) }}
        {{ form_row(form.runtimeAsScoreTiebreaker) }}
        {{ form_row(form.medalsEnabled) }}
        <div data-medals-field>
            {{ form_row(form.medalCategories) }}
            {{ form_row(form.goldMedals) }}
            {{ form_row(form.silverMedals) }}
            {{ form_row(form.bronzeMedals) }}
        </div>
        {{ form_row(form.public) }}
        {{ form_row(form.openToAllTeams) }}
        <div data-teams-field>
            {{ form_row(form.teams) }}
            {{ form_row(form.teamCategories) }}
        </div>
        {{ form_row(form.enabled) }}
        {{ form_row(form.bannerFile) }}
        {% if form.offsetExists('clearBanner') %}
            {{ form_row(form.clearBanner) }}
        {% endif %}
        {{ form_row(form.contestProblemsetFile) }}
        {% if form.offsetExists('clearContestProblemset') %}
            {{ form_row(form.clearContestProblemset) }}
        {% endif %}
        {{ form_row(form.warningMessage) }}
    </div>
    <div class="col-lg-6">
        <h5>Specification of contest times</h5>
        <div>Each of the contest times can be specified as absolute time or relative
        to the start time (except for start time itself). Use up to 6 subsecond
        decimals and a timezone from the
        <a target="_blank" href="https://en.wikipedia.org/wiki/List_of_tz_database_time_zones">
            time zone database</a>.</div>
        <div class="mt-3"><table>
        <tr><td>Absolute time format:</td><td><kbd>YYYY-MM-DD HH:MM:SS[.uuuuuu] timezone</kbd></td></tr>
        <tr><td>Relative time format:</td><td><kbd>±[HHH]H:MM[:SS[.uuuuuu]]</kbd></td></tr>
        </table></div>
    </div>
</div>
<table class="table table-sm table-striped">
    <thead>
    <tr>
        <th>{{ form.problems.vars.prototype.problem.vars.label }}</th>
        <th>{{ form.problems.vars.prototype.shortname.vars.label }}</th>
        <th>{{ form.problems.vars.prototype.points.vars.label }}</th>
        <th>{{ form.problems.vars.prototype.allowSubmit.vars.label }}</th>
        <th>{{ form.problems.vars.prototype.allowJudge.vars.label }}</th>
        <th>{{ form.problems.vars.prototype.color.vars.label }}</th>
        <th>{{ form.problems.vars.prototype.lazyEvalResults.vars.label }}</th>
        <th></th>
    </tr>
    </thead>
    <tbody data-collection-holder data-after-add="bindColor">
    {% for problem in form.problems %}
        <tr>
            <td>
                {{ form_errors(problem.problem) }}
                {{ form_widget(problem.problem) }}
            </td>
            <td>
                {{ form_errors(problem.shortname) }}
                {{ form_widget(problem.shortname) }}
            </td>
            <td>
                {{ form_errors(problem.points) }}
                {{ form_widget(problem.points) }}
            </td>
            <td>
                {{ form_errors(problem.allowSubmit) }}
                {{ form_widget(problem.allowSubmit) }}
            </td>
            <td>
                {{ form_errors(problem.allowJudge) }}
                {{ form_widget(problem.allowJudge) }}
            </td>
            <td>
                {{ form_errors(problem.color) }}
                {{ form_widget(problem.color) }}
            </td>
            <td>
                {{ form_errors(problem.lazyEvalResults) }}
                {{ form_widget(problem.lazyEvalResults) }}
            </td>
            <td>
                <button type="button" data-delete class="btn btn-danger"><i class="fas fa-trash-alt"></i></button>
            </td>
        </tr>
    {% endfor %}
    </tbody>
    <tfoot>
    <tr>
        <td colspan="7"></td>
        <td>
            <button type="button" data-add class="btn btn-success"><i class="fas fa-plus"></i></button>
        </td>
    </tr>
    </tfoot>
</table>

<script type="text/html" data-prototype>
    <tr>
        <td>{{ form_widget(form.problems.vars.prototype.problem) }}</td>
        <td>{{ form_widget(form.problems.vars.prototype.shortname) }}</td>
        <td>{{ form_widget(form.problems.vars.prototype.points) }}</td>
        <td>{{ form_widget(form.problems.vars.prototype.allowSubmit) }}</td>
        <td>{{ form_widget(form.problems.vars.prototype.allowJudge) }}</td>
        <td>{{ form_widget(form.problems.vars.prototype.color) }}</td>
        <td>{{ form_widget(form.problems.vars.prototype.lazyEvalResults) }}</td>
        <td>
            <button type="button" data-delete class="btn btn-danger"><i class="fas fa-trash-alt"></i></button>
        </td>
    </tr>
</script>

{{ form_end(form) }}

<script>
    $(function () {
        function showHideTeams() {
            if ($('#contest_openToAllTeams_1').is(':checked')) {
                $('[data-teams-field]').show();
            } else {
                $('[data-teams-field]').hide();
            }
        }

        $('#contest_openToAllTeams_1, #contest_openToAllTeams_0').on('change', showHideTeams);
        showHideTeams();

        function showHideMedals() {
            if ($('#contest_medalsEnabled_0').is(':checked')) {
                $('[data-medals-field]').show();
            } else {
                $('[data-medals-field]').hide();
            }
        }

        $('#contest_medalsEnabled_1, #contest_medalsEnabled_0').on('change', showHideMedals);
        showHideMedals();
    })
</script>