Skip to main content
vickyg64711747
Inspiring
June 11, 2018
Answered

My loop makes a little noise each time it starts

  • June 11, 2018
  • 2 replies
  • 2055 views

Hi,

I have this problem: I made a loop of a sound using the following code:

if(!this.s1)

     this.s1 = playSound("Loop1", {loop:2});

else

     this.s1.play();

but the loop pauses a little and made little noise each time it starts, it's not a perfect loop. Can someone help me solve it?

You can see what happens in the following link:

https://www.owlieboo.com/juegos_html5/musica/index.html

By clicking on each owl the sounds are heard.

Thank you!!

    This topic has been closed for replies.
    Correct answer ClayUUID

    You can see my project by entering to https://www.owlieboo.com/juegos_html5/musica/index.zip


    Hooo boy. Okay, this:

    if(!this.s1)

        this.s1 = playSound("Loop1", {loop:-1});

    else

        this.s1.play();

        this.s1.volume = 0;

    This is a mess. The first part of the code will always execute, because this.sX is always never initialized. But if it ever was initialized, the else part would fail to set the volume, because you didn't put any curly braces around the entire else block. So it will only execute the first line of code after the else. And you have this code repeated six times.

    Another problem is that you set every sound playing immediately, before any user interaction. So sound playback will fail on Chrome and any other browsers that only allow audio from a user interaction. All your code can be rewritten as this:

    var onoff = [];

    var sounds = [];

    for (var i = 1; i < 7; i++) {

        this["btn" + i].id = i;

        this["btn" + i].addEventListener("click", volumen.bind(this));

        onoff = false;

    }

    function volumen(evt) {

        var n = evt.currentTarget.id;

        var on = onoff = !onoff;

        if (!sounds) {

            sounds = createjs.Sound.play("Loop" + n, {loop:-1});

        }

        sounds.volume = on ? 1 : 0;

        this["buho" + n ][on ? "play" : "gotoAndStop"](0);

    }

    Unfortunately this doesn't help with the looping delay. This appears to be an intrinsic limitation of CreateJS and/or HTML5 audio. I did notice that in IE the sound end event would sometimes fail to fire, causing looping to be delayed by a second or two. Importing the audio into Animate as a WAV file instead of an MP3 seemed to fix this. Importing MP3s directly into Animate does tend to cause problems.

    Also, having your buttons in the exact shape of the birds is a really bad idea. The whole point of hit frames is to make the hit targets larger and without gaps so they're easier to click. Your bird button hit frame should just be a rectangle slightly larger than the bird, but not overlapping the other buttons.

    2 replies

    Legend
    June 11, 2018

    If your audio files don't loop perfectly on their own, then they're not going to loop perfectly in Animate. For example, look how loop1.mp3 ends:

    You have to make sure each audio file begins and ends at a zero crossing.

    And Jesus, that clipping. Are you trying to destroy people's speakers?

    vickyg64711747
    Inspiring
    June 11, 2018

    Thank you for your answer, Clay!

    What do you mean with zero crossing? If you hear every loop in Adobe Audition the loops sound all perferctly. In fact, there are made using fruity loops, that is a special program to make loops.

    Colin Holgate
    Inspiring
    June 12, 2018

    Loop3 is also bad. The start is at a zero crossing point, but the end isn't. So, every loop it will click badly.

    The small gap when it repeats may be down to whether the sound is buffered, it should improve over time. But, I would expect there to be a limit to how smooth HTML5 audio can loop sounds. So, your ones are not doing too badly.

    Here's how Loop3 ends, the green waveform line should have ended where the red zero crossing line is:

    Inspiring
    June 11, 2018

    Hi,

    I played them on Chrome and Firefox but didn't hear anything unusual over headphones.