{% extends "base.html" %}
{# Copyright The IETF Trust 2015, All Rights Reserved #}
{% load origin %}
{% load django_bootstrap5 %}
{% block title %}Set telechat date for {{ doc.name }}{% endblock %}
{% block content %}
    {% origin %}
    <h1>
        Set telechat date
        <br>
        <small class="text-body-secondary">{{ doc.name }} ({{ doc.pages }} page{{ doc.pages|pluralize }})</small>
    </h1>
    {% for warning in warnings %}<div class="alert alert-warning my-3">{{ warning }}</div>{% endfor %}
    <form method="post">
        {% csrf_token %}
        {% bootstrap_form form %}
        <div id="large_page_count_warning" class="alert alert-warning my-3">
            Putting the document on this telechat gives the telechat a very large document page count. Please consider choosing another telechat date for this document.
        </div>
        <button type="submit" class="btn btn-primary">Save</button>
        <a class="btn btn-secondary float-end"
           href="{% url "ietf.doc.views_doc.document_main" name=doc.name %}">Back</a>
    </form>
{% endblock %}
{% block js %}
    <script>
        var pages = {};
        {% for date,count in form.page_count.items %}            pages['{{date}}'] = {{count}};{% endfor %}

        $("#large_page_count_warning").hide();

        function toggleWarning(date) {
            if ( date==="" | pages[date] + {{ doc.pages }} < 400 ) {
                $("#large_page_count_warning").hide();
            } else {
                $("#large_page_count_warning").show();
            }
        }

        $("select[name='telechat_date']").on("change", function () {
            toggleWarning($(this).val());
        });
    </script>
{% endblock %}