Lecteur audio html5 avec balise audio

Bonjour à tous,
Objet: je suis en train de réaliser le site internet d'une webradio, qui s'appelle meltin'pot.


Introduction
J'ai déjà bien avancer et j'ai même réussi à faire un lecteur audio multi-piste en html5 et javascript.

Je n'ai pas utilisé les librairies javascript audio existante (html5media) car elle sont difficilement personnalisable. Et je voulais faire un lecteur audio, avec quelques lignes en JavaScript et des css. Donc après deux semaines de recherche sur le web (et d'essai erreur), je n'ai trouvé ici et là que des brides de solutions.

Comme j'ai réussi à en faire la synthèse, je vous présente mes travaux en cours pour que ça serve à d'autres. Mais aussi pour vous demander de l'aide au fur et à mesure afin d'améliorer le système ensemble.

Voici une photo du lecteur: http://meltinpot.fr/lecteur.png

L'ÉTAT ACTUEL

Pour le moment, seul la liste de lecture de gauche fonctionne, il suffit de cliquer sur un lien, pour que le fichier soit jouer.

J'ai un soucis avec li et ul, en effet, l'envoi des infos au player se fait via ces balises, mais comme la deuxième listes est dans un autre div, ça ne marche pas pour la liste de droite.

Pour voir la version alpha de la page d'accueil du site (qui sera ensuite réalisé avec SPIP)

Aller à cette adresse: http://meltinpot.fr/meltinpot/

Si vous êtes intéressez, je peux mettre en ligne les fichiers.

Merci d'avance Jérôme
Modifié par jeromeenligne (05 Apr 2011 - 18:58)

Bonjour Florent,

voilà, j'ai bien avancé !

http://meltinpot.fr/meltinpot/

J'ai maintenant mes deux colonnes qui fonctionnent et lancent la lecture des fichiers Ogg !

Pour mon lecteur multimédia, il me faudra une barre de progression ainsi qu'un sélecteur de niveau (pour le son)

Il faut que je cherche ça sur internet.

Sinon, j'avais regardé du coté de soundmanager2, mais l'intérêt de ma méthode, c'est que je sais exactement ce que je fais. Et d'autres part, je n'intègre pas des tonnes de javascript qui ne servirons à rien pour mon site.

Et puis, vu le code "simple" utilisé, je trouve que c'est ce compliqué la tête que d'utiliser ses librairie.

Pour partager mon travail est-ce mieux de mettre le fichier css, le javascript, et le html
en ligne avec un lien, ou en intégrale dans ce forum ?

Prochaine étape, trouver un moyen pour que le lecteur multimédia, reste sur chaque page pour que l'internaute puisse naviguer sur le site en écoutant la musique.

J'ai trouvé un fichier jquery (ajaxify http://max.jsrhost.com/ajaxify/ )qui permet de faire pas mal de chose, mais il faut que je trouve comme je vais ou pas l'utiliser avec mon site internet.

Bonne journée !
Modifié par jeromeenligne (06 Apr 2011 - 15:57)

Bonjour,

Pour le lecteur multimédia, j'ai choisis une quatrième option.

Je vais sauvegarder le titre jouer ainsi que la position, et relancer la lecture sur la nouvelle page.

Je passe les valeurs via l'adresse url, et j'ai trouvé le script pour récupérer la valeur.

param1= position
param2= si le lecteur était sur lecture
param3= adresse du fichier son jouer

Lors de la première lecture de la page, je cherche à charger la donnée "src" de la balise <audio> avec la valeur de "param3". Mais pour le moment tout mes essais son infructueux.

Pour les tests, c'est toujours au même endroit, la page d'essai du futur site: http://meltinpot.fr/meltinpot/

Comment ça marche pour le moment:
Lorsque l'on clique sur un fichier de la liste, et que l'on clique ensuite sur "Cliquez ici", un fichier javascript recharger la page avec dans url les données transmises.

Ensuite les données s'affichent là ou il était écrit "undefined"

Les fichiers javascript est ici: http://meltinpot.fr/meltinpot/js/song.js

est-ce que quelqu'un peut m'aider ?

merci d'avance

Jérôme
Modifié par jeromeenligne (08 Apr 2011 - 18:58)

Bonsoir,

j'avance sur mon travail, maintenant j'arrive à récupérer le nom du dernier titre utilisé et j'arrive à relancer la lecture sur ce titre.

Il ne me reste plus qu'à pouvoir charger la position dans le lecteur.

A partir du javascript, pour le moment ça ne marche pas. Par contre j'ai changé l'action du bouton arrière et lui il charger bien la valeur.

http://meltinpot.fr/meltinpot/

Je part en formation deux semaines, donc il n'y aura pas de nouvelles d'ici là.

Merci pour vos messages à venir.

Bonne soirée

Jérôme
Modifié par jeromeenligne (08 Apr 2011 - 19:00)

Bonjour,

de retour de stage et pas de nouveau message, est-ce que mon message est dans le bon forum ? Et si non, est-il possible de le changer de forum ?

merci d'avance

Jérôme

Bonjour Jérôme je voie que plus personne ne veux t’aidé .
Je vais t’aide avec le peux de connaissance que je possèdent
Va trifouiller dans le cod source de se lecteur il possèdent un bar de chargements,un bouton son,etc...

ravie de te rendre service bonne journée bye !

Oups jais oubliée le lien :http://zero-dubstep.blogspot.com/

Taadaaaam !

Bonsoir zewoble

et merci pour ton lien, j'ai regardé le code source et il me semble intéressant !

De mon coté, j'ai pas mal avancé, désormais j'ai un lecteur html5 qui fonctionne, avec un failback en Flash.

Et bien sur le lecteur flash lit le format Ogg !!! J'ai commencé l'intégration avec SPIP.

La prochaine étape, c'est de travailler sur la sauvegarde des chansons en cours lorsque l'on change de page. ça marche mais il faut que j'optimise ça.

Et pour terminer il faudra que je rende le tout compatible avec le lecteur flash.

Donc je suis heureux et en bonne voie.

Pour voir les travaux en cours, c'est ici http://meltinpot.fr/

Je suis disponible pour toutes questions


Jérôme
Modifié par jeromeenligne (22 Jun 2011 - 22:14)