Lecteur multimedia 2

C’est la nouvelle version du plugin Lecteur Multimédia.

Auteurs

BoOz et Kent1

voir la doc

Objectifs

Créer un plugin SPIP de gestion des sons et des videos skinnable et configurable et simple d’emploi.

Méthode et code source

Utilisation de la librairie javascript SoundManager v2 permettant de jouer divers formats et disposants d’une api de contrôle javascript / flash très intéressante.

Création d’un plugin JQuery qui affiche une lecteur multimedia utilisant l’API de SoundManager.

Exemple d’appel du plugin $.fn.playlist dans un squelette qui affiche des medias :

[(#REM)
        
        afficher une playliste

]
<script type="text/javascript">
        jQuery(document).ready(function(){
                jQuery('#playliste#ENV{id_playliste}').playlist({
                        smUrl : "#EVAL{_DIR_LIB_SM}swf/",
                        smnullUrl : "#CHEMIN{soundmanager/null.mp3}",
                        [(#ENV{autoPlay}|oui)autoPlay : true,]
                        [(#ENV{autoLoad}|oui)autoLoad : true,]
                        [(#ENV{logo}|oui)logo:'#ENV{logo}',]
                        [(#ENV{logo_top}|oui)logo_top:'#ENV{logo_top}',]
                        [(#ENV{logo_left}|oui)logo_left:'#ENV{logo_left}',]
                        [(#ENV{logo_repeat}|oui)logo_repeat:'#ENV{logo_repeat}',]
                        fullscreen : true
                });
        });
</script>
<div id="playliste#ENV{id_playliste}">
        Là ou doit apparaitre la playliste
</div>

Le plugin permet également de controler, sons et videos à l’aide des objets et méthodes, javascript de soundManager de la manière suivante :

var monSon = soundManager.createSound({
 id: 'monSon',
 url: '/audio/mysoundfile.mp3'
});

monSon.play(); // joue le son

également disponible :

stop()
pause()
resume()
togglePause()
mute()
setPosition(msecOffset:integer)
unmute()
setVolume(volume:integer)
setPan(pan:integer)
unload()
destruct()

L’insertion de tout cela est (sera) utilisable dans SPIP avec page de configuration, choix de thème ...

Le code source est disponible sur spip-zone : http://zone.spip.org/trac/spip-zone...

Installation

necessite la balise #INSERT_HEAD dans le head de votre site.

Utilisation

Des modèles utilisant ces possibilités sont déjà disponibles :

#MODELE{lecteur_multimedia} : afficher un lecteur multimedia proposant les derniers documents du site (par exemple sur la page d’accueil du site).

démo : http://www.patagium.net/

[(#MODELE{lecteur_multimedia}{id_article})] : afficher un lecteur multimedia proposant les documents de l’article.

démo : http://videos.spip.org/spip.php?art...

[(#MODELE{lecteur_multimedia}{id_article}{format=haudio})] : afficher une liste de lecture des mp3 joints à l’article au format haudio.

démo : http://www.patagium.net/spip.php?ar...

[(#MODELE{lecteur_multimedia}{format=haudio})] : afficher une liste de lecture des mp3 du site au format haudio.

exemple de stream en continu mp3 avec neolao maxi : http://www.groovalizacion.com/spip/spip.php?article33&lang=fr

updated on 23 August 2011

Discussion

2 discussions

  • Guillaume

    Bonjour,
    J’utilise le plugin (v 2.2.2)
    J’ai inséré une playlist dans un squelette avec [(#MODELEplayliste_neolao)]
    Je voudrais qu’elle démarre automatiquement.
    Comment faire ?
    Merci par avance.

    Reply to this message

  • peter bang

    Est-il possible de spécifier un autre emplacement pour ses MP3 que le IMG/mp3 ? mon hébergeur me donne accès à un emplacement spécial de streaming. Merci de votre aide.

    Reply to this message

Comment on this article

Who are you?
  • [Log in]

To show your avatar with your message, register it first on gravatar.com (free et painless) and don’t forget to indicate your Email addresse here.

Enter your comment here

This form accepts SPIP shortcuts {{bold}} {italic} -*list [text->url] <quote> <code> and HTML code <q> <del> <ins>. To create paragraphs, just leave empty lines.

Add a document

Follow the comments: RSS 2.0 | Atom