ethiele/signage
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Version 3 mit URL und Newsticker

Browse Source 
Co-authored-by: Copilot <copilot@github.com>
This commit is contained in:
Erik Thiele
2026-04-25 19:26:35 +02:00
parent 5ac9dee8fc
commit 742f993a73
5 changed files with 373 additions and 74 deletions
Download Patch File Download Diff File Expand all files Collapse all files

126
templates/admin.html
View File

@@ -38,6 +38,7 @@
background-color: #eeeeee;
border-left: 6px solid #DA002D;
padding-left: 1rem;
font-size: 1.1rem; /* leicht größer */
font-weight: 600;
}
@@ -93,6 +94,22 @@
.drag-handle:active {
cursor: grabbing;
}
/* CANCOM CI Tooltip Styling */
.tooltip {
--bs-tooltip-border-color: #DA002D;
}
.tooltip .tooltip-inner {
border: 1px solid #DA002D;
background-color: #ffffff;
color: #212121;
box-shadow: none;
}
.tooltip .tooltip-arrow::before {
border-top-color: #DA002D;
border-bottom-color: #DA002D;
background-color: #ffffff;
}
</style>
</head>
@@ -116,7 +133,7 @@
Admin Dashboard
<h2 class="page-title text-white">Simple Signage</h2>
</span>
</a>s
</a>
<div class="d-none d-sm-inline">
<a href="/logout" class="btn">Logout</a>
@@ -139,7 +156,7 @@
⚠ PRIORITY (global)
</strong>
</div>
<span class="badge bg-success">wirkt auf alle Player</span>
<span class="badge bg-green text-green-fg">wirkt auf alle Player</span>
</div>
<div class="card-body">
@@ -161,6 +178,14 @@
</div>
</form>
<form action="/admin/add-url/priority" method="post" class="mb-3">
<div class="input-group">
<input type="url" name="url" class="form-control"
placeholder="https://example.com" required>
<button class="btn btn-secondary" type="submit">URL hinzufügen</button>
</div>
</form>
<!-- Playlist -->
<h4>Playlist Reihenfolge</h4>
@@ -169,21 +194,37 @@
<li class="list-group-item playlist-row"
data-file="{{ file.name }}">
<span class="playlist-name">{{ file.name }}</span>
<span class="playlist-name"
{% if file.type == "image" %}
data-bs-toggle="tooltip"
data-bs-html="true"
title="<img src='/media/priority/{{ file.name }}' style='max-width: 200px; max-height: 150px; border: none; background: white; padding: 2px;' alt='Vorschau'>"
{% elif file.type == "url" %}
data-bs-toggle="tooltip"
title="URL: {{ file.name }}"
{% endif %}>
{{ file.name }}
</span>
{% if file.type == "image" %}
<span class="badge bg-blue-lt">Bild</span>
{% elif file.type == "url" %}
<span class="badge bg-info">URL</span>
{% else %}
<span class="badge bg-orange-lt">Video</span>
{% endif %}
<span class="playlist-size">{{ file.size }} KB</span>
<span class="playlist-size">
{% if file.type == "url" %}
{{ file.size }}
{% else %}
{{ file.size }} KB
{% endif %}
</span>
<!-- Delete -->
<form action="{{url_for('delete_file',
screen='priority',
filename=file.name) }}"
<form action="{{ url_for('delete_file', screen='priority', filename=file.name) }}"
method="post"
class="d-inline"
onmousedown="event.stopPropagation()">
@@ -215,9 +256,9 @@
<!-- Card Header -->
<div class="card-header d-flex justify-content-between align-items-center">
<span>Screen: {{ screen }}</span>
<span>Screen: https://signage.ccmake.de/player/{{ screen }}</span>
{% if screen_status[screen] == "active" %}
<span class="badge bg-success">Aktiv</span>
<span class="badge bg-green text-green-fg">Aktiv</span>
{% else %}
<span class="badge bg-warning text-dark">Leer</span>
{% endif %}
@@ -226,13 +267,26 @@
<div class="card-body">
<!-- Einstellungen -->
<h2>Einstellungen</h2>
<form action="/admin/update/{{ screen }}" method="post">
<div class="mb-3">
<div class="mb-2">
<label class="form-label">Intervall (Sekunden)</label>
<input type="number" class="form-control"
name="interval" min="1" value="{{ cfg.interval }}">
</div>
<div class="mb-4">
<label class="form-label">Newsticker-Text</label>
<input type="text" class="form-control" name="newsticker_text" value="{{ cfg.newsticker_text|default('') }}" maxlength="200">
</div>
<div class="form-check form-switch mb-2">
<input class="form-check-input" type="checkbox"
name="newsticker_enabled"
{% if cfg.newsticker_enabled %}checked{% endif %}>
<label class="form-check-label">Newsticker anzeigen</label>
</div>
<div class="form-check form-switch mb-2">
<input class="form-check-input" type="checkbox"
name="show_images"
@@ -240,7 +294,7 @@
<label class="form-check-label">Bilder anzeigen</label>
</div>
<div class="form-check form-switch mb-3">
<div class="form-check form-switch mb-4">
<input class="form-check-input" type="checkbox"
name="show_videos"
{% if cfg.show_videos %}checked{% endif %}>
@@ -255,7 +309,7 @@
<hr>
<!-- Upload -->
<h4>Medien hochladen</h4>
<h2>Medien hochladen / URL hinzufügen</h2>
<form action="/admin/upload/{{ screen }}"
method="post" enctype="multipart/form-data">
<div class="input-group mb-3">
@@ -264,26 +318,54 @@
</div>
</form>
<form action="/admin/add-url/{{ screen }}" method="post" class="mb-4">
<div class="input-group">
<input type="url" name="url" class="form-control"
placeholder="https://example.com" required>
<button class="btn btn-secondary" type="submit">URL hinzufügen</button>
</div>
</form>
<hr>
<!-- Playlist -->
<h4>Playlist Reihenfolge</h4>
<h2>Playlist Reihenfolge</h2>
<ul class="list-group mb-3" id="playlist-{{ screen }}">
{% for file in media_files[screen] %}
<li class="list-group-item playlist-row"
data-file="{{ file.name }}">
<span class="playlist-name">{{ file.name }}</span>
<span class="playlist-name"
{% if file.type == "image" %}
data-bs-toggle="tooltip"
data-bs-html="true"
title="<img src='/media/{{ screen }}/{{ file.name }}' style='max-width: 200px; max-height: 150px; border: none; background: white; padding: 2px;' alt='Vorschau'>"
{% elif file.type == "url" %}
data-bs-toggle="tooltip"
title="URL: {{ file.name }}"
{% endif %}>
{{ file.name }}
</span>
{% if file.type == "image" %}
<span class="badge bg-blue-lt">Bild</span>
<span class="badge bg-purple text-purple-fg">Bild</span>
{% elif file.type == "url" %}
<span class="badge bg-blue text-blue-fg">URL</span>
{% else %}
<span class="badge bg-orange-lt">Video</span>
<span class="badge bg-orange text-orange-fg">Video</span>
{% endif %}
<span class="playlist-size">{{ file.size }} KB</span>
<span class="playlist-size">
{% if file.type == "url" %}
{{ file.size }}
{% else %}
{{ file.size }} KB
{% endif %}
</span>
<!-- Delete -->
<form action="/admin/delete/{{ screen }}/{{ file.name }}"
<form action="{{ url_for('delete_file', screen=screen, filename=file.name) }}"
method="post">
<button type="submit"
class="btn btn-outline-danger btn-sm"
@@ -360,9 +442,11 @@ document.addEventListener("DOMContentLoaded", function () {
window.savePlaylist = savePlaylist;
{% for screen in screens.keys() %}
initSortable("{{ screen }}");
{% endfor %}
// Initialize tooltips
var tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="tooltip"]'));
var tooltipList = tooltipTriggerList.map(function (tooltipTriggerEl) {
return new bootstrap.Tooltip(tooltipTriggerEl);
});
});
</script>