SPIP-Contrib

SPIP-Contrib

عربي | Deutsch | English | Español | français | italiano | Nederlands

286 Plugins, 197 contribs sur SPIP-Zone, 169 visiteurs en ce moment

Accueil > Affichage multimédia > Audio, vidéo > MP3player > minimalJSMP3player > Archives minimalJSMP3player > Le plugin minimalJSMP3player

Le plugin minimalJSMP3player

31 mai 2008 – par franckGre – commentaire

3 votes

Mise à jour du 26 octobre 2009 : fonctionne avec toutes les versions de SPIP supérieures à 1.9

I - Implantation du plugin


Désarchiver le fichier « minimalJSMP3player-spip-plugin.zip » dans le dossier plugins de votre installation SPIP.
L’activer via l’administration des plugins. (Consulter la documentation officielle pour plus de détails.)

Dans ce plugin, on utilise l’utilitaire javascript d’installation d’objet Flash swfobject 2.0, disponible à l’adresse suivante : http://code.google.com/p/swfobject/

En conséquence, il conviendra d’intégrer ce fichier dans la partie « head » des pages qui doivent utiliser le plugin :

<script type="text/javascript" src="#CHEMIN{javascript/swfobject.js}"></script>

par exemple, si la librairie swfobject est dans le répertoire « /javascript » de votre installation SPIP.

Le plugin utilise aussi la boîte à outils javascript jQuery (fonctionne à partir de la version 1.1). Celle ci fait partie intégrante de la distribution SPIP.

II - La balise #MINIMALJSMP3PLAYER


Lorsque le plugin est activé, on dispose de la balise #MINIMALJSMP3PLAYER qui liste tous les documents « mp3 » joints à l’article, les intègre à la liste des morceaux à jouer (la playlist), et insère dans la page un lecteur mp3 minimal.

Ainsi,

[(#MINIMALJSMP3PLAYER)]

implante dans la page un lecteur minimalJSMP3player avec comme interface l’image présente en logo de cet article.

De la même manière on dispose de la balise [(#MINIMALJSMP3PLAYER_RUB)] qui a la même syntaxe que la balise [(#MINIMALJSMP3PLAYER)], mais qui utilise la rubrique du contexte en cours et ajoute à la playlist tous les fichiers MP3 joints aux articles enfants de cette rubrique (on peut donc utiliser cette balise dans un article ou une rubrique).

Il est possible de transmettre des paramètres à ces balises, comme décrit en :
6) Surcharges supplémentaires du comportement

III - Les contrôleurs « par chanson »


Lorsque le plugin est activé, il active aussi la détection de contrôleurs « par chanson ».

Ceux ci permettent de jouer (mettre en pause) un des morceau de la playlist.
Par convention, tous les éléments HTML de la classe « psn »sont considérés comme des « contrôleurs par chanson » potentiels. La chanson qu’un contrôleur pilote est indiquée par l’attribut id de l’élément :

<a class="psn" id="psn1" href="#">Jouer morceau 1</a>

permet de lire/mettre en pause le morceau de rang 1 dans la playlist.
Ainsi, les éléments de la classe « psn » qui ont pour id « psn0 », « psn1 », ... , pilotent les morceaux de rang 0,1,..n.

Dans le texte d’un article, on peut insérer un contrôleur par chanson avec le modèle « psn »

<psn3|tag=a|text=Jouer morceau 3>

Dans un squelette on obtient le même résultat avec la balise « #MODELE{psn} »

[(#MODELE{psn}{id=3,tag=a}{text=Jouer morceau 3})]

Dans les deux cas d’utilisation du modèle, on insère :
le son de rang 3, dans une balise <a> avec comme texte « Jouer morceau 3 »

Les valeurs possibles pour le paramètre "tag" sont "a", "span", "div" et "img".

Remarque : un seul des paramètres id, tag et text est obligatoire. Les valeurs par défaut respectives sont alors "0", "a" et "écouter"..
Par exemple :

<psn0> et [(#MODELE{psn}{tag=a})]

insèrent le contrôleur suivant :

<a class="psn" id="psn0" href="#">écouter</a>


mais aussi :

<psn4> et [(#MODELE{psn}{id=4})]

insèrent le contrôleur suivant :

<a class="psn" id="psn4" href="#">écouter</a>

Dans le cas de l’utilisation de la balise <img>, l’attribut text doit contenir le "chemin/nom" de l’image à utiliser,qui est réputée se trouver dans le sous-dossier "images" du plugin.
Par exemple :

<psn2|tag=img|text=miniplay.gif>

insère le contrôleur suivant :

<img id="psn2" class="psn" src="plugins/minimalJSMP3player/images/miniplay.gif"/>



IV - Comportement par défaut


Le lecteur minimalJSMP3player ne démarre pas la lecture lorsque la page est chargée. L’utilisateur doit cliquer sur un élément « Play/Pause » pour démarrer.
Lorsque la lecture du dernier son de la liste est terminée, la tête de lecture est repositionnée sur le début du premier son et le lecteur s’arrête. Pour recommencer la lecture, l’utilisateur doit à nouveau cliquer sur un élément « Play/Pause ».
Si l’utilisateur clique sur le contrôle « Play/Pause » pendant la lecture, alors le son est mis en pause. La position dans le son est sauvegardée pour reprendre a cette position en cas de nouveau clic sur « Play/Pause ».
Si l’utilisateur clique sur le contrôle « Stop », la lecture est arrêtée et la tête de lecture est positionnée au début du son en cours.

V - Surcharge du comportement par un fichier de configuration


Dans le répertoire du plugin minimalJSMP3player, il existe un sous-répertoire « xml » dans lequel se situe un fichier nommé « jsmp3data.xml ». Ce fichier de configuration est lu et les valeurs qu’il défini viennent surcharger les valeurs par défaut de comportement.

Ce fichier de configuration est constitué comme suit :

<?xml version="1.0" encoding="UTF-8"?>

<JSMP3player autoStart="true" loop="false" >
        <sounds>
                <sound url="plugins/minimalJSMP3player/xml/bosco.mp3" />
        </sounds>
</JSMP3player>


Les attributs possibles sont :

-  Démarrage de la lecture
autoStart : <démarrer automatiquement la lecture ou non (valeurs "true" ou "false"); Valeur par défaut : false>

-  Lecture en boucle
loop : <redémarrer sur le premier morceau de la liste de diffusion lorsque le dernier se termine (valeurs "true" ou "false"); Valeur par défaut : false>

Pour ne pas modifier la valeur par défaut d’un des attributs, il suffit de l’omettre ou de régler sa valeur à "".

-  Liste des sons
<sound url="<chemin complet vers le son mp3>" />

On ajoute autant de ligne qu’il y a de sons par défaut à ajouter à la playlist.

VI - Surcharges supplémentaires du comportement


Comme on vient de le voir le lecteur minimalJSMP3player a un comportement par défaut qui peut être modifié par un fichier XML. Cela défini un comportement type que l’on choisi d’appliquer pour un contexte précis.

On peut aussi lors de l’implantation communiquer des variables au lecteur qui prennent le pas sur la configuration par défaut et la surcharge par le fichier XML si elle existe. On peut agir sur :

-  le démarrage automatique (ou non) de la lecture au chargement de la page avec la variable autoStart
-  le comportement lorsque le dernier son à été joué (recommencer au début ou arrêter) avec la variable loop

comme suit :

{autostart=  « valeur booléenne »} -> démarrage de la lecture dés la page affichée
{loop=  « valeur booléenne »} -> Lecture de la liste des morceaux en boucle

Ainsi,

[(#MINIMALJSMP3PLAYER)]

Le lecteur se comporte comme défini dans le fichier xml

[(#MINIMALJSMP3PLAYER{autostart=true})]

La lecture débute automatiquement

[(#MINIMALJSMP3PLAYER{loop=true})]

Le lecteur boucle sur le premier morceau de la liste

[(#MINIMALJSMP3PLAYER{autostart=true}{loop=true})]

La lecture débute automatiquement et boucle sur le premier morceau de la liste

[(#MINIMALJSMP3PLAYER{autostart=false}{loop=false})]

La lecture ne débute pas automatiquement et le lecteur ne boucle pas sur le premier morceau de la liste

VII - Modification de l’aspect du lecteur


Les éléments graphiques qui composent le lecteur ont pour caractéristiques :
fond : id="interfaceLecteur"
bouton Play/Pause : id="playPauseCtrl"
bouton Stop : id="stopCtrl"

Le positionnement de ces éléments est défini dans le fichier « minimalJSMP3player.css » situé dans le sous-répertoire « css » du plugin. On trouve aussi dans ce fichier la référence à l’image qui compose le fond du lecteur :

Les boutons Stop, Play et Pause utilisent les images nommées « images/stop.png », « images/play.png » et « images/pause.png » :



Des informations complémentaires sur le player minimalJSMP3Player sont disponibles sur http://lededansdubocal.net

 

 

Creative Commons License
Le plugin minimalJSMP3Player est mis à disposition selon les termes de la licence Creative Commons Paternité-Partage des Conditions Initiales à l’Identique 2.0 France.

Voir en ligne : Le dedans du bocal

Dernière modification de cette page le 26 octobre 2009

Retour en haut de la page

Vos commentaires

  • Le 5 novembre 2011 à 08:46, par CH En réponse à : Le plugin minimalJSMP3player

    Bonjour,
    Je suis en train de mettre en place un site de podcasts d’élèves de collège qui fonctionne sous spip 2.1.11 avec le plugin globenews. Les élèves et mes collègues souhaitent mettre sur la page d’accueil du site un son qui se lance et s’arrête automatiquement (court slogan sonore, il ne s’agit pas de diffuser du son en continu !). Complétement autodidacte en ce qui concerne spip, je cherche désespérément une solution depuis 3 semaines. J’ai consulté tout en tas de forums, essayé plusieurs solutions mais rien à faire, cette fois-ci je ne m’en sortirai pas seule. Ce plugin m’a semblé pouvoir convenir à mes besoins mais nouvel échec : où dois-je mettre les fichiers et les balises dont il est question dans cet article ? Quelqu’un peut-il me guider ?

    Répondre à ce message

Répondre à cet article

Qui êtes-vous ?
  • [Se connecter]

Pour afficher votre trombine avec votre message, enregistrez-la d’abord sur gravatar.com (gratuit et indolore) et n’oubliez pas d’indiquer votre adresse e-mail ici.

Ajoutez votre commentaire ici Les choses à faire avant de poser une question (Prolégomènes aux rapports de bugs. )
Ajouter un document

Retour en haut de la page

Ça discute par ici

  • Import ICS 2 (agenda distant)

    2 août – 35 commentaires

    La version 2 du plugin « import ICS » en reprend la principale fonctionnalité, à savoir l’ajout automatique d’évènements distants dans la liste des évènements d’un site. À la différence de la première version, elle ne dépend pas du plugin « Séminaire » et est (...)

  • Newsletters

    16 janvier 2013 – 374 commentaires

    Ce plugin permet de composer des Info-lettres. Par info-lettre, on désigne ici le contenu éditorial qui va être composé et envoyé par courriel à une liste d’inscrits. Le plugin permet de composer une info-lettre à partir d’un modèle pré-composé, (...)

  • CKeditor 3.0

    4 octobre 2009 – 1217 commentaires

    CKeditor est l’évolution de l’éditeur WYSIWYG : FCKeditor, avec ce plugin vous pourrez utiliser cet éditeur à la place de l’éditeur de spip tout en laissant le choix à vos auteurs de l’éditeur qu’ils préfèrent utiliser. Attention : cet éditeur WYSIWYG (...)

  • GIS 4

    11 août 2012 – 1284 commentaires

    Présentation et nouveautés La version 4 de GIS abandonne la libraire Mapstraction au profit de Leaflet. Cette librairie permet de s’affranchir des librairies propriétaires tout en gardant les mêmes fonctionnalités, elle propose même de nouvelles (...)

  • SPIPr

    23 mars 2015 – 75 commentaires

    SPIPr est à la fois une famille de squelettes et un framework pour le développement front avec SPIP. Prêt à l’emploi, thémable, responsive, et conçu dans une approche d’industrialisation et de développement rapide. Documentation source : (...)

Ça spipe par là