Re: IE9 doesn't advance currentTime on my site

[Mark Panaghiston]

Using jPlayer('play',0) immediately after a jPlayer('setMedia', media) is pointless. It is going to play from the start.

The problem you are encountering is a bug in IE9 html5 media element (and in iOS6 too) that has been fixed in a development patch.
https://groups.google.com/d/msg/jplayer/zpin4vMzBVw/52tHKcAVG60J

So you can fix your issue by using jPlayer('play') to play it from the start after the setMedia.

If it still fails, then you might have a 2nd issue, which would be that your MIME types are incorrect. IE9 requires the correct MIME type, which with your options would be important for the M4A file... Which has the m4a extension, which might not be already setup on your server.
http://jplayer.org/latest/developer-guide/#jPlayer-server-response

My final point is that using both M4A and MP3 formats is of no benefit.
http://jplayer.org/latest/developer-guide/#jPlayer-essential-formats

There is no harm in doing it, but browsers that support M4A will support MP3 as well... So only the one that appears 1st in the supplied list will get used.

On Wednesday, 24 October 2012 21:38:25 UTC+1, R. Lund wrote:

Hi.

I have spent about 2 hours on this now, and I think it's time to ask for help...

Unfortunately I can't share the site publicly, so hopefully there's a few general pointers someone can give to me.

In short, my site is supposed to play a sound without any audio interface or controls when either one of two specific events occurs - both are JavaScript events that call a function PlaySound:

function PlaySound(filename, path)

{

if (!path)

path = "/common/audio/";

$("#jplayer_div").jPlayer("setMedia", 

{

mp3: path + filename + ".mp3",

oga: path + filename + ".ogg",

m4a: path + filename + ".m4a"

});

$("#jplayer_div").jPlayer("play", 0);

}

This works fine in FF and Chrome, but in IE9 there is no sound playing.

Here's what I found out so far:

1. If I insert an alert into the play event, it works:

$("#jplayer_div").bind($.jPlayer.event.play, function(e)

{

alert('play started');

});

Inserting any other code I have tried so far has not gotten the sound to play.

With this alert in place, not only does the sound play right after the alert noise (supplied by Windows) is played, it will play a second time and sometimes show the alert a second time.

2. I implemented the inspector and played with some events and found the following:

Once a sound is told to play, the timeUpdate section seems to constantly switch between 4 and another number - probably normal.

However, when I check event.jPlayer.status.currentTime, it is ALWAYS 0!

3. The SWF file and all other files exist and are in place, no 404 error anywhere.

4. I originally started just with the MP3 file but then tried other formats too - same thing - IE is now "playing" the M4A file, but same situation - currentTime never goes past 0.

5. The inspector says that HTML5 is supported, so it probably doesn't even use the SWF file.

6. jQuery obviously works because other jQuery features I have on my site work.

7. When I turn on errorAlerts and warningAlerts, all I get is that I don't have a control panel in place from the warnings - no errors. All sounds exist and are accounted for - especially since they play as soon as I implement the alert line.

8. Switching $("#jplayer_div").jPlayer("play", 0); to $("#jplayer_div").jPlayer("play", 1); (i.e. changing the start position) didn't help.

9. The MIME settings on the server are correct.

10. Flash is installed, even if it shouldn't be used in this case.

Here's the debug info from the inspector:

This jPlayer instance is running in your browser where:
jPlayer's html solution is being used and will support: m4a mp3
jPlayer's flash solution is not required

The HTML5 is active.

status.formatType = 'm4a'
Browser canPlay('audio/mp4; codecs="mp4a.40.2"')

status.src = '/common/audio/clang.m4a'

status.media = {
mp3: /common/audio/clang.mp3
oga: /common/audio/clang.ogg
m4a: /common/audio/clang.m4a
};

Raw browser test for HTML5 support. Should equal a function if HTML5 is available.
htmlElement.audio.canPlayType = function

This instance is using the constructor options:
$('#jplayer_div').jPlayer({
swfPath: '/common/jplayer',
solution: 'html, flash',
supplied: 'm4a, mp3, oga',
preload: 'metadata',
volume: 0.8,
muted: false,
backgroundColor: '#000000',
cssSelectorAncestor: '#jp_container_1',
cssSelector: {
videoPlay: '.jp-video-play',
play: '.jp-play',
pause: '.jp-pause',
stop: '.jp-stop',
seekBar: '.jp-seek-bar',
playBar: '.jp-play-bar',
mute: '.jp-mute',
unmute: '.jp-unmute',
volumeBar: '.jp-volume-bar',
volumeBarValue: '.jp-volume-bar-value',
volumeMax: '.jp-volume-max',
currentTime: '.jp-current-time',
duration: '.jp-duration',
fullScreen: '.jp-full-screen',
restoreScreen: '.jp-restore-screen',
repeat: '.jp-repeat',
repeatOff: '.jp-repeat-off',
gui: '.jp-gui',
noSolution: '.jp-no-solution'
},
errorAlerts: true,
warningAlerts: false
});

I initialize a bunch of other items in a function InitPage() that is attached to window.onload, and inside I have the following jPlayer initialization code:

// init sound

$(document).ready(function()

{

$("#jplayer_div").jPlayer(

{

ready: function () 

{

$(this).jPlayer("setMedia", 

{

mp3: "/common/audio/clang.mp3",

oga: "/common/audio/clang.ogg",

m4a: "/common/audio/clang.m4a"

});

},

  swfPath: "/common/jplayer",

  supplied: "m4a, mp3, oga",

  errorAlerts: true

});

$("#jplayer_debug").jPlayerInspector({jPlayer:$("#jplayer_div")});

});

The DIV designated for the player has the id "jplayer_div".

I'm no expert in jQuery - I feel more at home in plain JavaScript - but I don't think I have any errors in my code here.

The jPlayer demo sites seem to work normally, so it's safe to assume there's something on my end that's causing issues, but I just can't figure it out...

Any help would be greatly appreciated.

Please let me know if there's anything else I can supply that might help.

Thanks!

[R. Lund]

Hi, thanks for the reply.

I'll have a look at that patch tomorrow, thanks.

The reason I'm using "setMedia" is to switch between different sounds. Right now, I have 2 different sounds that are supposed to play for different situations, so I'm setting the media before hitting play.

Is that not the way it was meant to go? I looked through the documentation and didn't find anything better...

I suppose I could create its own jPlayer instance for each sound, and maybe I'll end up doing that...

I can remove the ,0 out of play. Not sure if that will make a difference, but we'll see after I had a look at the patch you mentioned.

I do know that the MIME types are correct - I verified that with Firebug and the jPlayer inspector (if I remember correctly).

I started out only using MP3, but when it didn't work I was wondering if IE had a problem with it, so I converted the file into different formats. I'll probably remove the M4A version but keep OGG in place since I think Chrome prefers it (or some other browser - I can look that up myself later :-)  ).

Thanks for your help!

[R. Lund]

Thanks again, newest patch works and fixed the IE issue for me!

Great job, and thanks again!