fixed seek issue (quantisation)

ABLoopPlayer.html

@@ -94,7 +94,7 @@ <h1 style="font-size:150%;margin-top:0;margin-bottom:0.5em;">AB Loop Player</h1>
         onmousedown="onJumpToA()" onmouseup="myPlay()"></button><!--
       --><label for="myTimeA">A:</label> <input id="myTimeA" onchange="onInputTime(this,0)" size="8"/>
       <label for="myTimeB">B:</label> <input id="myTimeB" onchange="onInputTime(this,1)" size="8"/>
-      <button id="bmkAddButton" style="width:1.5em;height:1.5em;vertical-align:bottom;background-size:80%;background-image:url('svg/star.svg');"></button>&ensp;
+      <button id="bmkAddButton" style="width:1.5em;height:1.5em;vertical-align:bottom;background-size:80%;background-image:url('svg/star.svg');"></button>
       <input type="checkbox" onchange="toggleQuant(this, help)" disabled id="quant"/><label for="quant">quantise</label>&emsp;&emsp;
       <button id="loopBackwardsButton" style="width:1.5em;height:1.5em;font-size:110%;" onmouseup="onLoopBackwards()">&laquo;</button><!--
       --><button id="loopHalveButton" style="width:2.4em;height:1.5em;font-size:110%;" onmouseup="onLoopHalve()">&times;&frac12;</button><!--

js/main.js

@@ -148,6 +148,7 @@ $(document).ready(function(){
   $("#scrub").slider({
     min: 0, step: 0.001, range: "min",
     slide: function(e,ui){
+      loopMeas.splice(0);
       mySetCurrentTime(ui.value);
     },
   })
@@ -396,6 +397,7 @@ var onSliderSlide=function(e,ui){
     timeA=ui.values[0];
     timeB=ui.values[1];
   }
+  loopMeas.splice(0);
   updateLoopUI();
 }
 
@@ -404,25 +406,24 @@ var tLavg=0;
 var tLcount=0;
 var onLoopTimerUpdate=function(){
   let tMedia=myGetCurrentTime();
+  if(tMedia<timeA) loopMeas.splice(0);
   if(tMedia<timeA && !intro.checked || tMedia>=timeB){
-    //quantise loop based on tapped tempo
     let curDate=Date.now()/1000; //[s]
     if(
-      quant.checked && tMedia>=timeB
-      && (!loopMeas.length || curDate-loopMeas.at(-1)>=(timeB-timeA)/rate)
+      tMedia>=timeB && (!loopMeas.length || curDate-loopMeas.at(-1)>=(timeB-timeA)/rate)
     ){
       loopMeas.push(curDate);
       if(loopMeas.length>1){
         loopMeas.splice(0,loopMeas.length-2);
         //long-term averaged latency of media rewind (minimum weight of current value: 1/16)
         tLavg=(tLavg*tLcount + (loopMeas[1]-loopMeas[0])*rate+timeA-timeB)/++tLcount;
         if(tLcount>15) tLcount=15;
-        let tBOld=timeB;
-        timeB=toNearest5ms(timeA+Math.round((timeB-timeA)/beatNormal)*beatNormal-tLavg);
-        if(timeB-tBOld!=0) updateLoopUI();
-      }
-      else{
-        tLavg=tLcount=0;
+        //quantise loop based on tapped tempo and average latency
+        if(quant.checked) {
+          let tBOld=timeB;
+          timeB=toNearest5ms(timeA+Math.round((timeB-timeA)/beatNormal)*beatNormal-tLavg);
+          if(timeB-tBOld!=0) updateLoopUI();
+        }
       }
     }
     mySetCurrentTime(timeA);
@@ -792,6 +793,7 @@ var cancelABLoop=function(){
   tapButton.disabled=false;
   quant.disabled=true;
   quant.checked=false;
+  loopMeas.splice(0);
   toggleQuant(quant, help);
 }
 
@@ -812,16 +814,15 @@ var resetUI=function(){
   beatNormal=0;
   rate=1.0;
   aonly.disabled=false;
-  quant.disabled=true;
-  quant.checked=false;
-  toggleQuant(quant, help);
+  tLavg=tLcount=0;
 }
 
 var onRateChange=function(e){
   rate=myGetPlaybackRate();
   $("#speed").slider("value",rate);
   $("#speed .ui-slider-handle").text(rate);
   loopMeas.splice(0);
+  tLavg=tLcount=0;
   if (beatNormal) {
     tapButton.innerHTML=Math.round(60/beatNormal*rate).toString();
   }
@@ -1102,7 +1103,6 @@ var onPlayerStateChange=function(e, id, ta, tb, s){ //event object, video id loo
         $("#timeInputs").show();
         loopButton.innerHTML="&emsp;";
         loopButton.style.backgroundImage=crossMarkUrl;
-        if(beatNormal) quant.disabled=false;
       }
       vidId=id;
     }
@@ -1111,8 +1111,10 @@ var onPlayerStateChange=function(e, id, ta, tb, s){ //event object, video id loo
         $("#scrub").slider("option", "value", myGetCurrentTimeYT());
       }, 5
     ));
-    if (isTimeASet && isTimeBSet && !loopTimer.length)
+    if (isTimeASet && isTimeBSet && !loopTimer.length){
+      loopMeas.splice(0);
       loopTimer.push(setInterval(onLoopTimerUpdate, 5));
+    }
   }
   else if(e.data==YT.PlayerState.PAUSED){
     while(loopTimer.length) clearInterval(loopTimer.pop());
@@ -1261,7 +1263,6 @@ var onBmkSelectYT=function(i){
   $("#timeInputs").show();
   loopButton.innerHTML="&emsp;";
   loopButton.style.backgroundImage=crossMarkUrl;
-  if(beatNormal) quant.disabled=false;
   annotButton.disabled=false;
   if(ytPlayer.getPlayerState()==YT.PlayerState.PLAYING && !loopTimer.length)
     loopTimer.push(setInterval(onLoopTimerUpdate, 5));
@@ -1288,7 +1289,6 @@ var onLoopDownYT=function(){
         updateLoopUI();
         quant.disabled=(beatNormal ? false : true);
         $("#timeInputs").show();
-        if(beatNormal) quant.disabled=false;
         if(ytPlayer.getPlayerState()==YT.PlayerState.PLAYING && !loopTimer.length)
           loopTimer.push(setInterval(onLoopTimerUpdate, 5));
       }
@@ -1449,7 +1449,6 @@ var onBmkSelectVT=function(i){
   $("#timeInputs").show();
   loopButton.innerHTML="&emsp;";
   loopButton.style.backgroundImage=crossMarkUrl;
-  if(beatNormal) quant.disabled=false;
   annotButton.disabled=false;
   if(!myVideo.paused && !loopTimer.length)
     loopTimer.push(setInterval(onLoopTimerUpdate, 5));
@@ -1514,7 +1513,6 @@ var onLoopDownVT=function(){
         updateLoopUI();
         quant.disabled=(beatNormal ? false : true);
         $("#timeInputs").show();
-        if(beatNormal) quant.disabled=false;
         if(!myVideo.paused && !loopTimer.length)
           loopTimer.push(setInterval(onLoopTimerUpdate, 5));
       }
@@ -1550,7 +1548,6 @@ var toggleIntro=function(t,h){
 
 var toggleQuant=function(t,h){
   myBlur();
-  loopMeas.splice(0);
   if(t.checked){
     if(h.checked) t.title=quantTitleChecked;
   }else{