Search code examples
javascriptphpflipclock

FlipClock - Use servertime instead of clienttime


I'm trying to get a eventmonitor on 7 different Raspberry Pis. They're all getting the same webpage with a FlipClock loaded.

My problem is: the time on the RasPis differs. (They can't get the actual ptb-time, because they are not allowed to connect to the internet)

This is how I called the Flipclock:

  <script type="text/javascript">
var clock = $('.clock').FlipClock({
  clockFace: 'TwentyFourHourClock',
  showSeconds: false
});

I thought I could solve the problem, if I get the actual date via PHP and set it while loading the FlipClock like this:

clock.setTime($servertime);

But I can't get this to work..

I'm quite new to this, so yeah, if anyone knows, how to solve it, please help me :(

EDIT: This is how my new call looks like:

     <div class="clock"></div>
  <script type="text/javascript">
   var serverTime = <?= time() ?>;
   var timeDifference = new Date - serverTime;
   var clock = $('.clock').FlipClock(timeDifference,{
      clockFace: 'TwentyFourHourClock',
      showSeconds: false
    });
  </script>

But this keeps my clock going strange, every refresh it takes a different hour and minute.


Solution

  • This thread helped me... But I finally managed to do it another way, which I think is simplier:

    var serverTime = '<?php echo Date('H:i:s'); ?>';
    var clock = $('#clock').FlipClock(serverTime,{
      clockFace: 'TwentyFourHourClock',
    });