我正在尝试使用soundmanager2、soundcloud 流和waveform.js ( http://waveformjs.org/ )构建音频播放器。播放器本身正在工作,但试图让波形.js 的回调与我自己的回调一起运行(更新时间等)被证明更加困难。
Waveform.js 提供了一个方法,该方法返回一个对象,该对象包含 soundmanager2 的 whileplaying 和 whileloading 对象的回调。我可以将其合并,但这显然会删除我自己的回调。
我试过直接调用waveform.js回调函数,
whileplaying: function(){
waveformObj.optionsForSyncedStream().whileplaying;
updateTime();
}
但这会产生错误
canvas:尝试将 strokeStyle 或 fillStyle 设置为既不是字符串、CanvasGradient 也不是 CanvasPattern 的值被忽略。this.context.fillStyle = this.innerColor;
在waveform.js的方法中生成。
我猜这与解决此问题有关,所以我尝试使用 .apply 但无济于事。
任何关于实现这一目标的建议都值得赞赏。
更新
创建 soundmanager 对象时,它需要一些选项,其中一些是回调选项,如下所示。
var opts = {
id: _this.o.latestTrackId,
url: _this.o.latestStream,
autoLoad: true,
autoPlay: autoPlay,
multiShot: false,
onplay: function(){
_this.playing = true;
_this.o.playButton.addClass('playing');
_this.o.playButton.removeClass('paused');
},
onpause: function(){
_this.playing = false;
_this.o.playButton.removeClass('playing');
_this.o.playButton.addClass('paused');
},
onresume: function(){
_this.playing = true;
_this.o.playButton.addClass('playing');
_this.o.playButton.removeClass('paused');
},
onfinish: function(){
},
onstop: function(){
},
onload: function(){
},
whileloading: function(){
_this.updateLoading();
},
whileplaying: function(){
_this.setElapsed();
_this.updatePlayhead();
},
stream: true,
volume: 90
};
我想包含来自waveform.js的函数来更新波形,提供了一个返回的方法
whileplaying: function(),
whileloading: function()
除了我自己的 setElapsed() 等之外,我还想在播放/加载时包括这些第二个,但直接调用它们会导致上面的警告。