给定一个url数组,对应多个音频文件,例如:
var playlistUrls = [
"./audio/cmn-ni3.mp3",
"./audio/cmn-hao3.mp3",
"./audio/cmn-lao3.mp3",
"./audio/cmn-mao3.mp3"
];
如何以与提供的url数组相同的顺序播放这些文件[一个在另一个的末尾]?
我倾向于在howler.js的范围内这样做,因为它提供了各种HTML5的回退。
下面的代码可以工作,是可伸缩的,并且可能是实现上面引用的功能(jsfiddle)的良好开端:
var playlist = function(e) {
// initialisation:
pCount = 0;
playlistUrls = [
"https://upload.wikimedia.org/wikipedia/commons/8/8a/Zh-Beijing.ogg",
"https://upload.wikimedia.org/wikipedia/commons/8/8a/Zh-Beijing.ogg",
"./audio/a.mp3",
"./audio/b.mp3",
"./audio/c.mp3",
"./audio/d.mp3"
], // audio list
howlerBank = [],
loop = true;
// playing i+1 audio (= chaining audio files)
var onEnd = function(e) {
if (loop === true ) { pCount = (pCount + 1 !== howlerBank.length)? pCount + 1 : 0; }
else { pCount = pCount + 1; }
howlerBank[pCount].play();
};
// build up howlerBank:
playlistUrls.forEach(function(current, i) {
howlerBank.push(new Howl({ urls: [playlistUrls[i]], onend: onEnd, buffer: true }))
});
// initiate the whole :
howlerBank[0].play();
}
此外,我还在Github上请求将此功能添加到Howler.js中。
如果你做了一个jsfiddle,请分享你的变化