0

我正在尝试使用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() 等之外,我还想在播放/加载时包括这些第二个,但直接调用它们会导致上面的警告。

4

0 回答 0