** EDITED **

See Jon Black's answer below as the correct solution...

I am trying to use SoundManager2 HTML5 Audio Player on a website for a client, however the client is insisting that the .mp3 playlist auto-play starting with track 1 and cycling through the rest of the tracks.

The original script (soundmanager2.js on the site) has an autoPlay: false option, but changing this to true does nothing.

Here is a link to a demo website I've created making use of SoundManager2's bar-ui (which is the style the client wants to use) and a script to autoplay an .mp3 track in the background: website with working demo

As you can see (and hear), the background audio auto-plays nicely, but NOT through the sound bar, as expected. If you click Play or click on a playlist item in the track menu, the newly clicked audio simply plays OVER the background audio, which is not desired. I need the playlist audi to autoplay with the ability to play, pause and select different tracks through the sound bar itself.

Here is the link to original SoundManager2 project website for further info.

I am hoping someone can tell me how to create a function or provide a script that will allow the playlist to play THROUGH the audio player UI automatically on page load.

I have done a TON of searching and have tried writing and piecing together scripts, but just cannot seem to get this working! So, I turn to the GENIUSES on SO.

Thank you in advance for any help!

** EDITED **

See Jon Black's answer below as the correct solution...

I am trying to use SoundManager2 HTML5 Audio Player on a website for a client, however the client is insisting that the .mp3 playlist auto-play starting with track 1 and cycling through the rest of the tracks.

The original script (soundmanager2.js on the site) has an autoPlay: false option, but changing this to true does nothing.

Here is a link to a demo website I've created making use of SoundManager2's bar-ui (which is the style the client wants to use) and a script to autoplay an .mp3 track in the background: website with working demo

As you can see (and hear), the background audio auto-plays nicely, but NOT through the sound bar, as expected. If you click Play or click on a playlist item in the track menu, the newly clicked audio simply plays OVER the background audio, which is not desired. I need the playlist audi to autoplay with the ability to play, pause and select different tracks through the sound bar itself.

Here is the link to original SoundManager2 project website for further info.

I am hoping someone can tell me how to create a function or provide a script that will allow the playlist to play THROUGH the audio player UI automatically on page load.

I have done a TON of searching and have tried writing and piecing together scripts, but just cannot seem to get this working! So, I turn to the GENIUSES on SO.

Thank you in advance for any help!

• javascript
• jquery
• soundmanager2

• Try adding 'autoPlay: true,' to line 794 of bar-ui.js. – jmiraglia Commented Feb 11, 2015 at 1:31
• @PatrickGunderson - Apologies, but the entire code IS the problem... I cannot seem to get autoPlay:true to play nicely and work. I have tried setting the function(s) provided in the documentation, and adding autoPlay:true in numerous places, but to no avail. – 4NCHØR Commented Feb 12, 2015 at 3:04
• @jmiraglia tried adding 'autoPlay: true,' to line 794 of bar-ui.js, still no-go... thanks for the suggestion, though. I really appreciate the assistance guys – 4NCHØR Commented Feb 12, 2015 at 3:05

5 Answers 5

The solution above is not working for me. It changes the button state but the file doesn't play. I get this underlined error in chrome console

sound0: play(): Loading - attempting to play...
bar-ui.js:125 Uncaught TypeError: Cannot read property 'on' of undefined

And here it shows autoPlay is true.

Object {url: "http://freshly-ground./data/audio/sm2/SonReal%20-%20LA%20%28Prod%20Chin%20Injetti%29.mp3", volume: 100, autoLoad: false, autoPlay: true, from: null…}

I have figured out a quick and easy way to take care of your dilemma. You just have to add this simple code after the init() call on or around line 1378 of bar-ui.js.

    soundObject = makeSound(playlistController.getURL());
    soundObject.togglePause();

After init() sets the player up, you just need to queue up the first sound on the playlist(with makeSound(playlistController.getURL()) and then play(with togglePause()).

To be clear about Jon's solution: add the two lines he mentions to bar-ui.js and insert in your soundManager.setup

onready: function() {
makeSound(playlistController.getURL());
togglePause();
}

Hope this helps.

I had the same error of Oj Obasi when I tried the solution of Jon Black, so instead of adding those two lines immediately after the init() call I added them after the declaration of exports and it worked well. Here is the edit I made:

init(); // the init call

    exports = {
      // Per-instance events: window.sm2BarPlayers[0].on = { ... } etc. See global players.on example above for reference.
      on: null,
      actions: actions,
      dom: dom,
      playlistController: playlistController
    };
    soundObject = makeSound(playlistController.getURL()); // these two lines make it autoplays the playlist from beginning
    soundObject.togglePause(); // these two lines make it autoplays the playlist from beginning
    return exports;

To autoplay a single file using the SM2 player, (not a playlist) include the following on page load:

sm2BarPlayers[0].actions.play();