Cette action a été écrite pour répondre à une demande de Ignace72 sur le forum de UP.
Elle utilise HTML5 pour afficher les vidéos mp4, webm et ogv trouvées dans le dossier.
Si une image de même nom existe, elle sera utilisée comme preview.
Si le nom du fichier n'est pas indiqué ou contient des jokers, toutes les vidéos correspondantes seront retournées
pour utiliser toutes les vidéos de ce nom dans le dossier.
Si le nom du fichier n'est pas indiqué ou contient des jokers,
toutes les vidéos correspondantes seront retournées
Supporte les formats video : mp4,webm,ogg
Si une image (jpg,png,webp,gif) existe, elle sera utilisé comme preview (poster)
syntaxe
{up media-video=chemin_vers_videos}- media_video: chemin et nom du fichier vidéo. caractères joker autorisés
configuration du lecteur vidéo
- autoplay: lancement automatique de la 1ere video
- muted: coupe le son
- loop: joue la vidéo en boucle
- controls = 1: affiche les boutons de commande
- preload = auto: none, metadata, auto.
- legend: texte affiché au dessous des vidéo ou 1 pour le nom humanisé de chaque vidéo
- legend-style: classe(s) et style pour la légende
Types des vidéos acceptées
- types = mp4:mp4;webm:webm;ogv:ogg: liste extension fichier et type mime
- codecs: liste type et codec supportés. ex: ogg:theora,vorbis; webm:vp8.0,vorbis
Messages si erreur
- no-video = lang[en=no video;fr=aucune vidéo]: message si video non trouvée
- no-support = lang[en=Your web browser does not support HTML5 video;fr=Votre navigateur Web ne prend pas en charge la vidéo HTML5: message si video non supportée
styles
- id:
- class: classe(s) pour bloc
- style: style inline pour bloc
- css-head (base-css): style ajouté dans le HEAD de la page
Un exemple simple
Il suffit d'indiquer le chemin et le nom d'un fichier vidéo hébergé localement sur le serveur.
Il n'est pas utile d'indiquer l'extension dans le nom du fichier, par défaut tous les types mp4, webm et ogv sont pris en compte comme vidéos et les types jpg, png, gif, webp comme image de prévisualisation.
{up media-video=images/video/matrix}Une galerie de vidéos
Si l'argument de media-video est le chemin d'un dossier, toutes les vidéos seront affichées.
{up flexauto=2}
{up media-video=images/video/m*
| legend}
{/up flexauto}L'exemple ci-dessus affiche toutes les vidéos dont le nom débute par la lettre m.
L'option legend sans argument affiche le nom 'humanisé' du fichier comme légende.
L'action flexauto permet de mettre les vidéos sur une grille responsive.
Des options
Vous pouvez gérer l'exécution des vidéos avec des options qui ont la même fonctions que les attributs HTML5 de même nom :
- autoplay lance automatiquement la première vidéo
- muted coupe le son
- loop joue la vidéo en boucle
- controls pour afficher les boutons de commande
- preload pour précharger les vidéos. Les valeurs admises sont : none, metadata ou auto
La légende sous les vidéos est gérées par 2 options :
- legend sans argument utilise une forme humanisée du nom de fichier. Il est possible de spécifier le texte à utiliser
- legend-style pour définir le style CSS
La gestion des vidéos acceptées est effectuée en utilisant deux options :
- types qui contient la liste des extensions de fichier avec le type mime correspondant. Par défaut: mp4:mp4;webm:webm;ogv:ogg
- codecs est la liste des codec supportés par type mime. ex: ogg:theora,vorbis; webm:vp8.0,vorbis
En cas d'erreurs, deux options définissent les messages affichées :
- no-video si aucune vidéo n'est trouvée dans le dossier
- no-support si le type de la vidéo n'est pas supporté par le navigateur client
La mise en forme dépend des quatre options : id, class, style et css-head
upactionslist (1) tabslide (1) toc (1) flexauto (3) media-video (2) div (1) jcontent-info (1)