Issue in using Cordova Media plugin

Question

I am developing an Android app using Ionic framework. In there I have used Cordova Media Plugin to play some mp3 files.

There is something strange happening in the code that I cannot understand. In the code I have a function to create a media object and play it as:

function playAudio(src) {
  myMedia = new Media(src, onSuccess, onError);
  myMedia.play();
  document.getElementById('forTest2').innerHTML = "end of playAudio";
}

In my JavaScript code I have this code section:

document.getElementById('forTest1').innerHTML = "before playAudio";
playAudio(audioSrc);
document.getElementById('forTest3').innerHTML = "visited after playAudio return"; 

I have added document.getElementById lines for debug.

When I run the code I see the following lines shown in the document screen:

before playAudio
end of playAudio

I expected after returning from the playAudio function to see these 3 lines instead of above 2 lines:

before playAudio
end of playAudio
visited after playAudio return

But I do not see the visited after playAudio return message, which shows we do not return from the playAudio(audioSrc); , which is strange.

Is there any explanation for this?

I am testing this on Android API 18 if it matters.

Any help is really appreciated.

Answer 1

Are you sure, that you have an element with id forTest3 ? because it makes no sense, that end of playAudio function is reached and then the next instruction isn't executed. It looks more like there is no element forTest3

Try to use console.log() instead.

function playAudio(src) {
  myMedia = new Media(src, onSuccess, onError);
  myMedia.play();
  console.log("end of playAudio");
}

console.log("before playAudio");
playAudio(audioSrc);
console.log("visited after playAudio return"); 

What happen if you add some additional outputs?

myMedia = new Media(src, onSuccess, onError, function(status){console.log(status)};