[JavaScript][PHP] Różnica w odmierzaniu czasu, jak znowelować lub zsynchronizować Opcje

[SmokAnalog]

Praktycznie to samo. To jak brzmi pytanie?

[shpaque]

ponieważ w jednym miejscu - wlasciwie glownym - korzystam z "jquery final countdown", ktory fajnie pracuje sobie i nie chcialbym z niego rezygnować, natomiast w pliku js ma zakodowany pobor daty standardowo js'em i niestety tu nie moge dojsc w koncu jak to zmienic. Moj obecny skrypot wyglada tak:

[HTML] pobierz, plaintext 
<script src="./../js/jquery-3.3.1.min.js"></script>
<script src="./../js/jquery.countdown.min.js"></script>
<script type="text/javascript">
// Obliczamy różnicę między czasem serwera i przeglądarki / systemu
var serverTime = new Date('<?php echo date('c'); ?>');
var systemTime = new Date();
var correction = systemTime - serverTime;
var correctTime = new Date(Date.now() - correction);
 
nextTimeStart = <?php echo isset($nextTest['timeStart']) ? 'new Date("'.date('c', strtotime($nextTest['timeStart'])).'")' : '\'\''; ?>;
currentTimeEnd = <?php echo isset($currentTest['timeEnd']) ? 'new Date("'.date('c', strtotime($currentTest['timeEnd'])).'")' : '\'\''; ?>;
getTest = "<?php echo isset($getTest) ? $getTest : ''; ?>";
getUser = "<?php echo isset($getUser) ? $getUser : ''; ?>";
getInTime = "<?php echo isset($getInTime) ? $getInTime : ''; ?>";
 
if (currentTimeEnd !== '') {countDownTime = currentTimeEnd;}
else {countDownTime = nextTimeStart;}
 
if (nextTimeStart !== '' || currentTimeEnd !== '') {
  $('#days, #hours, #minutes, #seconds').countdown(countDownTime, {precision: 100})
  .on('update.countdown', function(event) {
    if (event.offset.totalHours < 24) {$('#days, #days-th').css('display', 'none');} else {$('#days').html(event.strftime('%D'));}
    if (event.offset.totalMinutes < 60) {$('#hours, #hours-th').css('display', 'none');} else {$('#hours').html(event.strftime('%H'));}
    $('#minutes').html(event.strftime('%M'));
    $('#seconds').html(event.strftime('%S'));
 
    // Opcje dla licznika najbliższego testu
    if (currentTimeEnd === '') {
      if (event.offset.totalSeconds < 300) {
        $('#alert').css({'color': 'var(--dark-grey)', 'background-color': 'var(--yellow)'});
        $('#bloc-time').css('display', 'none');
      }
    }
    // Opcje dla licznika trwającego testu
    else {
      document.title = event.strftime('%H:%M:%S') + ' <?php echo isset($currentTest['title']) ? $currentTest['title'] : ''; ?> / Test OnLine';
 
      if (getTest !== '' && getUser !== '') {
        $('#bloc-button-join').css('display', 'none');
        $('#bloc-time').css('display', 'none');
      }
      else {
        $('#bloc-button-join').css({'display': 'block', 'background-color': 'var(--green);'});
        $('#button-join').html('Dołącz do testu');
        $('#button-join').attr('href', './index.php?t=<?php echo isset($currentTest['id']) ? $currentTest['id'] : ''; ?>&u=<?php echo isset($newUserId) ? $newUserId : ''; ?>');
        $('#bloc-time').css('display', 'block');
      }
 
      if (event.offset.totalSeconds > 300) {
        $('#alert').css({'color': 'var(--white)', 'background': 'var(--green)'});
        if (getTest === '' && getUser === '') {$('#bloc-button-join').css({'display': 'block', 'background': 'var(--green)'});}
      }
      if (event.offset.totalSeconds > 60 && event.offset.totalSeconds < 300) {
        $('#alert').css({'color': 'var(--dark-grey)', 'background-color': 'var(--yellow)'});
        if (getTest === '' && getUser === '') {$('#bloc-button-join').css({'display': 'block', 'background-color': 'var(--yellow)'});}
      }
      if (event.offset.totalSeconds < 60) {
        $('#bloc-button-join').css({'display': 'none', 'background-color': 'var(--rose)'});
        $('#alert').css({'color': 'var(--white)', 'background-color': 'var(--rose)'});
        $('#minutes, #seconds').css('color', 'var(--rose)');
      }
    }
  })
  .on('finish.countdown', function(event) {
    $('#seconds').html(event.strftime('00'));
    if (countDownTime === nextTimeStart) {
      $('#table-title-th').html('Rozpoczyna się test');
      $('#table-head').html('Test rozpoczyna się');
      $('#startTestInfo').html('<strong>Przygotowuję arkusz testowy...</strong>');
    }
    else if (countDownTime === currentTimeEnd) {
      document.title = 'Test zakończony - <?php echo isset($currentTest['title']) ? $currentTest['title'] : ''; ?> / Test OnLine';
      $('#table-title-th').html('Zakończył się test');
      $('#table-head').html('Test zakończony');
      $('#endTestInfo').html('<strong>Obliczam wyniki...</strong>');
    }
 
    if (getTest !== '' && getUser !== '' && getInTime === '1') {setTimeout(function() {window.location.href = './wyniki.php?t=' + getTest + '&u=' + getUser + '&it=1';}, 10000);}
    else {setTimeout(function() {window.location.reload(true);}, 1000);}
  });
}
</script>
[HTML] pobierz, plaintext 

prolem w tym ze plik js ww. api jest zwalony bo nie dziala, dziala tylko js.min. - ktory wiadomo jest tak skondensowany ze ciezko sie polapac: http://hilios.github.io/jQuery.countdown/

[SmokAnalog]

Nie za bardzo mi się chce analizować ten kod. Możesz powiedzieć w skrócie co nie działa?

[shpaque]

po krótce nie wiem jak w pliku api (the final countdown) ustawic zeby tez czas bral juz po zniwelowaniu roznicy czasu serwera i klienta. Tak jak sam sobie to napisalem w swoim skrypcie. Trzymam sie tego api bo sama instrukcja zegara odbierzacza jest duzo prostsza i dziala przede wszystkim po zqatrzymaniu zegara, co w zwyklym js robilo problem i w ogole trzeba bylo 2 razy tyle pisac zeby osiagnbac ten sam efekt...