Howler js pause/resume trouble

Question

I'm using the Howler js library to set a player in an app running through Electron. First everything seemed to work well, but after a few weeks using the app, a bug occurs repeatedly, but not constantly : the pause() function doesn't work. Here's some piece of code :

Initialization :

    var is_paused = true;
    var currentTrack = "track1";

    var tracks =    {"track1" :  new Howl({urls: ['path/to/track1.mp3']}),
                    "track2" : new Howl({urls: ['path/to/track2.mp3']}),
                    "track3" : new Howl({urls: ['path/to/track3.mp3']})
    };

Then I have a few buttons for play/resume, pause, stop, and play a specific track :

$('#playS').click(function(){
        if (is_paused){
            tracks[currentTrack].play();
            is_paused = false;
        }
    });

$('#pauseS').click(function(){
        tracks[currentTrack].pause();
        is_paused = true;
    });

$('.trackBtn').click(function(){
        tracks[currentTrack].stop(); 
        currentTrack = $(this).attr('id');
        tracks[currentTrack].play();
        is_paused = false;
    });

The problem is that sometimes (generally after 40-45 min of a track playing), the pause() function just do nothing, which is really annoying cause I need to pause the track and play another 30 sec file and then resume the current track. I checked the console while the bug occurs, it says absolutely nothing. I have no idea where the bug comes from, there's not a lot of information about how works the library. I really need some help here, thank's in advance.

EDIT : one more thing, when pause() doesn't work, if I click play() the track plays from the begining, and I have control on this second instance of the track. It's like the first instance has reached end, but still playing.

Answer 1

Without knowing what version of Howler you're using, or what other code might be messing things up, there is one thing I think might help: You don't need to track the paused state. The "playing" method takes care of that. I've made it work using something like this:

// If it's paused, it's not playing, so... paused = !myHowlInstance.playing();

Another thing I noticed is that you have currentTrack = $(this).attr('id'); in your (I think it's a) stop button. Unfortunately I don't know JQuery well enough to know if there's anything wrong with that (I'm more of a Dojo fan myself). But it looks like currentTrack may be set to some value not in your list (which would break tracks[currentTrack] ). You might want to go into the console and type tracks["track1"] , currentTrack etc. to see their values. You can even do tracks[currentTrack].play(); and see what happens. I wasn't sure if you knew you could do that (it was a huge help to me when I found out about it).

And as far as the "un-pausing" starting from the beginning, I'm currently struggling with it myself; at this time there's no clear way to do this (no resume() , pause(false) etc.), and I've seen a few more questions on the subject on Google and SO, so you're not alone. I've experimented with the seek method, but with no luck. I'll post a comment if/when I reach a breakthrough on that. :)

EDIT: I figured out the play-from-beginning thing. It does involve "seek", and also the whole "instance ID" concept (which I never really understood the importance of from the documentation).

Here's an example from a project I'm working on (also a game); it doesn't involve JQuery (sorry), but it should give you the gist of how to fix the problem.

var myBgMusic = new Howl(...);
var myMusicID = myBgMusic.play();   // The docs say play() returns an ID, and I'll be passing that to "seek" later.
var paused = false;
var saveSeek;
function TogglePause() {

    if (paused) {
        myBgMusic.play(myMusicID);
        myBgMusic.seek(saveSeek, myMusicID);
    } else {
        myBgMusic.pause();
        saveSeek = myBgMusic.seek(myMusicID);
    }
};