Looping sound on export has silent gaps

Elements
10

Are the images you included in your test file from your audio editing app?

If I get a segment of pink noise and loop it, I'm only seeing issues in Opera when using Hype's built in audio player. It's kind of hard to see what should be happening in your file because some files have blank spaces.

Screenshot 2021-04-23 at 3.21.22 PM
Screenshot 2021-04-23 at 3.21.22 PM887×164 18.6 KB

audiotest.hype 2.zip (31.2 KB)

Regarding whether browsers play mp3 vs ogg -- In the list of sources, the browser will play the first compatible audio file (more info) and I think we put MP3 sources first.

You could create your own custom audio element and place the source in a higher order:

<audio id="thefoo" controls loop>
 <source src="${resourcesFolderName}/foo.ogg" type="audio/ogg; codecs=vorbis"/>
 <source src="${resourcesFolderName}/foo.mp3" type="audio/mpeg"/>
</audio>

I did make a test with Howler.js' loop, and it requires a small JS function that looks like this, which can be triggered by a button:

var sound = new Howl({
  src: ['${resourcesFolderName}/pink-shorter.mp3', '${resourcesFolderName}/pink-shorter.ogg'],
  loop: true,
  volume: 1
});

sound.play();

It also requires a snippet in the 'head' to load the library:

<script src="https://cdnjs.cloudflare.com/ajax/libs/howler/2.2.1/howler.min.js" integrity="sha512-L6Z/YtIPQ7eU3BProP34WGU5yIRk7tNHk7vaC2dB1Vy1atz6wl9mCkTPPZ2Rn1qPr+vY2mZ9odZLdGYuaBk7dQ==" crossorigin="anonymous"></script>

This seems to resolve the issue in Opera -- here's a demo:

audiotest.hype 3.zip (32.5 KB)

Note that a looping audio issue was recently fixed in Firefox, but I don't know much about Opera's development:

1 Like