Jak sprawić, by zegar łaskotał się co sekundę i skakał, gdy wideo jest przekazywane lub przewijane?

Question

Próbuję zrobić zegar, który pośrednio synchronizuje się z wideo. Po kliknięciu starttimer powinien uruchomić mój zegar i łaskotać co sekundę.

Oto proces:

1. Start the video 
2. At a certain time in video, click to start the timer 
3. Timer starts from 00:00:00 and should tickle each second. 
4. If the video is forwarded by `n` seconds timer should be 'timer+n` seconds. Same for the case, when video is rewinded - `timer-n' 

Ale mój zegar nie działa prawidłowo. Działa to dobrze, kiedy uruchamiam timer, ale kiedy przesuwalam o n sekund, czasami przechodzi on przez n, a czasami przez n+1 lub n+2, a kiedy przewijam do tyłu przez n, cofa się do własnej woli.

Po prostu nie mogę poprawnie odczytać logiki.

Wywoływana gdy starttimer kliknięciu: (Zaczyna zegara od 00:00:00)

var mtimer = 0; 
$('#starttimer').click(function() { // Starts the clock 
           playing = true; 

           if(!timerstarted) { 
            setInterval(function() { 
            if(playing) {            
              mtimer++; 
             $('#starttimer').html(getHHMMSS(mtimer)); 
            } 
             } , 1000); 
            timerstarted = true; 
           } 
          }); 

Kiedy film jest przekazywane lub przewijana (Mam też kontrolę, w którym mógłbym przesunąć film do przodu przez 3 sekundy, lub z powrotem od 3 sekund po naciśnięciu przesunięcie + R i przesunięcie + l i. nadzieję, że odpowiada seeking)

var lastCurrentTime = 0; 
$('#match').on('seeking',function(event) { 
            var difference = 0; 
            var newCurrentTime = $('#match').get(0).currentTime; 
            if(newCurrentTime > lastCurrentTime) { 
             difference = newCurrentTime - lastCurrentTime; 
              playing = false; 
              mtimer = mtimer + difference; 
              $('#starttimer').html(getHHMMSS(mtimer)); 
              playing = true; 
            }else { 
             difference = lastCurrentTime - newCurrentTime; 

              playing = false; 
              mtimer = mtimer - difference; 
              console.log("Difference : " + difference); 
              playing = true; 

             if(mtimer <= 0) { 
              mtimer = 0; 
              $('#starttimer').html(getHHMMSS(mtimer)); 
             } 
            } 
       lastCurrentTime = newCurrentTime; 

      }); 

Answer 1

1. Ustaw offfset
2. Zastosowanie offsetu dla ruchu mtimer iz powrotem
3. clearInterval przy poszukiwaniu

starttimer funkcja:

$('#starttimer').click(function() { // Starts the clock 
           playing = true; 

           if(!timerstarted) { 
            offset = $('#match').get(0).currentTime; 
            timerv = setInterval(function() { 
             var newCurrentTime = $('#match').get(0).currentTime; 


            if(playing) {            
              mtimer++; 
             $('#starttimer').html(getHHMMSS(mtimer)); 
            }                    

              //$('#starttimer').html(getHHMMSS(mtimer)); 
             } , 1000); 
            timerstarted = true; 
           } 
          }); 

seeking funkcja:

$('#match').on('seeking',function(event) { 
            playing = true; 
            if(timerstarted) { 
             clearInterval(timerv); 
             var newCurrentTime = $('#match').get(0).currentTime; 
             mtimer = newCurrentTime - offset; 
             if(mtimer < 0) { 
                mtimer = 0; 
                offset = 0; 
                $('#starttimer').html(getHHMMSS(mtimer)); 
                console.log("playing : " + playing); 
             } 
             timerv = setInterval(function() {          
              if(playing) { 
                console.log("Inside playing..."); 
                mtimer++; 
               $('#starttimer').html(getHHMMSS(mtimer)); 
              }                    
               /*if(playing) { 
                if(timerset === true && $('#timeentered').val() !== '') { 
                 mtimer = $('#timeentered').val(); 
                 timerset = false; 
                } 
                mtimer++; 
               }*/ 
               //$('#starttimer').html(getHHMMSS(mtimer)); 
              } , 1000); 
             lastCurrentTime = newCurrentTime; 
            } 
      }); 

Answer 2

trzeba zsynchronizować dwie zmienne programator przy uruchamiasz stoper. Zmienna mtimer rozpoczyna odliczanie sekund po uruchomieniu timera, ale lastCurrentTime jest ustawiona na zero do pierwszego "wyszukiwania" wideo w jednym lub drugim kierunku. To spowoduje wyłączenie timingu.

Załóżmy, że włączasz minutnik do filmu. Po obejrzeniu filmu przez minutę, mtimer jest na 60 sekund, zegar wideo jest na 120 sekund, a lastCurrentTime jest nadal na zero. Gdybym toczyć materiał wideo przez 90 sekund, mtimer powinien iść ujemna przez trzydzieści sekund, ale opiera się na kodzie, mtimer zostanie ustawiony na pozytywną 30.

Spróbuj tego:

var mtimer = 0; 
var lastCurrentTime = 0; 
$('#starttimer').click(function() { // Starts the clock 
          playing = true; 

          if(!timerstarted) { 

           //Set the timer before starting the interval 
           //Gives you one second with the timer at zero before the first interval runs 
           $('#starttimer').html(getHHMMSS(mtimer)); 

           //Set lastCurrentTime to the video time. 
           lastCurrentTime = $('#match').get(0).currentTime; 
           setInterval(function() { 
            if(playing) {            
             //Keeps both timers synched as the movie plays. 
             mtimer++; 
             lastCurrentTime++; 
             $('#starttimer').html(getHHMMSS(mtimer)); 
           } 
            } , 1000); 
           timerstarted = true; 
          } 
         }); 

Teraz swoje funkcja wyszukiwania bieżącego powinna działać. Jeśli wartość newCurrentTime jest większa niż lastCurrentTime, mtimer zostanie powiększona o różnicę. Jeśli jest odwrotnie, to mtimer zostanie zmniejszona o różnicę. W przypadku, o którym wspomniałem powyżej, gdy mtimer powinien był przejść ujemny o trzydzieści sekund, mtimer zostanie ustawiony na zero. W oparciu o twój kod zakładam, że chcesz zresetować timer, jeśli mtimer idzie poniżej zera.

Mam nadzieję, że pasuje to do Twoich potrzeb.