Playing local files cordova/phonegap build

Question

I'm a novice app-developer and at the moment I'm losing my mind and searched everywhere for a decent solution (also on stack overflow) but I haven't been able to find a working one It's been almost 2 weeks of constant searching and trying and back to the drawing board as nothing seems to go according to plan.

For a client we are developing an app that should be able to stream an mp3 file but also download it so it can be used offline. so far so good I've been able (with te help of stack overflow) to make an app that does this however it refuses to play files that are downloaded.

I download the files to cordova.file.dataDirectory to a subdirectory called music using the filetransfer plugin.

And this is where the trouble begins.

to stream the files i use the following code:

function externSpelen(){
    var externeBron = globals.muziekServer + globals.activeTrack;
    console.log (externeBron);
    $("#audioPlayer").attr("src",externeBron);
}

The song starts playing right away no problem. However when I try play the file form the local source it doesn't do anything not even giving me an error.

function lokaalSpelen(){
    var lokaleBron = cordova.file.dataDirectory + 'muziek/' + globals.activeTrack;

    console.log (lokaleBron);
    $("#audioPlayer").attr("src",lokaleBron);
}

I'm 100% certain the file exists at the given location as I've been checking it (manually). I also check this before the track starts playing. using this function.

function mp3Spelen (bestandsNaam){
    store = cordova.file.dataDirectory + 'muziek/';
    fileName = 'ap-' + bestandsNaam +'.mp3';
    globals.activeTrack = fileName
    window.resolveLocalFileSystemURL(store + fileName, lokaalSpelen, externSpelen);
}

To be complete the functions triggers after clicking a button

<button onclick="mp3Spelen('veiligeplek')">Speel veiligeplek</button></br>

(so after clicking the button the file ap-veiligeplek.mp3 should start playing. either local or remote)

I've tried to do the same thing with images (download and view them) and for some reason they seem to work just fine.

At this point I'm almost giving up as I tried several solutions. Like using the cordova media plugin but same results.

I'm using PhoneGap Build to build the application and I've included all the plugins needed.

Any help would greatly be appreciated!

Answer 1

After clearing up my js file somehow the code above started working. I'll leave it here for your convenience.