{% extends "board/base.html" %}
{% load i18n post_body %}

{% block title %}
Replying to {{post.id}} {{block.super}}
{% endblock title %}

{% block extrastyle %}
<style>
table {
    width: 100%;
    height: 100%;
}
th {
    width: 1%;
    white-space: wrap;
    text-align: right;
}
textarea {
    box-sizing: border-box;
    width: 100%;
    max-width: 100%;
    height: 100%;
}
input[type=text] {
    box-sizing: border-box;
    width: 100%;
}
</style>
{% endblock %}

{% block content %}
<form method="post" action="{% url 'board:reply_create' url=board.url id=post.id %}" enctype="multipart/form-data">
    {% csrf_token %}
    {% if form.errors %}
        {{form.non_field_errors}}
    {% endif %}
    <table>
    {% for field in form %}
        {% if field.name != "capcode" %}
            {% if field.errors %}
            <tr>
                <th></th>
                <td>{{field.errors}}</td>
            </tr>
            {% endif %}
            <tr>
                <th>{{field.label_tag}}</th>
                <td>{{field}}</td>
            </tr>
        {% endif %}
    {% endfor %}
    {% if capcodes %}
    <tr>
        {% if form.capcode.errors %}
        <tr>
            <th></th>
            <td>{{form.capcode.errors}}</td>
        </tr>
        {% endif %}
        <th>{{form.capcode.label_tag}}</th>
        <td>
            {{form.capcode}}
        </td>
    </tr>
    {% endif %}
    <tr>
        <th>&nbsp;</th>
        <td>
            {% translate "Max image size" %}:
            {{ max_upload_size|measure_bytes }}
        </td>
    </tr>
    <tr><td>&nbsp;</td><td><input id="submit" type="submit" value="Submit" /></td></tr>
    </table>
</form>

<script>
$("#submit").on("click", (e) => {
    let name = $("#{{form.name.auto_id}}");
    setCookie(NAME_COOKIE, name.val(), 3600 * 24 * 28);
});

$(window).on("load", (e) => {
    $("#{{form.name.auto_id}}").val(getCookie(NAME_COOKIE));
});
</script>
{% endblock content %}