<script>
    let fileName = '';
    $(document).ready(function() { 
        $('#toggle-collapse').click(function() {
            $('#new-document').toggle();
            console.log($(this).css('display'));
            $('#toggle-collapse').text($('#new-document').is(':hidden') ? '+' : '-');
        });
        $("[name='delete']").click(function() {
            fileName = $(this).parent().parent().children().first().text();
            $("#yesno").val = false;
            $("#yesno").text('Soll "' + fileName + '" wirklich gelöscht werden?');
            $("#yesno").dialog({
                close: function(event, ui) { console.log(event, ui); }
            });
            $("#yesno").data("callback", yesNoCallback).dialog('open');
        });
        function yesNoCallback(result) {
            if (result === true) {
                $.post('deletedocument',
                {
                    'file': fileName
                }).done(function(result) {
                    document.location.href = 'documents?ts=' + Date.now();
                });
            }
        }
    });
</script>
<div>
    <h2><span id="toggle-collapse" class="toggle-collapse">+</span>Neues Dokument hinzufügen</h2>
    <div id="new-document" style="display:none">
        {{form}}
    </div>
</div>
<div>
    <table>
        <thead>
            <tr>
                <th>Documenttitel</th>
                <th>Original-Dateiname</th>
                <th>Link</th>
                <th>Aktionen</th>
            </tr>
        </thead>
        <tbody>
            {{documents}}
        </tbody>
    </table>
</div>
