Latency increment/decrement

tonistiigi · Mar 27, 2012 · 21b0764 · 21b0764
1 parent a00cdd8
commit 21b0764
Show file tree

Hide file tree

Showing 2 changed files with 76 additions and 19 deletions.
diff --git a/lib/public/js/test.js b/lib/public/js/test.js
@@ -1,16 +1,17 @@
 $(function(){
 
   var agent = window.navigator.userAgent;
-  var ua = {
-    webkit: /webkit/i.test(agent),
-    safari: /safari/i.test(agent),
-    chrome: /chrome/i.test(agent),
-    moz: /firefox/i.test(agent),
-    ie: /MSIE/i.test(agent),
-    ios: /ipad|iphone|ipad/i.test(agent),
-    android: /android/i.test(agent),
-    winmo: /iemobile/i.test(agent)
-  };
+  var ua = {};
+  ua.webkit = /webkit/i.test(agent),
+  ua.chrome = /chrome/i.test(agent),
+  ua.safari = !ua.chrome && /safari/i.test(agent),
+  ua.moz = /firefox/i.test(agent),
+  ua.ie = /MSIE/i.test(agent),
+  ua.ios = /ipad|iphone|ipad/i.test(agent),
+  ua.iphone = /iphone|ipad/i.test(agent),
+  ua.ipad = /ipad/i.test(agent),
+  ua.android = /android/i.test(agent),
+  ua.winmo = /iemobile/i.test(agent)
 
   var spkr = null;
 
@@ -67,10 +68,10 @@ $(function(){
 
   }
   function onIncr(){
-
+    spkr.correctLatency(50);
   }
   function onDecr(){
-
+    spkr.correctLatency(-50);
   }
 
   var Spkr = function(e, src, duration){
@@ -86,6 +87,26 @@ $(function(){
     this.firstLatency = new Stats();
     this.lastLatency = [];
 
+    if (ua.chrome) {
+      this.firstLatency.push(50);
+      this.latencyStats.push(50);
+    }
+    else if (ua.safari) {
+      this.firstLatency.push(150);
+      this.latencyStats.push(150);
+    }
+    else if (ua.iphone) {
+      this.firstLatency.push(300);
+      this.latencyStats.push(180);
+    }
+    else if (ua.ipad) {
+      this.firstLatency.push(180);
+      this.latencyStats.push(130);
+    }
+    else if (ua.winmo) {
+      this.firstLatency.push(750);
+      this.latencyStats.push(0);
+    }
 
     setInterval(this.step, 50);
 
@@ -108,12 +129,14 @@ $(function(){
     this.audio.addEventListener('ended', function(){ log('EVT', 'ended'); }, true);
     this.audio.addEventListener('waiting', function(){ log('EVT', 'waiting'); }, true);
     this.audio.addEventListener('durationchange', function(){ log('EVT', 'durationchange'); }, true);
-    this.audio.addEventListener('timeupdate', function(){ log('EVT', 'timeupdate'); }, true);
+    //this.audio.addEventListener('timeupdate', function(){ log('EVT', 'timeupdate'); }, true);
     this.audio.addEventListener('play', function(){ log('EVT', 'play'); }, true);
     this.audio.addEventListener('pause', function(){ log('EVT', 'pause'); }, true);
     this.audio.addEventListener('ratechange', function(){ log('EVT', 'ratechange'); }, true);
     this.audio.addEventListener('volumechange', function(){ log('EVT', 'volumechange'); }, true);
 
+    this.audio.addEventListener('ended', this.onEnded, true);
+
     this.loadFile(src);
 
   };
@@ -161,6 +184,9 @@ $(function(){
       $("#url").text(parts[parts.length - 1]);
       $("#loaded").text(0);
     },
+    onEnded: function(){
+      this.pause();
+    },
     onCanPlayThrough: function(){
       if (this.loading) {
         this.audio.addEventListener('canplaythrough', this.onCanPlayThrough, true);
@@ -172,10 +198,14 @@ $(function(){
     play: function() {
       this.playAt(parseFloat(this.audio.currentTime.toFixed(2)));
     },
-    playAt: function(position){
+    playAt: function(position, correction){
       this.playCount++;
       this.playTime = +new Date();
       this.playPosition = position;
+      if(!correction) {
+        this.trackTime = this.playTime;
+        this.trackPosition = this.playPosition;
+      }
       var self = this;
       var setTime = this.setCurrentTimeAsync(position, function(){
         self.playing = true;
@@ -191,8 +221,8 @@ $(function(){
       this.audio.pause();
     },
     setCurrentTimeAsync: function(value, cb) {
+      var self = this;
       if (ua.ios) {
-        var self = this;
         var didSeek = false;
         var onSeeked = function(){
           didSeek = true;
@@ -210,7 +240,7 @@ $(function(){
         var result = this.setCurrentTime(value);
         if(!result){
           setTimeout(function(){
-            this.setCurrentTimeAsync(value, cb);
+            self.setCurrentTimeAsync(value, cb);
           }, 10);
         }
         else {
@@ -230,6 +260,17 @@ $(function(){
     getLatency: function() {
       return this.lastLatency.amean();
     },
+
+    correctLatency: function(delta) {
+      var deviceLatency = this.latencyStats.amean();
+      if (deviceLatency) {
+        var currentTime = this.audio.currentTime;
+        log('latency', currentTime, (currentTime*1000 - delta - deviceLatency)/1000, delta, deviceLatency);
+        this.audio.pause();
+        this.playAt((currentTime*1000 - delta + deviceLatency)/1000, true);
+      }
+    },
+
     step: function() {
       if (!this.playing && !this.audio.paused) {
         this.audio.pause();
@@ -280,9 +321,11 @@ $(function(){
 
 
       }
-      var currentTime = this.audio.currentTime;
+
       if (this.playing) {
-        var latency = Math.round(((+new Date()) - this.playTime) - (currentTime - this.playPosition) * 1000);
+        var currentTime = this.audio.currentTime;
+        var now = +new Date();
+        var latency = Math.round((now - this.playTime) - (currentTime - this.playPosition) * 1000);
         /*
         Latency is known if:
           - 3 last measurements were pretty equal.
@@ -293,6 +336,11 @@ $(function(){
           this.latency = latency;
           $("#latency").text(latency.toFixed(5));
         }
+        var tlatency = Math.round((now - this.trackTime) - (currentTime - this.trackPosition) * 1000);
+        if (tlatency !== this.tlatency) {
+          this.tlatency = tlatency;
+          $("#tracklatency").text(tlatency.toFixed(5));
+        }
         var fixedLatency = this.fixedLatency;
         if (this.fixedLatency === null && currentTime > this.playPosition + (this.playCount==1?.2:0) ) {
 
@@ -310,7 +358,12 @@ $(function(){
           }
         }
         if (fixedLatency !== this.fixedLatency) {
-          this.latencyStats.push(this.fixedLatency);
+          if (this.playCount == 1) {
+            this.firstLatency.push(this.fixedLatency);
+          }
+          else {
+            this.latencyStats.push(this.fixedLatency);
+          }
           $("#latency2").text(this.fixedLatency);
         }
       }

diff --git a/lib/public/test.html b/lib/public/test.html
@@ -59,6 +59,7 @@
   <div class="playhead">
     <div id="url"></div>
     <div id="time"></div>
+    <div id="tracklatency"></div>
     <div id="latency"></div>
     <div id="latency2"></div>
     <div id="playtime"></div>
@@ -142,6 +143,9 @@
     #time:before {
       content: "Time:";
     }
+    #tracklatency:before {
+      content: "TLatency:";
+    }
     #latency:before {
       content: "Latency:";
     }