Roman/ohm_streaming
1
0
Fork 0
Code Issues Pull Requests 2 Actions Packages Projects Releases Wiki Activity

fix: boutons telechargement fonctionnels + refonte UI downloads (#17, #8)

Browse Source 
- Route GET /api/downloads/video/{task_id} pour streamer les videos
- Route POST /api/downloads/{task_id}/retry pour relancer les failed
- Route POST /api/downloads/cancel-all pour annuler tous les actifs
- Barre de progression animee (shimmer + pulse)
- Indicateurs visuels par status (bordures colorees)
- Bouton Retry pour telechargements echoues/annules
- Actions groupees (Nettoyer termines, Tout annuler)
- Compteur de telechargements actifs
- hx-on::after-request pour refresh auto

Closes #17, Closes #8
This commit is contained in:
root
2026-04-02 22:35:49 +00:00
parent 5d264d8f3b
commit 9f9df600c1
4 changed files with 172 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files
templates/components/downloads_list.html
+18 -8
View File
@@ -1,7 +1,7 @@
{% if tasks %}
<div class="downloads-grid">
{% for task in tasks %}
<div class="download-item task-{{ task.status }}">
<div class="download-item status-{{ task.status }}">
<div class="download-info">
<span class="download-name" title="{{ task.filename }}">{{ task.filename }}</span>
<span class="badge badge-{{ task.status }}">{{ task.status | upper }}</span>
@@ -19,28 +19,38 @@
<div class="download-actions">
{% if task.status == 'downloading' or task.status == 'pending' %}
<button class="btn-icon" hx-post="/api/downloads/{{ task.id }}/pause" hx-swap="none">
<button class="btn-icon" hx-post="/api/downloads/{{ task.id }}/pause" hx-swap="none"
hx-on::after-request="htmx.trigger('#downloads-container-inner', 'refresh')" title="Pause">
<i class="fas fa-pause"></i>
</button>
{% elif task.status == 'paused' %}
<button class="btn-icon success" hx-post="/api/downloads/{{ task.id }}/resume" hx-swap="none">
<button class="btn-icon success" hx-post="/api/downloads/{{ task.id }}/resume" hx-swap="none"
hx-on::after-request="htmx.trigger('#downloads-container-inner', 'refresh')" title="Reprendre">
<i class="fas fa-play"></i>
</button>
{% endif %}
{% if task.status == 'failed' or task.status == 'cancelled' %}
<button class="btn-icon warning" hx-post="/api/downloads/{{ task.id }}/retry" hx-swap="none"
hx-on::after-request="htmx.trigger('#downloads-container-inner', 'refresh')" title="Relancer">
<i class="fas fa-redo"></i>
</button>
{% endif %}
{% if task.status == 'completed' %}
<a href="/video/{{ task.id }}" class="btn-icon success" title="Voir la vidéo">
<i class="fas fa-external-link-alt"></i>
<a href="/api/downloads/video/{{ task.id }}" class="btn-icon success" title="Streamer">
<i class="fas fa-play-circle"></i>
</a>
<a href="/downloads/{{ task.filename }}" class="btn-icon" download title="Télécharger le fichier">
<a href="/downloads/{{ task.filename }}" class="btn-icon" download title="Telecharger">
<i class="fas fa-file-download"></i>
</a>
{% endif %}
<button class="btn-icon danger"
hx-delete="/api/downloads/{{ task.id }}"
hx-confirm="Supprimer ce téléchargement ?"
hx-confirm="Supprimer ce telechargement ?"
hx-swap="none"
hx-on::after-request="htmx.trigger('#downloads-container-inner', 'refresh')"
title="Supprimer">
<i class="fas fa-trash"></i>
</button>
@@ -51,6 +61,6 @@
{% else %}
<div class="empty-state" style="text-align: center; padding: 60px 20px; color: var(--text-dim);">
<i class="fas fa-cloud-download-alt" style="font-size: 3rem; margin-bottom: 20px; opacity: 0.1; display: block;"></i>
<p>Aucun téléchargement en cours</p>
<p>Aucun telechargement en cours</p>
</div>
{% endif %}