mirror of
https://github.com/PhoenixTwoFive/karaoqueue.git
synced 2025-05-19 11:01:47 +02:00
219 lines
9.1 KiB
HTML
219 lines
9.1 KiB
HTML
{% extends 'base.html' %}
|
|
{% block title %}Warteliste-Admin{% endblock %}
|
|
{% block content %}
|
|
<style>
|
|
table td:nth-child(2) {
|
|
overflow-y: hidden;
|
|
overflow-x: auto;
|
|
text-overflow: clip;
|
|
max-width: 200px !important;
|
|
}
|
|
</style>
|
|
<div class="container">
|
|
<div id="toolbar">
|
|
<button type="button" class="topbutton btn btn-danger" onclick="confirmDeleteSelectedEntries()"><i
|
|
class="fas fa-trash mr-2"></i>Gewählte Einträge löschen</button>
|
|
<button type="button" class="topbutton btn btn-danger" onclick="confirmUpdateSongDatabase()"><i
|
|
class="fas fa-file-import mr-2"></i>Song-Datenbank
|
|
aktualisieren</button>
|
|
<input id="entryToggle" type="checkbox" class="topbutton" data-toggle="toggle" data-on="Eintragen erlaubt"
|
|
data-off="Eintragen deaktiviert" data-onstyle="success" data-offstyle="danger">
|
|
</div>
|
|
<table class="table entries" id="entrytable" data-toggle="table" data-search="true" data-show-columns="true"
|
|
data-show-toggle="true" data-multiple-select-row="true" data-click-to-select="true" data-toolbar="#toolbar"
|
|
data-pagination="true" data-show-extended-pagination="true" data-classes="table table-hover"
|
|
data-url="/api/queue" data-show-refresh="true" data-auto-refresh="true" data-auto-refresh-interval="10">
|
|
<thead>
|
|
<tr>
|
|
<th data-field="state" data-checkbox="true"></th>
|
|
<th scope="col" data-field="Name" data-formatter="CopyFormatter">Name</th>
|
|
<th scope="col" data-field="Title"data-formatter="CopyFormatter">Song</th>
|
|
<th scope="col" data-field="Artist"data-formatter="CopyFormatter">Künstler</th>
|
|
<th scope="col" data-formatter="TableActions">Aktionen</th>
|
|
</tr>
|
|
</thead>
|
|
</table>
|
|
<a name="end"></a>
|
|
</div>
|
|
{% endblock %}
|
|
{% block extrajs %}
|
|
<script>
|
|
$(function () {
|
|
refreshEntryToggle()
|
|
$('#entryToggle').change(function () {
|
|
$.ajax({ url: "/api/entries/accept/" + ($('#entryToggle').is(":checked") ? "1" : "0"), complete: setTimeout(refreshEntryToggle, 1000) });
|
|
})
|
|
$("#entrytable").bootstrapTable().on('load-success.bs.table', function () {
|
|
$('[data-toggle="tooltip"]').tooltip()
|
|
})
|
|
$('[data-toggle="tooltip"]').tooltip({
|
|
trigger: 'hover'
|
|
})
|
|
})
|
|
function confirmDeleteEntry(name, entry_id) {
|
|
bootbox.confirm("Wirklich den Eintrag von " + name + " löschen?", function (result) {
|
|
if (result) {
|
|
deleteEntry(entry_id)
|
|
}
|
|
})
|
|
}
|
|
function confirmDeleteSelectedEntries() {
|
|
bootbox.confirm({
|
|
message: "Wirklich gewählte Eintragungen löschen?",
|
|
buttons: {
|
|
confirm: {
|
|
label: 'Ja',
|
|
className: 'btn btn-danger'
|
|
},
|
|
cancel: {
|
|
label: 'Nein',
|
|
className: 'btn btn-secondary'
|
|
}
|
|
},
|
|
callback: function (result) {
|
|
if (result) {
|
|
DeleteSelectedEntries(getIdSelections())
|
|
}
|
|
}
|
|
})
|
|
}
|
|
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 refreshEntryToggle() {
|
|
$.getJSON("/api/entries/accept", (data) => {
|
|
if (data["value"] != $('#entryToggle').is(":checked")) {
|
|
if (data["value"] == 1) {
|
|
$('#entryToggle').data('bs.toggle').on('true')
|
|
}
|
|
else {
|
|
$('#entryToggle').data('bs.toggle').off('true')
|
|
}
|
|
}
|
|
})
|
|
}
|
|
function deleteEntry(entry_id) {
|
|
$.ajax({
|
|
type: 'GET',
|
|
url: '/api/entries/delete/' + entry_id,
|
|
contentType: "application/json",
|
|
dataType: 'json',
|
|
async: false
|
|
});
|
|
$("#entrytable").bootstrapTable('refresh')
|
|
|
|
}
|
|
function markEntryAsSung(entry_id) {
|
|
$.ajax({
|
|
type: 'GET',
|
|
url: '/api/entries/mark_sung/' + entry_id,
|
|
contentType: "application/json",
|
|
dataType: 'json',
|
|
async: false
|
|
});
|
|
$("#entrytable").bootstrapTable('refresh')
|
|
|
|
}
|
|
|
|
function markEntryAsTransferred(entry_id) {
|
|
$.ajax({
|
|
type: 'GET',
|
|
url: '/api/entries/mark_transferred/' + entry_id,
|
|
contentType: "application/json",
|
|
dataType: 'json',
|
|
async: false
|
|
});
|
|
$("#entrytable").bootstrapTable('refresh')
|
|
|
|
}
|
|
|
|
function DeleteSelectedEntries(ids) {
|
|
$.ajax({
|
|
type: 'POST',
|
|
url: '/api/entries/delete',
|
|
data: JSON.stringify(ids), // or JSON.stringify ({name: 'jonas'}),
|
|
error: function () {
|
|
bootbox.alert({
|
|
message: "Fehler beim Löschen der Eintragungen.",
|
|
})
|
|
},
|
|
success: function () {
|
|
$("#entrytable").bootstrapTable('refresh')
|
|
|
|
},
|
|
contentType: "application/json",
|
|
dataType: 'json'
|
|
});
|
|
}
|
|
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 () {
|
|
$("#entrytable").bootstrapTable('refresh')
|
|
}
|
|
})
|
|
}
|
|
});
|
|
}
|
|
function TableActions(value, row, index) {
|
|
let outerHTML = ""
|
|
if (row.Transferred == 1) {
|
|
outerHTML = "<button type=\"button\" class=\"btn btn-default\" data-toggle=\"tooltip\" data-placement=\"top\" title=\"Markierung zurückziehen\" onclick=\"event.stopPropagation();$(this).tooltip('dispose');markEntryAsTransferred(" + row.entry_ID + ")\"><i class=\"fas fa-backward\"></i></button> <button type=\"button\" class=\"btn btn-success\" data-toggle=\"tooltip\" data-placement=\"top\" title=\"Als gesungen markieren\" onclick=\"event.stopPropagation();$(this).tooltip('dispose');markEntryAsSung(" + row.entry_ID + ")\"><i class=\"fas fa-check\"></i></button> <button type=\"button\" class=\"btn btn-danger\" data-toggle=\"tooltip\" data-placement=\"top\" title=\"Eintrag löschen\" onclick=\"event.stopPropagation();$(this).tooltip('dispose');confirmDeleteEntry('" + row.Name + "'," + row.entry_ID + ")\"><i class=\"fas fa-trash\"></i></button>";
|
|
} else {
|
|
outerHTML = "<button type=\"button\" class=\"btn btn-info\" data-toggle=\"tooltip\" data-placement=\"top\" title=\"Als übertragen markieren\" onclick=\"event.stopPropagation();$(this).tooltip('dispose');markEntryAsTransferred(" + row.entry_ID + ")\"><i class=\"fas fa-exchange-alt\"></i></button> <button type=\"button\" class=\"btn btn-success\" data-toggle=\"tooltip\" data-placement=\"top\" title=\"Als gesungen markieren\" onclick=\"event.stopPropagation();$(this).tooltip('dispose');markEntryAsSung(" + row.entry_ID + ")\"><i class=\"fas fa-check\"></i></button> <button type=\"button\" class=\"btn btn-danger\" data-toggle=\"tooltip\" data-placement=\"top\" title=\"Eintrag löschen\" onclick=\"event.stopPropagation();$(this).tooltip('dispose');confirmDeleteEntry('" + row.Name + "'," + row.entry_ID + ")\"><i class=\"fas fa-trash\"></i></button>";
|
|
}
|
|
return outerHTML;
|
|
}
|
|
|
|
function CopyFormatter(value, row, index) {
|
|
return "<span onclick='copyAndNotify(\""+value+"\")'>"+value+"</span>";
|
|
}
|
|
|
|
function getIdSelections() {
|
|
return $.map($("#entrytable").bootstrapTable('getSelections'), function (row) {
|
|
return row.entry_ID
|
|
})
|
|
}
|
|
|
|
function copyAndNotify(text) {
|
|
navigator.clipboard.writeText(text).then(function () {
|
|
let toast = {
|
|
title: "Kopiert",
|
|
message: text,
|
|
status: 1,
|
|
timeout: 5000
|
|
};
|
|
Toast.create(toast);
|
|
})
|
|
}
|
|
</script>
|
|
{% endblock %} |