{% from 'forms/_form.html' import form_header, form_footer, form_rows, form_row %}

{%- block content %}
    {{ form_header(form, id='attachment-owncloudfilepicker-form', classes=('full-width')) }}
    {{ form_row(form.owncloud_filepicker, skip_label=true) }}
    {{ form_rows(form, skip=('folder', 'protected', 'acl', 'owncloud_filepicker')) }}
    {{ form_rows(form, fields=('folder', 'protected', 'acl')) }}
    {{ protection_message | safe }}
    {% call form_footer(attach_form) %}
        <input class="i-button big highlight" type="submit" value="{% trans %}Add{% endtrans %}">
        <button class="i-button big" data-button-back>{% trans %}Cancel{% endtrans %}</button>
    {% endcall %}
    <script>
        (function() {
            'use strict';

            $('#{{ form.folder.id }}').nullableselector();
            const form = $('#attachment-owncloudfilepicker-form');
            aclIfProtected(
                $('#{{ form.protected.id }}'),
                $('#{{ form.acl.id }}'),
                form.find('.protected-protection-message'),
                form.find('.inheriting-protection-message'),
                $('#{{ form.folder.id }}')
            );
            messageIfFolderProtected(
                $('#{{ form.protected.id }}'), $('#{{ form.folder.id }}'),
                {{ folders_protection_info | tojson }},
                $('.protected-protection-message'),
                $('.inheriting-protection-message'),
                $('.folder-protection-message')
            );
        })();
    </script>
{%- endblock %}
