Chrome html5 video buffer. Even evento

Question

Estoy tratando de detectar cuando un archivo de video ha terminado de cargarse. Lo hice funcionar con éxito en Firefox y Safari, pero en Chrome, el evento con búfer se comporta extraño ... así que, en mi host local Chrome funciona bien, pero cuando lo cargo en el servidor;

1. porcentaje del búfer se detiene aproximadamente 50%, pero tampones% 100,

2. cuando la página refrescado, estancia porcentaje en% 0 pero sigue amortiguando ..

aquí está mi javascript

function loaded() 
     { 
      var v = document.getElementById('myVideo'); 
      var r = v.buffered; 
      var total = v.duration; 
      var current=v.currentTime; 
      var start = r.start(0); 
        var end = r.end(0); 
      var downloadPercent= Math.round((end/total)*100) 
      $("#loadProgress").css('width',downloadPercent+ '%'); 

        if(downloadPercent==100){ 
       $("#preloaderWrapper").fadeOut(function(){ 
       document.getElementById('myVideo').play(); 
       clearInterval(ratoteLoad); 
       $(this).remove();     
        });    
      }  

     } 

      $('#myVideo').bind('progress', function() 
      { 
       loaded(); 
      }); 

¿idea? agradecimiento

Answer 1

intenta esto en su lugar:

myVideoTag = document.getElementById('video'); 
myVideoTag.addEventListener('progress', function(e) { 
    var percent = null; 
    // FF4+, Chrome 
    if (myVideoTag && myVideoTag.buffered && myVideoTag.buffered.length > 0 && myVideoTag.buffered.end && myVideoTag.duration) { 
     percent = myVideoTag.buffered.end(0)/myVideoTag.duration; 
    } 
    // Some browsers (e.g., FF3.6 and Safari 5) cannot calculate target.bufferered.end() 
    // to be anything other than 0. If the byte count is available we use this instead. 
    // Browsers that support the else if do not seem to have the bufferedBytes value and 
    // should skip to there. Tested in Safari 5, Webkit head, FF3.6, Chrome 6, IE 7/8. 
    else if (myVideoTag && myVideoTag.bytesTotal != undefined && myVideoTag.bytesTotal > 0 && myVideoTag.bufferedBytes != undefined) { 
     percent = myVideoTag.bufferedBytes/myVideoTag.bytesTotal; 
    } 

    if (percent !== null) { 
     percent = 100 * Math.min(1, Math.max(0, percent)); 

     // ... do something with var percent here (e.g. update the progress bar) 

    } 

}, false); 

... comentarios copiados de mediaelement.js, código así, pero ajustados para la visualización más fácil aquí. Omití el código para Firefox 3.0 ya que no es relevante. funcionando bien en todos los navegadores actuales

PS: THX a John Dyer para mejs - grandes cosas;)