refactor: session-based incremental TFE upload via HTMX, drop SortableJS

Replace the client-side FileArray + Sortable drag-to-reorder with a
server-side session-based upload flow:

- New endpoints: /partage/upload-tfe-file, /partage/remove-tfe-file
  (and /admin/ variants) — single-file incremental upload via HTMX
  multipart/form-data with progress bar support
- Session storage: uploaded files go to STORAGE_ROOT/uploads/{session_id}/
  with metadata in $_SESSION['tfe_uploads']
- file-upload-queue.js reduced to single-file previews only (couverture,
  note_intention, annexes thumbnails)
- ThesisFileHandler gains handleTfeFilesFromSession + writeTfeFileFromSrc
  + cleanupSessionUploads for final commit from session temp
- Sortable.min.js removed from all script tags; drag handles and ghost
  CSS removed
- No file_orders[]/file_labels[] hidden field injection needed
- Upload queue survives page refresh (server-owned list)

This eliminates the SortableJS dependency entirely while keeping the
same UX: pick files, see them in a queue, remove individual files.
This commit is contained in:
Pontoporeia
2026-05-10 16:19:46 +02:00
parent e06a317499
commit ca7707cd47
20 changed files with 606 additions and 255 deletions

View File

@@ -33,7 +33,7 @@ $adminMode = $adminMode ?? false;
include APP_ROOT . '/templates/partials/form/file-field.php';
?>
<!-- TFE files — multi-file, sortable, with per-file labels -->
<!-- TFE files — multi-file, with per-file labels -->
<div class="admin-form-group admin-files-fieldgroup">
<label>TFE (obligatoire) :</label>
<div class="admin-file-input">
@@ -46,9 +46,9 @@ $adminMode = $adminMode ?? false;
Les fichiers <code>.vtt</code> sont des sous-titres et seront associés automatiquement à la vidéo précédente.
</small>
<!-- Sortable file queue — populated by JS -->
<ul id="tfe-file-queue" class="tfe-file-queue sortable-list" aria-label="Fichiers sélectionnés (réordonnable)">
<!-- Items injected by file-upload-queue.js -->
<!-- File queue — populated by JS -->
<ul id="tfe-file-queue" class="tfe-file-queue" aria-label="Fichiers sélectionnés">
<!-- Queue rendered server-side via HTMX (upload-tfe-file) -->
</ul>
<p id="tfe-file-queue-empty" class="tfe-queue-empty">Aucun fichier sélectionné.</p>
</div>