Présentation
Le lecteur MediaElementJs est un lecteur HTML5 permettant de lire des sons et vidéos. Son originalité est qu’il part des capacités natives de chaque navigateur à lire des balises <audio>, <video> pour l’enrichir progressivement avec du flash et javascript.
Ce lecteur permet de résoudre d’une façon assez élégante les conflits entre les différents formats vidéos.
Le panneau des compatibilités est large : Internet explorer 8+, Firefox, Safari, iOS, Android .... Tableau de compatiblités
Le lecteur est aussi compatible avec un design responsive ou sur des navigateurs mobiles récents.
La syntaxe du plugin spip est rétro-compatible avec la syntaxe du plugin Lecteur multimédia.
Installation
Installer le plugin dans votre Spip de la façon habituelle.
L’auteur recommande d’ajouter des lignes dans votre .htaccess
AddType video/ogg .ogv
AddType video/mp4 .mp4
AddType video/webm .webmUtilisation : Son
- Ajouter vos fichiers en format mp3
- Insérer le lecteur via le raccourci
<audioXX>ou<docXX|player>
Paramètres facultatifs
| Nom | Description | Valeurs possibles |
|---|---|---|
| skin | habillage | ted, wmp |
| largeur | largeur du lecteur en pixels | |
| hauteur | hauteur du lecteur en pixels | |
| volume | largeur de lecteur en pixels | 0 à 1 (plein volume) |
| loop | jouer en boucle | oui, true |
| autoplay | lancer la lecture automatiquement | oui, true |
Exemple avec tous les paramètres
<audio5|skin=wmp|largeur=200|hauteur=30|volume=0.5|loop|autoplay>
Utilisation : Vidéo
- Ajouter vos fichiers en format mp4 (h264)
- Renseigner la hauteur et la largeur de la vidéo.
- Si vous ajoutez une vignette personnalisé à votre document vidéo, elle servira d’image de prévisualisation de la vidéo
- Insérer le lecteur via le raccourci
<videoXX>ou<docXX|player>
Paramètres facultatifs
| Nom | Description | Valeurs possibles |
|---|---|---|
| skin | habillage | ted, wmp |
| volume | largeur de lecteur en pixels | 0 à 1 (plein volume) |
Exemple avec tous les paramètres
<video5|skin=wmp|volume=0.6>
ps. Le lecteur mediaplayer propose aussi une autre solution avec des videos alternatives (option B) mais il n’est pas (encore) proposé dans le plugin Spip.
Habillages (skins)
Habillage par défaut
<audioXX>
<videoXX>
Habillage ted
<audioXX|skin=ted>, <videoXX|skin=ted>
Habillage wmp
<audioXX|skin=wmp>, <videoXX|skin=wmp>
API
Le lecteur est géré via javascript et dispose de nombreuses fonctions de lecture, callback en fin de lecteur de morceau, ...Documentation de l’API
A faire
- Mieux dans intégrer dans médiathèque
- Enrichir les modèles pour proposer plus d’options.
Le plugin est sur la zone. Libre à chacun de le modifier et l’améliorer.
Discussions par date d’activité
11 discussions
Bonjour
Comment se comporte se plugin au niveau des sous titres et des transcriptions textuelles afin de favoriser l’accessibilité des vidéos ?
Pour l’instant ce n’est pas pris en charge.
Le plugin javascript originel (option B) prévoit la gestion des sous-titres
<track kind="subtitles" src="subtitles.srt" srclang="en" ></track>Sinon il existe toujours le plugin video accessible qui remplit cette tache il me semble.
Répondre à ce message
Ajouter un commentaire
Avant de faire part d’un problème sur un plugin X, merci de lire ce qui suit :
Merci d’avance pour les personnes qui vous aideront !
Par ailleurs, n’oubliez pas que les contributeurs et contributrices ont une vie en dehors de SPIP.
Suivre les commentaires :
|
