Reputation: 53
** 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!
Upvotes: 5
Views: 3125
Reputation: 73
To autoplay a single file using the SM2 player, (not a playlist) include the following on page load:
sm2BarPlayers[0].actions.play();
Upvotes: 0
Reputation: 2964
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;
Upvotes: 0
Reputation: 664
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.com/data/audio/sm2/SonReal%20-%20LA%20%28Prod%20Chin%20Injetti%29.mp3", volume: 100, autoLoad: false, autoPlay: true, from: null…}
Upvotes: 2
Reputation: 31
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.
Upvotes: 0
Reputation: 2671
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()
).
Upvotes: 1