karaoqueue/templates/main_admin.html

{% extends 'base.html' %}
{% block title %}Home{% endblock %}
{% block content %}
<div class="container">
    <div class="row">
        <div class="card" style="width: 100%">
            <div class="card-body d-flex flex-row">
                <button type="button" class="btn btn-danger m-2"
                    onclick="confirmDeleteAllEntries()"><i class="fas fa-trash mr-2"></i>Alle Einträge löschen</button>
                <button type="button" class="btn btn-danger m-2"
                    onclick="confirmUpdateSongDatabase()"><i class="fas fa-file-import mr-2"></i>Song-Datenbank
                    aktualisieren</button>
            </div>
        </div>
    </div>
    <div class="row">
        <table class="table">
            <tr>
                <th scope="col">Name</th>
                <th scope="col">Song</th>
                <th scope="col">Künstler</th>
                <th scope="col">Löschen</th>
            </tr>
            {% for entry in list: %}
            <tr>
                <td>
                    {{ entry[0] }}
                </td>
                <td>
                    {{ entry[1] }}
                </td>
                <td>
                    {{ entry[2] }}
                </td>
                <td>
                    <button type='button' class='btn btn-danger justify-content-center align-content-between'
                        onclick='confirmDeleteEntry("{{ entry[0] }}",{{ entry[3] }})'><i
                            class="fas fa-trash"></i></button>
                </td>
            </tr>
            {% endfor %}
        </table>
        <a name="end"></a>
    </div>
</div>
{% endblock %}
{% block extrajs %}
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootbox.js/4.4.0/bootbox.min.js"
    integrity="sha256-4F7e4JsAJyLUdpP7Q8Sah866jCOhv72zU5E8lIRER4w=" crossorigin="anonymous"></script>
<script>
    function confirmDeleteEntry(name, entry_id) {
        bootbox.confirm("Wirklich den Eintrag von "+name+" löschen?", function(result){
            if (result) {
                deleteEntry(entry_id)
            }
        })
    }
    function confirmDeleteAllEntries() {
        bootbox.confirm({
            message: "Wirklich alle Eintragungen löschen?", 
            buttons: {
                confirm: {
                    label: 'Ja',
                    className: 'btn btn-danger'
                },
                cancel: {
                    label: 'Nein',
                    className: 'btn btn-secondary'
                }
            },
            callback: function(result){
                if (result) {
                    deleteAllEntries()
                }
            }
        })
    }
    function confirmUpdateSongDatabase() {
        bootbox.confirm({
            message: "Wirklich die Song-Datenbank aktualisieren?<br>Dies lädt die Aktuelle Song-Liste von <a href='https://www.karafun.de/karaoke-song-list.html'>KaraFun</a> herunter, <b>und wird alle Eintragungen löschen!</b>",
            buttons: {
                confirm: {
                    label: 'Ja',
                    className: 'btn-primary'
                },
                cancel: {
                    label: 'Nein',
                    className: 'btn btn-secondary'
                }
            },
            callback: function(result){
                if (result) {
                    var dialog = bootbox.dialog({
                        message: '<p class="text-center mb-0"><i class="fa fa-spin fa-cog"></i> Aktualisiere Song-Datenbank...</p>',
    
                        closeButton: false
                    });
                    updateSongDatabase(dialog)                    
                }
            }
        })
    }
    function deleteEntry(entry_id) {
       $.ajax({
        type: 'GET',
        url: '/api/entries/delete/'+entry_id,
        contentType: "application/json",
        dataType: 'json'
       });
       location.reload();
    }
    function deleteAllEntries() {
        $.ajax({
            type: 'GET',
            url: '/api/entries/delete_all',
            contentType: "application/json",
            dataType: 'json'
        });
        location.reload();
    }
    function updateSongDatabase(wait_dialog) {
        $.ajax({
            type: 'GET',
            url: '/api/songs/update',
            contentType: "application/json",
            dataType: 'json',
            success: function(data) {
                wait_dialog.modal('hide')
                bootbox.alert({
                    message: data["status"],
                    callback: function() {location.reload()}
                })
            }
        });
    }
</script>
{% endblock %}