I just wrote another question but It was not well writed and understandable at all, here I'll paste the work I've done atm, and my questions:
-I do need the SERVER time, because I need to to a countdown, everyday, the same, from 19:00PM to 03:00AM.
Here's the code I have until now (I just translated it, Cause it was in spanish, so it should be running fine")
<script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script type="text/javascript">
//Variables
var date1;
var seconds;
var minutes;
var hours;
var x;
var startHour = 19;
var finalHour = 3;
var diferencia1;
//Funcion principal
x = $(document);
x.ready(timer_test);
//funcion del timer_test
function timer_test() {
x= $("#timer");
date1 = new Date(<?php echo time() * 1000 ?>);
seconds = date1.getSeconds();
minutes = date1.getMinutes();
hours = date1.getHours();
if (hours > startHour | hours < finalHour) {
diferencehours = startHour - hours -1;
diferenceminutes = 60 - minutes -1;
diferenceseconds = 60 - seconds;
x.html("All of our services are running.");
}
else if(hours < startHour && hours >= finalHour) {
diferencehours = startHour - hours -1;
diferenceminutes = 60 - minutes -1;
diferenceseconds = 60 - seconds;
x.html(diferencehours + ":" + diferenceminutes + ":" + diferenceseconds);
}
}
//Interval
setInterval(timer_test,1000);
</script>
<div id="timer"></div>
One of the problems I found, is, the clock is just stucked, time doesn't change at all.
Solutions? How may I improve this?
Thanks
The code <?php echo time() * 1000 ?> will only run once, when the page is served by php. It will not update this from the server every time we see the code.
Try something like this:
<script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script type="text/javascript">
//Variables
var epoch_time = <?= time() ?>000;
var startHour = 19;
var finalHour = 3;
//Funcion principal
function timer_test() {
var date1 = new Date(epoch_time);
var seconds = date1.getSeconds();
var minutes = date1.getMinutes();
var hours = date1.getHours();
var diferencehours = startHour - hours -1;
var diferenceminutes = 60 - minutes -1;
var diferenceseconds = 60 - seconds;
if (hours > startHour | hours < finalHour) {
$("#timer").html("All of our services are running.");
}
else if(hours < startHour && hours >= finalHour) {
$("#timer").html(diferencehours + ":" + diferenceminutes + ":" + diferenceseconds);
}
epoch_time += 1000;
}
$(function() {
//Interval
setInterval(timer_test,1000);
});
</script>
<div id="timer"></div>
Not sure where to begin, could use a lot of cleanup:
<script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script type="text/javascript">
var serverTime = <?php print time()?>;
var tracking = {start:19,end:3};
tracking.timer = setInterval(function () {
var now = new Date(serverTime);
var seconds = now.getSeconds();
var minutes = now.getMinutes();
var hours = now.getHours();
if (hours > tracking.start || hours < tracking.end) {
$("#timer").html("All of our services are running.");
} else {
var remainHours = tracking.start - hours -1;
var remMinutes = 60 - minutes -1;
var remSeconds = 60 - seconds;
$("#timer").html(remainHours + ":" + remMinutes + ":" + remSeconds);
}
serverTime+=1000;
},1000);
</script>
tl;dr: You need to increment the server time with each tick.