Search code examples
androidjquerygoogle-chromemobilejplayer

jPlayer duration and progress error


I have a few jPlayer instances, obviously with diferent id.

Edit: Here is my current Fiddle

http://jsfiddle.net/UrielUVD/8t52eqsp/

$("#jquery_jplayer_1").jPlayer({
  ready: function () {
    $(this).jPlayer("setMedia", {
      title: "test",
      mp3: "sourceofmp3"
  });
  },
  timeupdate: function(event) {
      $("#jp-progress-slider-1").slider("value",event.jPlayer.status.currentPercentAbsolute);
    },
  swfPath: "jquery.jplayer.swf",
  cssSelectorAncestor: '#jp_container_1',
  cssSelector:
  {
  play: '.icon-play1',
  pause: '.icon-pause1',
  seekBar: '.ui-slider',
  playBar: '.ui-slider-range',
  currentTime: '.jp-current-time',
  duration: '.jp-duration'
  },
  supplied: "mp3",
  solution_play: "flash, html",
  wmode: "window",
  mobile:true,
  preload: "metadata",
  volume: 1,
  duration:true,
  keyEnabled: true,
  errorAlerts: true
});

And his respective jquery ui slider

$("#jp-progress-slider-1").slider({
animate: "fast",
max: 100,
range: "min",
step: 0.1,
value : 0,
slide: function(event, ui) {
  var sp = $("#jquery_jplayer_1").data("jPlayer").status.seekPercent;

  if(sp > 0) {
    $("#jquery_jplayer_1").jPlayer("playHead", ui.value * (100 / sp));
  } else {

    setTimeout(function() {
      $( "#jp-progress-slider-1").slider("value", 0);
    }, 0);
  }
 }
});

In web everything works fine, duration, current time, current progress, events and listeners...

But in mobile (adnroid) duration,currentPercentAbsolute,currentPercentRelative are always 0 The player plays,pauses and stops normally but this values of the status are always 0 What´s wrong?

Edit 1: So far, this error is only shown in Android Chrome 39, no


Solution

  • At last!

    I foud what was wrong...

    • No error in JavaScript code
    • No error in URL sources
    • No error in audio mime types
    • No error in JQuery-ui, Jplayer or JPlayer.swf

    The error was in the server!!!
    It has enable gzip compression

    I used SetEnv no-gzip 1 in the .htaccess to solve it

    Do Not GZIP the Media

    Disable GZIP encoding of all the media files. Media files are already >compressed and the GZIP will just waste CPU on your server.

    The Adobe Flash Plugin will experience issues if you GZIP the media.

    Do not GZIP the Jplayer.swf file either. Feel free to GZIP the JavaScript

    http://jplayer.org/latest/developer-guide/

    This is the only reference to the possible bug that i found so far

    NOTE: So far this bug is only shown in Android Chorme
    If you're experimenting some issues of the list below in mobile browsers give it a try

    • Audio playing but, not metadata loaded
    • Can't set url despite the url is right and accessible
    • Can't trigger the timeupdate event even when the audio is playing