data
0ebe600215
- fix: escapeAttr() ueberall mit Anfuehrungszeichen versehen (14 Stellen) Ohne Quotes brachen onclick-Handler bei Titeln mit Leerzeichen -> TVDB-Zuordnung, Play, Delete, Import-Browser betroffen - fix: escapeHtml() in onclick durch escapeAttr() ersetzt (4 Stellen) escapeHtml erzeugt & statt \' -> JS-Syntaxfehler in Handlern - fix: Import-Modal schliesst nach Start statt Ladebalken anzuzeigen Globaler Progress-Balken in base.html uebernimmt den Fortschritt - feat: Queue Pause/Resume - laufende Konvertierung laeuft fertig, keine neuen Jobs gestartet bis Weiter geklickt wird API: POST /api/queue/pause, /api/queue/resume, GET /api/queue/status Button im Dashboard neben Warteschlange-Header Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
95 lines
3.6 KiB
HTML
95 lines
3.6 KiB
HTML
{% extends "base.html" %}
|
|
|
|
{% block title %}Dashboard - VideoKonverter{% endblock %}
|
|
|
|
{% block content %}
|
|
<!-- Aktionen -->
|
|
<section id="actions-section">
|
|
<div class="action-bar">
|
|
<button class="btn-primary" onclick="openFileBrowser()">Dateien durchsuchen</button>
|
|
<button class="btn-secondary" onclick="openUpload()">Video hochladen</button>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Aktive Konvertierungen -->
|
|
<section id="active-section">
|
|
<h2>Aktive Konvertierungen</h2>
|
|
<div id="active-conversions">
|
|
<!-- Wird dynamisch via WebSocket gefuellt -->
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Warteschlange -->
|
|
<section id="queue-section">
|
|
<div style="display:flex; align-items:center; gap:1rem;">
|
|
<h2 style="margin:0">Warteschlange</h2>
|
|
<button id="btn-queue-pause" class="btn-secondary btn-small" onclick="toggleQueuePause()">
|
|
⏸ Pause
|
|
</button>
|
|
<span id="queue-paused-hint" class="status-badge warn" style="display:none">Pausiert</span>
|
|
</div>
|
|
<div id="queue">
|
|
<!-- Wird dynamisch via WebSocket gefuellt -->
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Filebrowser Modal -->
|
|
<div id="filebrowser-overlay" class="modal-overlay" style="display:none" onclick="closeBrowserOnOverlay(event)">
|
|
<div class="modal">
|
|
<div class="modal-header">
|
|
<h2>Dateien durchsuchen</h2>
|
|
<button class="btn-close" onclick="closeFileBrowser()">×</button>
|
|
</div>
|
|
<div class="modal-breadcrumb" id="fb-breadcrumb"></div>
|
|
<div class="modal-body" id="fb-content">
|
|
Lade...
|
|
</div>
|
|
<div class="modal-footer">
|
|
<span id="fb-selected-count">0 ausgewaehlt</span>
|
|
<div>
|
|
<button class="btn-secondary" id="fb-select-all" onclick="fbSelectAll()">Alle auswaehlen</button>
|
|
<button class="btn-primary" id="fb-convert" onclick="fbConvertSelected()" disabled>Konvertieren</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Upload Modal -->
|
|
<div id="upload-overlay" class="modal-overlay" style="display:none" onclick="closeUploadOnOverlay(event)">
|
|
<div class="modal modal-small">
|
|
<div class="modal-header">
|
|
<h2>Video hochladen</h2>
|
|
<button class="btn-close" onclick="closeUpload()">×</button>
|
|
</div>
|
|
<div class="modal-body">
|
|
<div class="upload-zone" id="upload-zone"
|
|
ondrop="handleDrop(event)" ondragover="handleDragOver(event)" ondragleave="handleDragLeave(event)">
|
|
<p>Videodateien hierher ziehen</p>
|
|
<p class="upload-hint">oder</p>
|
|
<label class="btn-secondary upload-btn">
|
|
Dateien waehlen
|
|
<input type="file" id="upload-input" multiple accept="video/*" onchange="handleFileSelect(event)" style="display:none">
|
|
</label>
|
|
</div>
|
|
<div id="upload-list" class="upload-list"></div>
|
|
<div id="upload-progress" class="upload-progress" style="display:none">
|
|
<div class="progress-container">
|
|
<div class="progress-bar" id="upload-bar"></div>
|
|
</div>
|
|
<span id="upload-status">Wird hochgeladen...</span>
|
|
</div>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button class="btn-primary" id="upload-start" onclick="startUpload()" disabled>Hochladen & Konvertieren</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% endblock %}
|
|
|
|
{% block scripts %}
|
|
<script>
|
|
var WS_URL = "{{ ws_url }}";
|
|
</script>
|
|
<script src="/static/js/websocket.js"></script>
|
|
<script src="/static/js/filebrowser.js"></script>
|
|
{% endblock %}
|