Music App with Playlist, Loop, Shuffle tracks

[domhnallohanlon]

Loop Through a Playlist

The first thing you’ll need for your music app is two variables.

1. The currentTrackNumber variable keeps track of which song is playing right now
2. The listOfTracks is your playlist where you’ll store your songs

---

The next thing you need is to make the Play button load up the first track

To help you imagine what’s going on here, you can think of it being like a juke box selecting a record. You’re queuing up something to play, but it’s not ready to play…yet!

---

This is the block that allows us to make the playlist app function.

Once the audio is ready to be played the on source loaded event fires.

The first thing we want to do is Play the track that we’ve selected:

---

These final blocks set up the looping playlist for us.

1. When the first song finishes playing we increase the currentTrackNumber by 1
2. We check if there are any tracks left on the playlist, and if not we loop back to the beginning
3. Finally a new source track is loaded, which in turn will trigger a new on source loaded event and the cycle will continue

[jared]

Great tutorial! Now we can play endlessly looping elevator music for our business aps and exciting music for the games!!!

Check my remix

jaredgibb.xyz

[kartik14]

Great tutorial, @domhnallohanlon!

Now I can enhance my workspace, by endlessly looping a downloaded relaxing track

Thanks!

[shawnpcooperxb]

This set up results in all sounds playing as soon as they are loaded and not waiting for the previous sound to finish. Any advice?

[tatiang]

Are you saying that when you click the button, all of the sounds play at once? Or that when you click the button when another sound is playing, the new sound plays over the current sound?

[afnanfozailcw81]

Hi, I was unable to access your website, it just asks me to buy the domain.

[jared]

Sorry! Here is my new website

Codeless Consultant