How to get the next element of an array in javascript?

Question

I am making my own music player in javascript and am working on the next song button. I have it set up to where the songs get added to the playlist and their corresponding ID number gets stored in an array. Then I index the array looking for the current ID of the song and then when the user hits next it goes to the next song in the array.

Here is my code:

    $(document).ready(function(){
    $("#player").prop("volume",".5");
});

    var xmlhttp=new XMLHttpRequest();
    xmlhttp.open("GET","playlist.xml",false);
    xmlhttp.send();
    xmlDoc=xmlhttp.responseXML;
    var songlist = new Array();
    var currentSong;

function song_play(song_id){
    var player = document.getElementById("player");
    player.setAttribute("src", "Music/"+song_id+".mp3");
    player.play();

    songlist.push(song_id);
    alert(JSON.stringify(songlist));
    currentSong = song_id;

            var new_id=song_id-1;
            $("#marquee").empty();
            $("#marquee").append("<span style='color:red;'>Now Playing: </span>"+xmlDoc.getElementsByTagName("artist")[new_id].childNodes[0].nodeValue+"-");
            $("#marquee").append(xmlDoc.getElementsByTagName("track")[new_id].childNodes[0].nodeValue);

};

function add_song(song_id,new_id){
    var artist = xmlDoc.getElementsByTagName("artist")[new_id].childNodes[0].nodeValue;
    var track = xmlDoc.getElementsByTagName("track")[new_id].childNodes[0].nodeValue;
    $("#song_list").append("<a id="+song_id+" href='javascript:void(0)' onclick='song_play(this.id);' class='song'>"+artist+"-"+track+"</a><br/>");
};

function nextSong(currentSong){
        var currentSongIndex = songlist.indexOf(currentSong);
        var newSong = songlist[currentSongIndex + 1];
        song_play(newSong);
};

The problem that I am experiencing is that once I hit the next button, it stops playing music all together.

Gabriel Sadaka · Accepted Answer · 2013-10-29 05:07:43Z

1

newSong is representing the song object, not the id of the song and your song_play method is actually using the song id. change nextSong function to:

function nextSong(currentSong){
    var currentSongIndex = songlist.indexOf(currentSong);
    song_play(currentSongIndex + 1);
};

answered Oct 29, 2013 at 5:07

Gabriel Sadaka

1,7461 gold badge15 silver badges19 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

meager-data Over a year ago

Thank you for your reply. I just tried this and the it replays the current song instead of going to the next song in the array.

meager-data Over a year ago

I should also add that the object in the arrays are also the id of the songs.

Gabriel Sadaka Over a year ago

ok now that you mention that what I said won't work, where are you adding all of the songs from the xml file to your array?

meager-data Over a year ago

In the song_play function where I add the song_id to the songlist using "songlist.push(song_id);". I am sorry for the crappy code, I am farely new to programming and just want to accomplish my task before I clean up my code.

Gabriel Sadaka Over a year ago

Ok well I would double check the song with an ID of the current song + 1 actually exists because the rest should work

Collectives™ on Stack Overflow

How to get the next element of an array in javascript?

1 Answer 1

5 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

5 Comments

Your Answer

Sign up or log in

Post as a guest

Related