Execute next audio in javascript

0

I'm having a question about how to list the next audio using javascript, ie finalizing one song will already be listed the next. I currently have the following code:

function loadPlayer() {
    var audioPlayer = new Audio();
    audioPlayer.controls="controls";
    audioPlayer.addEventListener('ended',nextSong,false);
    audioPlayer.addEventListener('error',errorFallback,true);
    document.getElementById("player").appendChild(audioPlayer);
    nextSong();
}
function nextSong() {
    if(urls[next]!=undefined) {
        var audioPlayer = document.getElementsByTagName('audio')[0];
        if(audioPlayer!=undefined) {
            audioPlayer.src=urls[next];
            audioPlayer.load();
            audioPlayer.play();
            next++;
        } else {
            loadPlayer();
        }
    } else {
        alert('the end!');
    }
}
function errorFallback() {
        nextSong();
}
function playPause() {
    var audioPlayer = document.getElementsByTagName('audio')[0];
    if(audioPlayer!=undefined) {
        if (audioPlayer.paused) {
            audioPlayer.play();
        } else {
            audioPlayer.pause();
        }
    } else {
        loadPlayer();
    }
}
function pickSong(num) {
    next = num;
    nextSong();
}

var urls = new Array();
    urls[0] = 'audio.mp3';
    urls[1] = 'audio.mp3';
    urls[2] = 'audio.mp3';
    urls[3] = 'audio.mp3';
    urls[4] = 'audio.mp3';
    urls[5] = 'audio.mp3';   
    urls[6] = 'audio.mp3';       
var next = 0;
    
asked by anonymous 15.05.2014 / 15:23

1 answer

3

Look, I've cleaned up your code, and now it works fine: link

The main problem was the unnecessary redefinition of the variable audioPlayer ( var audioPlayer = ... ) in several different places, in a confusing way.

JavaScript looks like this:

var audioPlayer = document.getElementsByTagName('audio')[0];

var current = 0;

var urls = new Array();

urls[0] = 'audio.mp3';
urls[1] = 'audio.mp3';
urls[2] = 'audio.mp3';
urls[3] = 'audio.mp3';
urls[4] = 'audio.mp3';
urls[5] = 'audio.mp3';
urls[6] = 'audio.mp3';

function playSong() {
  audioPlayer.src = urls[current];
  audioPlayer.load();
  audioPlayer.play();
}

function pickSong(num) {
  current = num;
  playSong();
}

function nextSong() {
  current++;
  if (current >= urls.length) {
    current = 0;
  }
  playSong();
}

audioPlayer.addEventListener('ended', nextSong, false);
audioPlayer.addEventListener('error', nextSong, true);
    
15.05.2014 / 20:14