Search code examples
jquerysoundmanager2

SoundManager2 AutoPlay loads file twice


I have to include an audio file, which automatically plays and can be paused and played again by buttons. The pausing and playing works, however it seems, that the file is loaded twice and I can't find the problem. When I pause, the sound volume just goes down and if I press the play button, one "layer" continues playing, where I paused it, the other just keeps on playing... This is the code:

$(document).ready(function() {
  $('#play').hide();
  soundManager.setup({
    debugMode: false,
    onready: function () {
      soundManager.createSound({
        id: 'music',
        url: 'up/files/file.mp3',
        autoPlay: true,
        autoLoad: false
      })
    }
  });

  $('#play').bind('click', function() {
    var sound = soundManager.getSoundById('music');
    sound.play();
    $('#pause').show();
    $('#play').hide();
  });

  $('#pause').bind('click', function() {
    var sound = soundManager.getSoundById('music');
    sound.pause();
    $('#pause').hide();
    $('#play').show();
  });
});

Edit

As Alex Morrise said, this seems to be a bug in the soundmanager2.js file. I now fixed this by providing a path to the swf-files and setting the preferFlash option to true, like so:

soundManager.setup({
  url: 'path/to/swf-files',
  preferFlash: true,
  debugMode: false,
  onready: function () {
    soundManager.createSound({
      id: 'music',
      url: 'up/files/file.mp3',
      autoPlay: true,
      autoLoad: false
    })
  }
});

Solution

  • This appears to be a bug in SoundManager. The soundManager.createSound method runs a _setup_html5 method. If you've set autoPlay, that _setup_html5 method calls a load function, which loads the sound.

    However, in the load function, it checks to see if your browser supports HTML5. If it does, it again calls _setup_html5, which calls load the second time.

    Do you follow?

    Here's a sampling of the code:

    this._setup_html5 = function(oOptions) {
        //...
        if (instanceOptions.autoLoad || instanceOptions.autoPlay) {
            s.load();
        }
        //...
    }
    
    this.load = function(oOptions) {
        //...
        if (html5OK(instanceOptions)) {
            oSound = s._setup_html5(instanceOptions);
            //...
        }
        //...
    }