{% extends 'master.twig' %}
{% from 'macros.twig' import torrent_listing_entry %}

{% set title = 'Pending Torrents' %}
{% set show_more = false %}
{% set last_id = 0 %}

{% block content %}
    <div class="downloads">
        <div class="downloads-header">Pending Torrents</div>
        <div class="downloads-listing">
            {% if torrents is empty %}
                <div class="downloads-nothing">There are no pending torrents!</div>
            {% else %}
                {% for torrent in torrents %}
                    {{ torrent_listing_entry(torrent, 'downloads-item') }}
                    {% set last_id = torrent.info.id %}
                {% endfor %}
            {% endif %}
        </div>

        {% if show_more %}
            <div class="downloads-more"><a href="{{ page_url }}start={{ last_id }}">View more</a></div>
        {% endif %}
    </div>
    <script>
        (function() {
            const nukeListing = (dlId) => document.getElementById(`tdl${dlId}`)?.remove();

            const jsPendingApprove = document.querySelectorAll('.js-listing-approve');
            for(const elem of jsPendingApprove)
                (function(elem) {
                    elem.onclick = () => seria.dls.approve(elem.dataset.dlid).then(result => {
                        if(result !== '') {
                            alert('Something went wrong: ' + result);
                            return;
                        }

                        nukeListing(elem.dataset.dlid);
                    });
                })(elem);

            const jsPendingDeny = document.querySelectorAll('.js-listing-deny');
            for(const elem of jsPendingDeny)
                (function(elem) {
                    elem.onclick = () => seria.dls.deny(elem.dataset.dlid).then(result => {
                        if(result !== '') {
                            alert('Something went wrong: ' + result);
                            return;
                        }

                        nukeListing(elem.dataset.dlid);
                    });
                })(elem);
        })();
    </script>
{% endblock %}