如何用Howler JS实现seek功能

Question

我正在尝试使用 howler.js 实现 seek() 函数，但我不知道如何实现它。我是一个新手 javascript 程序员，所以它可能很简单，但我在其他地方找不到任何有用的例子。我的代码按预期工作，否则我只想添加在开始以外的时间开始播放音频的功能。例如，当声音开始时，它可能会在 4 秒而不是 0 秒开始。sound.seek([300], id2); 是我在下面尝试实现的。

<script src="js/howler.core.js"></script>
<link rel="stylesheet" href="css/styles.css">

<script>
    // 01 /////////////////////////////


    (function looper() {
        var aStartMin = 0
        var aStartMax = 19000
        var aFadeIn = 300
        var aFadeOut = 300
        var aPlayDurationMin = 6000
        var aPlayDurationMax = 21000
        var aWaitToPlay = 0
        var maxVolume = 1
        var numberOfSounds = 0;
        var maxNumberOfSounds = 5;

        loop('audio/STE-059_full length.wav'); // Call the loop and give it the sound variable we want.

        function loop(soundFileName) {

            var rand = Math.round(Math.random() * aStartMax) + aStartMin;

            // plays sound right away
            if (numberOfSounds < 1) {

                setTimeout(function () {

                    numberOfSounds++; 
                    console.log('Number of sounds is now: ' + numberOfSounds);
                    //print this so we know how many there are.

                    playDuration = Math.floor((Math.random() * aPlayDurationMax) + aPlayDurationMin); // so we set it first above, but then each time here

                    setTimeout(function () {
                        if (numberOfSounds < maxNumberOfSounds) { //Don't create more than the max number of sounds.
                            var sound = getSound(soundFileName);

                            sound.seek([300], id2);
                            // I've also tried:
                            //sound.seek([300]);
                            //sound.seek(300);
                            //and I've tried this code in other locations

                            sound.volume(1.0);

                            var id2 = sound.play();


                            sound.fade(0, maxVolume, aFadeIn, id2); // FADE IN
                            //var id1 = sound.play(); 


                            setTimeout(function () {
                                sound.fade(maxVolume, 0, aFadeOut, id2); // FADE OUT
                                numberOfSounds--; //when it fades out subtract one

                                // Attempt to clean up the sound object
                                setTimeout(function () {
                                    sound.stop();
                                    sound.unload();
                                }, aFadeOut + 1000);


                                console.log('Number of sounds is now: ' + numberOfSounds);
                            }, playDuration); // PLAY TIME
                        }
                    }, aWaitToPlay); // WAIT TIME
                    loop(soundFileName); // calls the loop function again
                }, 0);

            }

            else {
                setTimeout(function () {

                    playDuration = Math.floor((Math.random() * aPlayDurationMax) + aPlayDurationMin); // so we set it first above, but then each time here

                    setTimeout(function () {
                        if (numberOfSounds < maxNumberOfSounds) { //Don't create more than the max number of sounds.
                            var sound = getSound(soundFileName);
                            numberOfSounds++; // adding 1 to the variable. Keeps track of how many sounds are currently running.
                            console.log('Number of sounds is now: ' + numberOfSounds);
                            sound.volume(1.0);

                            var id2 = sound.play();
                            sound.fade(0, maxVolume, aFadeIn, id2); // FADE IN
                            //var id1 = sound.play(); 

                            setTimeout(function () {
                                sound.fade(maxVolume, 0, aFadeOut, id2); // FADE OUT
                                numberOfSounds--; //when it fades out subtract one

                                // Attempt to clean up the sound object
                                setTimeout(function () {
                                    sound.stop();
                                    sound.unload();
                                }, aFadeOut + 1000);


                                console.log('Number of sounds is now: ' + numberOfSounds);
                            }, playDuration); // PLAY TIME
                        }
                    }, aWaitToPlay); // WAIT TIME
                    loop(soundFileName); // calls the loop function again
                }, rand);
            }
        };

        function getSound(soundFileName) { // this function is needed to play, but is it poluting namespace? what if I add more sound functions?
            return new Howl({
                src: [soundFileName], // code seems to break when sound is shorter than time variable 
                autoplay: true,
                loop: true,
                volume: 0,
                fade: 0 // removes the blip
            });
        }
    })();



</script>

<script src="js/howler.core.js"></script>
<script src="js/siriwave.js"></script>
<script src="js/player.js"></script>

Answer 1

两个问题：

您正在将数组而不是数值传递到 seek 中。如果你想寻找到 4 秒，你应该这样做：

sound.seek(4000, id2);

您正在使用尚未设置的 ID 调用搜索。 id2 是在调用 seek 后定义的。你应该这样称呼它：

var id2 = sound.play();
sound.seek(4000, id2);

如何用Howler JS实现seek功能

How to Implement Seek Function With Howler JS

javascript

howler.js