Lecture automatique et boucle de la vidéo lors de l'upload

Je souhaite que les utilisateurs puissent télécharger de courts fichiers vidéo à intégrer dans leurs publications, et je souhaite que le comportement par défaut du forum soit configurable pour que ces vidéos soient lues automatiquement en boucle et en sourdine par défaut. Afin que les vidéos puissent être utilisées comme remplacement des GIF, de la même manière que sur Discord (en fait, les vidéos proviennent principalement de Discord, qui utilise beaucoup de .mp4 en lieu et place de GIF, semble-t-il).

Ce sujet montre comment écrire du HTML pour qu’un fichier vidéo se lise automatiquement en boucle.

<video width="100%" height="100%" preload="metadata" controls="" autoplay>
      <source src="https://www.simscale.com/forum/uploads/default/original/3X/d/6/d6fab77fb56eeb98ef660d682f344dba4bbb66ce.mp4">
      <a href="https://www.simscale.com/forum/uploads/default/original/3X/d/6/d6fab77fb56eeb98ef660d682f344dba4bbb66ce.mp4">/forum/uploads/default/original/3X/d/6/d6fab77fb56eeb98ef660d682f344dba4bbb66ce.mp4</a>
</video>

Cela fonctionne, sauf que je n’arrive pas à comprendre comment l’utiliser lorsqu’un utilisateur écrit sa publication et télécharge son fichier vidéo. Notez que dans cet exemple, l’URL complète du fichier vidéo est utilisée. Ceci n’est pas disponible pour les utilisateurs lorsqu’ils téléchargent leur fichier, de plus, si les fichiers téléchargés par l’utilisateur sont déplacés sur le serveur ou vers un autre fournisseur S3 ou CDN, l’URL sera également brisée.

Lorsqu’un utilisateur télécharge son fichier, dans la boîte de réponse, il obtient du Markdown comme ceci :

![happy-birthday|video](upload://abcdefg123456789.mp4)

Il ne semble donc pas possible pour un utilisateur de convertir simplement cela en HTML nécessaire pour que sa vidéo se lise automatiquement en boucle (en sourdine). Existe-t-il une méthode pour cela ? Et mieux encore, existe-t-il un moyen de rendre cela le comportement par défaut sur l’ensemble du forum ? Ou du moins de laisser ce comportement activé par défaut, et de permettre à l’utilisateur de désactiver les paramètres de lecture automatique et de boucle lorsqu’il télécharge et publie.
(Si ce n’est pas possible actuellement, j’aimerais soumettre ceci comme une demande de fonctionnalité :))

Bonjour :waving_hand:

Je pense à deux façons dont cela sera possible.

La première est la plus simple, il suffit de créer un petit composant de thème qui utilise l’API de plugin api.decorateCookedElement pour trouver toutes les vidéos dans les publications et ajouter ces attributs. (autoplay, loop, etc.)

Cela modifiera le HTML de toutes les vidéos dans les publications sur l’ensemble du site. Dans l’éditeur, le code vidéo markdown que vous avez mentionné ci-dessus apparaîtra toujours.
![happy-birthday|video](upload://abcdefg123456789.mp4)

Avantages : affecte toutes les vidéos sur le site (donc les téléchargements précédents aussi)
Inconvénients : les utilisateurs ne peuvent pas le contrôler car cela se produit sur les publications publiées. Cela affecte toutes les vidéos, donc si vous avez un sujet avec beaucoup de vidéos et que celles-ci veulent démarrer en même temps, cela peut causer des problèmes.


La deuxième option demande un peu plus de travail. Il s’agit d’une modale où les utilisateurs peuvent contrôler quels attributs seront ajoutés à la vidéo téléchargée. Elle peut être déclenchée en ajoutant un bouton spécifique à l’éditeur ou en la déclenchant automatiquement lorsqu’elle détecte un téléchargement de vidéo.

Une fois terminée, elle insère le HTML de la vidéo dans l’éditeur, qui contient les attributs ajoutés.

<video width="100%" height="100%" preload="metadata" controls="" autoplay="">
    <source src="https://www.simscale.com/forum/uploads/default/original/3X/d/6/d6fab77fb56eeb98ef660d682f344dba4bbb66ce.mp4">
    <a href="https://www.simscale.com/forum/uploads/default/original/3X/d/6/d6fab77fb56eeb98ef660d682f344dba4bbb66ce.mp4">/forum/uploads/default/original/3X/d/6/d6fab77fb56eeb98ef660d682f344dba4bbb66ce.mp4</a>
</video>

Un excellent exemple pour cela est le composant de thème Insérer une vidéo.

Avantages : les utilisateurs peuvent contrôler les attributs de leurs vidéos et ils peuvent choisir de désactiver l’autoplay, etc., donc les sujets riches en vidéos seront également corrects.
Inconvénients : cela n’affectera pas les anciennes vidéos. Mais ce n’est pas un gros inconvénient car tout ce second processus concerne la manière dont les utilisateurs peuvent contrôler leurs vidéos.


En plus

La première méthode peut être combinée avec un réglage utilisateur ou un groupe. Avec cela, les utilisateurs peuvent configurer le comportement des vidéos.
Par exemple : Activer la lecture automatique des vidéos ou rejoindre un groupe qui activera la lecture automatique des vidéos, etc…


Modification : Je viens de penser que j’ai oublié le chargement différé, probablement que le premier processus ne fonctionne pas maintenant car le chargement différé ne charge la vidéo que si l’utilisateur clique sur le bouton de lecture de la miniature. Je ne l’ai pas encore essayé… :thinking:

2 « J'aime »

Oui, je pense que le mieux serait en fait de le rendre configurable par l’utilisateur, qu’il souhaite ou non le définir. Je me demande quelle serait la difficulté de le faire ? Serait-ce considéré comme un « composant de thème » ?