Web and WebWorks Development

[Mamoka]

Hi,

In a webworks app built using jQueryMobile framework, inside one of my pages, I have an audio element created as follows:

$("#output").append('<audio id="notificationAudio" autoplay="autoplay" controls="controls"><source src="http://domain.com/audio.amr" /></audio>');

this works ok: app shows player and plays file.

But when I change page ($.mobile.changePage()),  i do remove the audio element as follows:

$("#notificationAudio").remove();
$("#output").empty();

but this doesn't work: player stays sticky in position, floating over content, even if it doesn't appear in DOM anymore!

This is happening on app and browser of OS6 (tested on both torch 9800 and curve 9300).

Any ideas?

Thanks in advance,

M.
 

[twindsor]

What about pausing the audio before removing it?

[Mamoka]

Hi Tim,

This doesn't seem to work. Pausing the audio prior to remove its DOM element has no effects at all...

Any other suggestion?

Thank you,

M.

[astanley]

Using Web Inspector, do you see any runtime errors when the following code runs?

$("#notificationAudio").remove();
$("#output").empty();

Curious if there is an error message that might reveal what the underlying problem is - a) bug in jQuery or b) media resource is locked while file is in use.

If the latter, what if you stopped the audio before removing it (as opposed to just pausing it)?

[Mamoka]

Hello Adam,

Unfortunately I do not have Web Inpsector as I'm on OS6.

File is streaming from remote server so I don't think it could be a file lock related issue.

HTML5 Audio element does not have a .stop() method, only .pause() seems to be available...

Regards,

M.

[astanley]

okay then lets try ruling jQuery out of the equation first

Instead of

$("notificationAPI").remove();

can you try raw DOM removal instead:

var element = document.getElementById("notificationAPI");
element.parentNode.removeChild(element);

If that still persists the problem - I suspect is related to the fact that the audio is being streamed.

My mistake about the .stop() method

[Mamoka]

Hi,

Thanks Adam for the other suggestion. Ruling out jQuery and using pure JavaScript didn't solve the issue.

I have prepared an example here:

http://109.168.126.199/audio/

If you open this link with a OS6 BB browser, and click on "Create audio tag" button, this will create the audio tag (you can check generated source code by clicking on "DOM" button) and autoplay a sample .mp3 file.

OK so far, but if you click on the "Remove audio tag" , although audio tag gets removed from DOM (again, click on "DOM" button to check source), the player will still be visible and floating over content...

No way to remove it!

This looks like a browser engine bug to me.

I would be grateful if other OS6 users could test the above link, and post here their results...

On my side, this happens on two devices I have running OS 6.0 - 2647

Thank you,

M.

[Rcjuk]

Does the same on my 9800.

6.0.0.600 (2647)