Player audio HTML5 lecture continue.

je te remercie beaucoup :)
j'aurais du préciser que mes connaissance en js sont plutôt médiocre :(
j'ai fait du C# je voit bien ce qu'il faut faire mais comment...

Alors bon je tâtonne sans trop de résultat, j'ai déjà ajouter ça (pas de moquerie svp) :

// event listeners
document.getElementById("player").addEventListener("ended", PlayNext);

Le truc c'est que pour ma fonction PlayNext, je sais pas trop comment récupérer la valeur de l'élément suivant pour le faire "manger" a ma fonction loadsong.
ou bien ou trouver celle l'élément existant et l'incrémenter...

Bref je vais continuer à chercher et à essayer de comprendre comment ça fonctionne ^^

Salut,
avec HTML5 pas mal de nouvelles fonctionnalités.
Pour la playlist il faut faire un tableau(array) avec les url des fichiers.
En comptant la position(-1 car le premier indice du tableau est 0) on passe au suivant.
Voilà j'espère c'est clair.

L'autre truc à faire est de placer le code en utilisant body onload=fonctionprincipale()
(ou bien avec la fonction document.ready() de jquery qui fait la même chose) car cela vérifie que le DOM est bien chargé(l'arbre des balises accessible par javascript) avant d'y accéder sinon ça posera des problèmes.

Petit recap des événements de audio et video(et méthodes):
http://www.w3schools.com/tags/ref_av_dom.asp

Un petit exemple d'un lecteur (video) customizé(en cours de dév.).
Je n'ai pas encore implémenté complètement la fonction pour boucler sur toute la playlist par contre alors prendre le code tel qu'il est ;)

https://jsbin.com/doriwoluku/edit?html,js,output

C'est un bon début !

Voici un exemple permettant de récupérer les musiques les unes après les autres :

<ul id="playlist">
<li><a href="fichier1.ogg" onclick="loadSong()" class="song">fichier1</a></li>
<li><a href="fichier2.ogg" onclick="loadSong()" class="song">fichier2</a></li>
<li><a href="fichier3.ogg" onclick="loadSong()" class="song">fichier3</a></li>
</ul>

var currentIdSong = 0; // numéro de la musique en cours (commence à 0)
var songs = document.querySelectorAll('.song'); // liste des musiques (balises a)
var songsLength = songs.length; // nombre de musiques
var currentSong = songs[0].getAttribute('href'); // nom du fichier de la musique en cours

function nextSong() {
    currentIdSong = (currentIdSong + 1) % songsLength;
    currentSong = songs[currentIdSong].getAttribute('href');
    return currentSong;
}

// test
console.log(currentSong); // fichier1.ogg
nextSong();
console.log(currentSong); // fichier2.ogg
nextSong();
console.log(currentSong); // fichier3.ogg
nextSong();
console.log(currentSong); // fichier1.ogg
nextSong();
console.log(currentSong); // fichier2.ogg
nextSong();
console.log(currentSong); // fichier3.ogg

J'ai ajouté une classe "song" afin de sélectionner plus facilement les liens.
On commence par initialiser plusieurs variables (voir commentaires), puis dans la fonction nextSong(), on utilise l'opérateur modulo pour boucler sur le nombre de musique et renvoyer la musique suivante.