It seems I'm unable to achieve gapless looping with mobile. This is what I've done so far:

• Creates a gap.

/

• Creates a gap.

• Creates a gap.
• Downloads same audio twice.

• Creates a gap.

HTML5 audio

• Creates a gap.

Cordova's media plugin

• Creates a gap.

WebAudio

• WORKS!
• For 1.5min audio clip, decoding time is > 30 seconds.

All above tested with mp3 and ogg.

EDIT:

SoundJS's cordova plugin is broken and thus doesn't work;

It seems I'm unable to achieve gapless looping with mobile. This is what I've done so far:

https://github./Hivenfour/SeamlessLoop

• Creates a gap.

http://www.schillmania./projects/soundmanager2/demo/api/

• Creates a gap.

https://github./regosen/Gapless-5

• Creates a gap.
• Downloads same audio twice.

https://github./floatinghotpot/cordova-plugin-nativeaudio

• Creates a gap.

HTML5 audio

• Creates a gap.

Cordova's media plugin

• Creates a gap.

WebAudio

• WORKS!
• For 1.5min audio clip, decoding time is > 30 seconds.
• https://code.google./p/chromium/issues/detail?id=424174

All above tested with mp3 and ogg.

EDIT:

SoundJS's cordova plugin is broken and thus doesn't work;

https://github./CreateJS/SoundJS/issues/170

• javascript
• html
• cordova

• 1 you could preload a 2nd copy, play the 1st, watch the position, and play the 2nd ~200ms before the 1st ends. might need tweaking on the delay, or maybe somehow pute it from a benchmark... – dandavis Commented Jul 1, 2015 at 7:53
• I'm afraid this and crossfading seems to be the only possible solutions. Your suggestion has problems when the delay is not the same for all platforms and devices. Crossfading is good on certain sounds but really bad on others. – sleepless_in_seattle Commented Jul 1, 2015 at 8:23
• yeah, you can probably measure the delay/lag with a silent track, but you're right, it's not going to be perfect. it might be passable or better than nothing or a hot phone though... there's also the issue of trailing silence, which might be work-around-able with CORS and API to load the tail and find the last audible content. – dandavis Commented Jul 1, 2015 at 8:25
• I might have to resort to using a long track (like 8min+) and just leaving the gap there and hope no-one notices. :/. I wish webaudio's decode wasn't so slow, since it's the only one that loops perfectly. – sleepless_in_seattle Commented Jul 1, 2015 at 8:32
• you might want to bounty this for more exposure, i would like to see a good solution. – dandavis Commented Jul 1, 2015 at 8:38

3 Answers 3

With HTML5 If you are using HTML5, then use loop attribute.

<audio controls loop>
  <source src="horse.ogg" type="audio/ogg">
  <source src="horse.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>

It doesn't create gap, check with your audio file, most of the audio file has gap at the end.

You can test it here, just add loop attribute and run the page.

With JavaScript

Here is also an alternative by using javascript

myAudio = new Audio('someSound.ogg'); 
myAudio.addEventListener('ended', function() {
    this.currentTime = 0;
    this.play();
}, false);
myAudio.play();

Here JavaScript will create little gap, you can overe it by playing loop not when audio is finished but when audio is about to finish. Here is code.

Here is what you want.

myAudio = new Audio('http://unska./audio/pinknoise.ogg'); 
myAudio.ontimeupdate= function(i) {
  if((this.currentTime / this.duration)>0.9){
    this.currentTime = 0;
    this.play();
  }
};
myAudio.play();

Here is Demo.

A little late to the party here, but I've got a gapless solution with https://github./floatinghotpot/cordova-plugin-nativeaudio

Not the most beautiful implementation -- but it works pletely gapless:

Javascript

const LOOP_INTERVAL = 5000

window.plugins.NativeAudio.preloadComplex( 'loop1', getMediaURL('media/loop.mp3'), 1, 1, 0, function(msg){
  }, function(msg){
    console.log( 'error: ' + msg );
  });

window.plugins.NativeAudio.preloadComplex( 'loop2', getMediaURL('media/loop.mp3'), 1, 1, 0, function(msg){
  }, function(msg){
    console.log( 'error: ' + msg );
  });

function startGaplessLoop () {
  var flag = false;
  setInterval(function() {
     flag = !flag
     window.plugins.NativeAudio.play(flag ? 'loop2' : 'loop1') 
     setTimeout(function() {
      window.plugins.NativeAudio.stop(flag ? 'loop1' : 'loop2')
    }, 30)
  }, LOOP_INTERVAL)

  window.plugins.NativeAudio.play('loop1')
}

startGaplessLoop()

Don't forget to stop the interval and unload the sound when you're finished!

Try SoundJS. It includes a cordova plugin.