restructure for backend/frontend separation

backend/app/templates/played_list.html

@@ -0,0 +1,102 @@
+{% extends 'base.html' %}
+{% block title %}Abspielliste{% endblock %}
+{% block content %}
+<div id="toolbar">
+    <button type="button" class="topbutton btn btn-danger" onclick="confirmDeleteAllEntries()"><i
+            class="fas fa-trash mr-2"></i>Abspielliste löschen</button>
+    <button type="button" class="topbutton btn btn-primary" onclick="exportPDF()"><i
+            class="fas fa-file-pdf mr-2"></i>Als PDF herunterladen</button>
+    <button type="button" class="topbutton btn btn-secondary" onclick="printPDF()"><i
+            class="fas fa-print mr-2"></i>Drucken</button>
+</div>
+<table class="table"
+        id="table"
+        data-toggle="table"
+        data-search="true"
+        data-show-columns="true"
+        data-toolbar="#toolbar"
+        data-pagination="true"
+        data-classes="table table-bordered table-striped"
+        data-show-extended-pagination="true">
+    <thead>
+        <tr>
+            <th scope="col">Song</th>
+            <th scope="col">Wiedergaben</th>
+        </tr>
+    </thead>
+    {% for entry in list: %}
+    <tr>
+        <td>
+            {{ entry[0] }}
+        </td>
+        <td>
+            {{ entry[1] }}
+        </td>
+    </tr>
+    {% endfor %}
+</table>
+</table>
+{% endblock %}
+{% block extrajs %}
+<script src="https://unpkg.com/jspdf@latest/dist/jspdf.min.js"></script>
+<script src="https://unpkg.com/jspdf-autotable@3.1.1/dist/jspdf.plugin.autotable.js"></script>
+<script>
+    function confirmDeleteAllEntries() {
+        bootbox.confirm({
+            message: "Wirklich Abspielliste löschen?<br>Stelle sicher, dass du sie vorher zwecks Abrechnung gedruckt und/oder heruntergeladen hast!", 
+            buttons: {
+                confirm: {
+                    label: 'Ja',
+                    className: 'btn btn-danger'
+                },
+                cancel: {
+                    label: 'Nein',
+                    className: 'btn btn-secondary'
+                }
+            },
+            callback: function(result){
+                if (result) {
+                    deleteAllEntries()
+                }
+            }
+        })
+    }
+    function deleteAllEntries() {
+        $.ajax({
+            type: 'GET',
+            url: '/api/played/clear',
+            contentType: "application/json",
+            dataType: 'json',
+            async: false
+        });
+        location.reload();
+    }
+
+    function exportPDF() {
+        var doc = new jsPDF();
+        doc.autoTable({
+            head: [["Song","Wiedergaben"]],
+            body: createTableArray(),
+            theme: 'grid'
+        });
+        doc.save('Abspielliste.pdf');
+    }
+
+    function printPDF() {
+        var doc = new jsPDF();
+        doc.autoTable({
+            head: [["Song","Wiedergaben"]],
+            body: createTableArray(),
+            theme: 'grid'
+        });
+        doc.autoPrint();
+        doc.output('dataurlnewwindow');
+    }
+
+    function createTableArray() {
+        var data = $("#table").bootstrapTable('getData')
+        out = data.map(x => [x["0"],x["1"]])
+        return out;
+    }
+</script>
+{% endblock %}