Playlist pour le dewplayer en php avec surcouche javascript

Photo de clb56 Article publié le lundi 20 août 2007 par clb56.
Cet article est classé dans les catégories « PHP »

Il s'agit d'une combinaison entre un script php et une surcouche javascript qui permettent de renseigner le lecteur mp3 [i][url=http://www.alsacreations.fr/mp3-dewplayer.html]"Dewplayer"[/url][/i] à partir d'une simple liste de liens html.<br /> <br /> Dans une seconde phase le même principe sera décliné pour 4 situations de listes générées automatiquement.<br /> <br /> [list]<br /> [*]Playlist simple<br /> [*]Playlist multi répertoires<br /> [*]Playlist simple avec commentaire (présentation) joint à chaque son<br /> [*]Playlist multi répertoires avec commentaire joint à chaque son<br /> [/list]<br /> <br /> <br /> <br /> Mais dans un premier temps voici le principe général du fonctionnement de la playlist.

Principe général de la playlist



Contrôle en php


Du point de vue html tout part d'une simple série de liens structurée par une liste <ul>.
Du point de vue php, chaque lien de la liste de sons va permettre de passer dans l'url l'adresse du son concerné et aura la forme :
<a href="?go_son=/musique/un_son.mp3">Un son</a>
Le code php suivant permet de récupérer l'adresse transmise dans une variable qui servira à renseigner le Dewplayer
<?php if (isset($_GET['go_son'])) { // Etape intermédiaire, on récupère dans la variable $pre_son l'adresse transmise. $pre_son=$_GET['go_son']; // La variable définitive $son permet d'ajouter la mention autoplay=1 $son=$pre_son."&amp;"."autoplay=1"; } else { // Si aucune adresse n'est transmise alors la variable $son a pour valeur une adresse par défaut et surtout pas d'autoplay ! ... Pour ficher la paix aux gens ;-) $pre_son="/musique/son1.mp3"; $son="/musique/son1.mp3"; } ?>
Voici maintenant le code html du Dewplayer avec les ajouts php permettant de le renseigner, on le complète par un lien direct vers le fichier mp3 concerné :
<object type="application/x-shockwave-flash" data="/dewplayer.swf?son=<?php echo $son; ?>" height="20" width="240"> <param name="movie" value="/dewplayer.swf?son=<?php echo $son; ?>" /> </object> <p>Fichier mp3 : <a href="<?php echo $pre_son; ?>"><?php echo $pre_son; ?></a>.</p>

En guise de 1ère synthèse je vous propose un exemple de code complet sur une liste de 4 sons :
<?php if (isset($_GET['go_son'])) { $pre_son=$_GET['go_son']; $son=$pre_son."&amp;"."autoplay=1"; } else { $pre_son="/musique/son1.mp3"; $son="/musique/son1.mp3"; } ?> <div id="content_dew_player"> <object type="application/x-shockwave-flash" data="/dewplayer.swf?son=<?php echo $son; ?>" height="20" width="240"> <param name="movie" value="/dewplayer.swf?son=<?php echo $son; ?>" /> </object> <p>Fichier mp3: <a href="<?php echo $pre_son; ?>"><?php echo $pre_son; ?></a>.</p> </div> <ul id="liste_sons"> <li><a href="?go_son=/musique/son_1.mp3">Son 1</a></li> <li><a href="?go_son=/musique/son_2.mp3">Son 2</a></li> <li><a href="?go_son=/musique/son_3.mp3">Son 3</a></li> <li><a href="?go_son=/musique/son_4.mp3">Son 4</a></li> </ul>


Contrôle en javascript


Le javascript réalise une surcouche qui permet d'économiser à chaque activation des liens un échange avec le serveur appelant une nouvelle page pour chaque son.
Voici le contenu commenté du fichier externe playlist_dewplayer.js :
function control_player() { // Test sur les méthodes if (!document.getElementById || !document.getElementsByTagName){ return false; } var referent=document.getElementById('liste_sons'); var liens_son=referent.getElementsByTagName('a'); for (i=0; i<liens_son.length; ++i) { liens_son[i].onclick=function() { /* Au clique sur le lien on récupère l'adresse absolue du son. Attention elle sera du type [url=http://...etc...]http://...etc...[/url] */ var adresse_son=this.href; // Puis on extrait la chaine de caractère commençant à la dernière occurence du caractère = var pre_son=adresse_son.substring(adresse_son.lastIndexOf("=")); /* Enfin on extrait du résultat une nouvelle chaine de caractère commençant à l'index 1 de la précédente. L'index 0 qui correspond au caractère = est donc exclu. La variable son est maintenant opérationnelle. */ var son=pre_son.substring(1); /* On re génère complètement le code html du Dewplayer grâce à la propriété innerHTML et on le renseigne avec la variable son */ document.getElementById('content_dew_player').innerHTML="<object type='application/x-shockwave-flash' data='/dewplayer.swf?son="+ son +"&autoplay=1' width='240' height='20'><param name='movie' value='/dewplayer.swf?son="+ son +"&autoplay=1' /></object><p>Fichier mp3 : <a href='"+ son +"'>"+ son +"</a>.</p>"; // On annihile le lien return false; } } } On lance la fonction "control_player()"une fois le chargement de la page effectif window.onload=control_player;

VOS COMMENTAIRES ...

Commenter cette publication

Photo de romaes Commentaire publié le samedi 13 octobre 2007 - 12h09 par romaes
salut

cela fait longtemps que je cherche en vain un systeme comme celui ci, je vais m'empresser de le tester sur mon site .....

plus de news lorsque je l'aurai fait fonctionner !!!!!
Photo de waboo Commentaire publié le jeudi 28 février 2008 - 16h17 par waboo
Bonjour,

J'aimerais intégrer le dewplayer, ainsi que vos fonctions php à l'aide du "swfobject". Comment devrais-je faire ?

Waboo
Photo de waboo Commentaire publié le mercredi 05 mars 2008 - 17h30 par waboo
Dans le code php avec le dewplayer, il y a une ligne de code afin de nommer le "Fichier mp3" en cours. Aulieu du chemin d'accès, j'aimerais que ce sois un nom plus convivial. C'est-à-dire. la Toune 1 aulieu de musique/toune1.mp3.

Est-ce possible d'avoir un peu plus de détail à sujet ?

Waboo
Photo de josimon Commentaire publié le lundi 27 octobre 2008 - 16h35 par josimon
Bonjour,
je suis très intéressé par votre appli html +javascript+PhP. Malheureusement , je dois rater une marche. J'ai bien créé un fichier plyalist_dewplayer.js dans lequel j'ai collé votre code.
Dans ma page html, consultable sur http://josimon2.free.fr/multiplayer3.html, j'ai fait une ébauche de playlist sur 4 morceau que j'ai uploadé sur le ftp, mais je n'arrive pas à faire la relation entre ces 3 éléments, semble-t-il (html, javascript et php). J'ai l'impression de ne pas écrit ce qu'il fallait où il fallait , et comme je débute, ... je bute.
Si vous pouviez prendre quelques minutes pour m'éclaircir, je suis sûr de ne pas être loin de la solution.
En tout cas chercher à "améliorer" le dewplayer est très louable et peut faciliter la tâche de beaucoup d'entre nous.
Merci de votre compréhension

Commenter cette publication

Vous devez obligatoirement vous identifier en tant que membre pour participer à cette discussion.

Forums de discussions associés

Discutez et échangez sur ce thème dans notre forum PHP - SQL.

ACCÉS COMMUNAUTÉ

Rejoignez ALL HTML

Publiez vos articles, actualités, communiqués ... Donnez votre avis, partagez votre réseau, rencontrez d'autres membres et participez à la vie de la communauté.