• Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
    Dedicated community for Japanese speakers
  • 한국 커뮤니티
    Dedicated community for Korean speakers
Exit
0

My loop makes a little noise each time it starts

Explorer ,
Jun 11, 2018 Jun 11, 2018

Copy link to clipboard

Copied

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!!

Views

1.0K

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines

correct answers 1 Correct answer

LEGEND , Jun 12, 2018 Jun 12, 2018

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 i

...

Votes

Translate

Translate
Engaged ,
Jun 11, 2018 Jun 11, 2018

Copy link to clipboard

Copied

Hi,

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

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Jun 11, 2018 Jun 11, 2018

Copy link to clipboard

Copied

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:

loop3.jpg

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?

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Jun 11, 2018 Jun 11, 2018

Copy link to clipboard

Copied

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.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Jun 11, 2018 Jun 11, 2018

Copy link to clipboard

Copied

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:

Screen Shot 2018-06-11 at 8.08.44 PM.png

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Jun 11, 2018 Jun 11, 2018

Copy link to clipboard

Copied

Also, ideally, the loop should begin and end with the waveform moving in the same direction. So if it starts with the waveform moving up from the zero point, it should end with moving up to the zero point.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Jun 12, 2018 Jun 12, 2018

Copy link to clipboard

Copied

Thank you for your answers, guys!

I will work with my sound files.

Beyond the sound files, is the code that I use to play the sounds in the game okay? Isn't the small pause there a question of code? Isn't there another way to play the sounds?

Sorry if I insist, I ask because the same game with the same sound files in AS2 worked perfectly. (https://www.owlieboo.com/games-for-toddlers/games-for-toddlers-music/games-for-toddlers.php). Or may be html5 doesn't work as well as flash with loops?

Thank you again!

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Jun 12, 2018 Jun 12, 2018

Copy link to clipboard

Copied

Why are you using {loop:2} instead of {loop:-1}? How is that even working at all?

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Jun 12, 2018 Jun 12, 2018

Copy link to clipboard

Copied

I don't know, Clay, I found it searching in the Internet and it worked fine, but with the little pause.

I changed it by -1 and it works the same.

I am almost sure it is not a problem of the sound files. It is logic that they start and end in different crossing points because they are not  continuous sounds. Each loop is a music compass that starts and ends differently. If you listen to them in Adobe Audition, all the loops work perfectly.

The problem is not a noise but a small delay between each playback of the file that makes the loop not sound perfectly.

That's why I was asking if the code was right, obviously I'm not an expert and maybe I was using a wrong code.

According to what Colin says, loops do not work as well in html5 as in flash, do they?

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Jun 12, 2018 Jun 12, 2018

Copy link to clipboard

Copied

loop:2 is supposed to mean the sound should only loop twice and then stop. Do you have some other code that's manually restarting the sounds?

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Jun 12, 2018 Jun 12, 2018

Copy link to clipboard

Copied

No

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Jun 12, 2018 Jun 12, 2018

Copy link to clipboard

Copied

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

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Jun 12, 2018 Jun 12, 2018

Copy link to clipboard

Copied

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.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Jun 13, 2018 Jun 13, 2018

Copy link to clipboard

Copied

LATEST

Wow! Thank you very much! Now the code is super clean!

I fixed the intrinsic limitation of CreateJS and / or HTML5 in this way: I multiplied each loop by eight, so the small delay is heard only once every eight loops. It is not perfect, but the imperfection is much less heard.

Thank you very much for your help!!!

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines