lundi 29 juin 2009
Flash (and Javascript) MP3 player
Développement :: lundi 29 juin 2009 à 01:46
J'avais repris il y a quelques temps le Flash MP3 player de neolao dans sa version JS pour l'intégration à Nanokubbe (que j'utilise notamment sur cette page de mon nanokubbe par exemple), ainsi qu'à divers autres projets. C'est un petit player de MP3, sans interface, en flash qui est contrôlable en javascript. Ainsi Flash ne s'occupe que de lire le MP3, ça devient une sorte de backend multimédia.
J'avais déjà utilisé SoundManager 2 pour Altermusique.org mais j'avais rencontré un problème assez chiant pour moi en tout cas c'est que ça ne pouvait pas marcher avec FlashBlock. Le player de neolao n'avait pas ce bug et n'obligeait pas à passer par un javascript associé, c'était très simple et permettait donc des choses plus propres.
Seulement pour moi il manquait quelques trucs, genre un événement déclencé à la fin de la lecture d'un mp3. Et puis le code était pas très clair, j'avais du mal à le comprendre. Et l'autre jour au boulot alors qu'on préparait l'intégration de ce player dans un projet plus gros, on est tombé sur un bug marrant de flash, c'est que si on essaye de lire un mp3 alors que la machine cliente n'a pas de carte son configurée, flash plante (et entraîne le navigateur). Bon, de nos jours la plupart des gens ont une carte son configurée, mais quand même, c'est assez chiant.
Du coup je me suis retroussé les manches et j'ai finit ma réécriture du player de neolao. Le résultat, qui s'appelle tout bêtement "Flash MP3 player", comme l'original, est à 90% compatible avec les implémentations précédentes du player. C'est à dire que la communication avec le JS reste globalement identique, hormis quelques détails, que je vais détailler plus bas.
Quelques exemples déjà :
- Test simple avec debug
- Player générique utilisé dans nanoKubbe (accessible, si le flash marche pas, les liens sont de simples MP3, et l'interface de lecture n'apparaît pas)
- Player nanoKubbe personnalisé en CSS
Les avantages
Mon player n'occupe que 2,1 Ko, est open source, scriptable en JS, sans interface en flash, permet le debug de la communication entre le flash et le JS, fonctionne avec FlashBlock et sur tous les brouteurs (à ma connaissance), ne plante pas Flash si vous n'avez pas de carte son, et est très simple à interfacer en JS (regardez le code du test simple). Et, cerise sur le gâteau, il est léger et consomme entre 10 à 90% moins de ressources que les autres players. Je vous laisse décider face aux autres ténors (Dewplayer, propriétaire, interface en flash, plante sans carte son; ou SoundManager 2, libre, mais fait 27Ko en comptant le Flash + la lib JS minifiée, et ne supporte pas Flashblock).
Fonctionnalités
- Lecture de MP3 en streaming
- Interface JS simple à utiliser
- Détection du fonctionnement de la chaîne son de flash à l'aide d'un tout petit MP3 de test (inclus dans le flash), permet d'éviter le plantage de Flash si le client n'a pas de carte son
- Lecture et transmission des tags ID3 reçus par flash
- Méthodes : play, pause, stop, setVolume, setPosition, setUrl
- Debug des événements flash, transmis à JS via un callback
- Lancement d'un callback à la fin de la lecture d'un MP3
- Polling intelligent, rien ne s'exécute quand le player est en pause ou arrêté
Téléchargement
J'ai pas encore fait de doc, ça arrivera peut-être dans les prochains jours si j'ai un peu de temps, mais en regardant le code du test simple ça devrait être assez clair à mon avis. En attendant, si vous avez des questions, n'hésitez pas.
