Phase 7 : personnage animé par sprites (poses/images successives)

Ajoute une nouvelle action de flow "jouer_animation_sprite" qui joue une
séquence de PNG sur un élément image (cycle en boucle type marche, ou
une fois type saut) — réutilise target_element_id (déjà whitelisté) et
data_value en JSON {frames, fps, loop}, exactement le patron déjà établi
par "jouer_son" (Phase 6) et "alea" (Phase 2) : aucune nouvelle colonne,
aucune migration de schéma.

Ajoute une propriété d'élément "orientation" (Modifier un élément) pour
retourner un personnage en miroir (gauche/droite/bascule) sans nécessiter
une 2e feuille de sprites "vue de dos" — même patron que "surbrillance"/
"désactivé".

Étend aussi la Timeline d'animation existante (kind="sprite", aux côtés
de "animate_css"/"custom") pour qu'un personnage puisse animer tout seul
dès l'affichage de l'écran (ex. idle en boucle perpétuelle), pas
seulement en réaction à un événement — réutilise la colonne générique
custom_keyframes (JSON) et le réglage iteration_count déjà là pour la
boucle, aucune migration non plus. Les deux entrées (action de flow et
clip de timeline) partagent le même moteur côté client
(runSpriteAnimation()/activeSpriteAnimations dans static/js/play/
actions.js, indexé par nœud DOM plutôt que par id d'élément pour
supporter plusieurs instances d'un même écran-modèle animées
indépendamment).

Une bibliothèque de sprites Forge (2 personnages Kenney CC0, sous-
ensemble curé idle/marche/saut copié dans static/characters/) est
proposée dans l'éditeur, mais un créateur peut tout aussi bien utiliser
ses propres sprites uploadés (même route d'upload générique que le son
de la Phase 6).

Périmètre volontairement limité à ce qui a été demandé : pas d'avatar
modulable en couches (assemblage cheveux/haut/bas par le joueur),
écarté du plan initial à la demande de l'utilisateur.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>

static/js/screen_edit/panel-init.js

@@ -70,6 +70,55 @@ function initBuilderPanel() {
     });
   });
 
+  // Phase 7 — sprites propres au créateur : contrairement aux autres
+  // champs d'upload (qui REMPLACENT la valeur d'un champ texte unique),
+  // chaque fichier envoyé ici AJOUTE une ligne à la zone de frames — un
+  // personnage animé a besoin de plusieurs images, pas d'une seule.
+  var spriteUploadInput = document.getElementById('nf-action-sprite-upload');
+  if (spriteUploadInput) {
+    spriteUploadInput.addEventListener('change', function () {
+      if (!spriteUploadInput.files.length) return;
+      var status = document.getElementById('nf-action-sprite-upload-status');
+      var framesField = document.getElementById('nf-action-sprite-frames');
+      status.textContent = 'Envoi en cours...';
+      var data = new FormData();
+      data.append('file', spriteUploadInput.files[0]);
+      fetch("/game/" + GAME_SLUG + "/upload", { method: 'POST', body: data })
+        .then(function (r) { return r.json(); })
+        .then(function (json) {
+          if (json.url) {
+            framesField.value = framesField.value ? (framesField.value + '\n' + json.url) : json.url;
+            status.textContent = 'Fichier envoyé ✓';
+          } else { status.textContent = "Échec de l'envoi."; }
+        })
+        .catch(function () { status.textContent = "Échec de l'envoi."; });
+    });
+  }
+
+  // Phase 7 — même mécanisme d'upload que nf-action-sprite-upload
+  // ci-dessus (ajoute une ligne plutôt que de remplacer), pour le
+  // formulaire de clip de la Timeline d'animation.
+  var animClipSpriteUploadInput = document.getElementById('anim-clip-sprite-upload');
+  if (animClipSpriteUploadInput) {
+    animClipSpriteUploadInput.addEventListener('change', function () {
+      if (!animClipSpriteUploadInput.files.length) return;
+      var status = document.getElementById('anim-clip-sprite-upload-status');
+      var framesField = document.getElementById('anim-clip-sprite-frames');
+      status.textContent = 'Envoi en cours...';
+      var data = new FormData();
+      data.append('file', animClipSpriteUploadInput.files[0]);
+      fetch("/game/" + GAME_SLUG + "/upload", { method: 'POST', body: data })
+        .then(function (r) { return r.json(); })
+        .then(function (json) {
+          if (json.url) {
+            framesField.value = framesField.value ? (framesField.value + '\n' + json.url) : json.url;
+            status.textContent = 'Fichier envoyé ✓';
+          } else { status.textContent = "Échec de l'envoi."; }
+        })
+        .catch(function () { status.textContent = "Échec de l'envoi."; });
+    });
+  }
+
   bindPropsAutosave();
   bindJaugeDefinitionSelect();
   bindDefinitionFieldSelects('field-definition_id', ['field-filtre_champ', 'field-filtre2_champ']);