PHP and Javascript view timer

I am trying to write a JS count timer (which will just count to infinity) based on a PHP variable. The variable, unfortunately, cannot be changed (it can do something with it as soon as I receive it, but I can’t change the form of what I get, because it comes from the database software, and I can’t change the software ) All I get is seconds (how many seconds ago the user received something, etc.) and I would like it to be displayed in the format (X days, X hours, X minutes, X seconds).

I already have the code for the timer and the PHP code, however the question is what will be the best approach to the solution. I am trying to get the seconds in a date in PHP, and then let JS do the rest or change JS so that it takes seconds and then does the countdown. Like me, how would I do that?

Code for counter:

JS inside the document by passing variables so that PHP can easily change them:

<script type="text/javascript" language="JavaScript"> TargetDate = "09/21/2012 5:00"; CountActive = true; </script> 

and then (including the entire counter code):

 <script type="text/javascript" language="JavaScript" src="js/time.js"></script> 

And the .js file as above:

 function calcage(secs, num1, num2) { s = ((Math.floor(secs/num1))%num2).toString(); if (LeadingZero && s.length < 2) s = "0" + s; return s; } function CountBack(secs) { if (secs < 0) { document.getElementById("cntdwn").innerHTML = FinishMessage; return; } DisplayStr = DisplayFormat.replace(/%%D%%/g, calcage(secs,86400,100000)); DisplayStr = DisplayStr.replace(/%%H%%/g, calcage(secs,3600,24)); DisplayStr = DisplayStr.replace(/%%M%%/g, calcage(secs,60,60)); DisplayStr = DisplayStr.replace(/%%S%%/g, calcage(secs,1,60)); document.getElementById("cntdwn").innerHTML = DisplayStr; if (CountActive) setTimeout("CountBack(" + (secs+CountStepper) + ")", SetTimeOutPeriod); } function putspan(backcolor, forecolor) { document.write("<span id='cntdwn'></span>"); } if (typeof(BackColor)=="undefined") BackColor = "white"; if (typeof(ForeColor)=="undefined") ForeColor= "#2A8827"; if (typeof(TargetDate)=="undefined") TargetDate = "12/31/2020 5:00 AM"; if (typeof(DisplayFormat)=="undefined") DisplayFormat = "%%D%% days, %%H%% hours, %%M%% minutes, %%S%% seconds."; if (typeof(CountActive)=="undefined") CountActive = true; if (typeof(FinishMessage)=="undefined") FinishMessage = "no data"; if (typeof(CountStepper)!="number") CountStepper = +1; if (typeof(LeadingZero)=="undefined") LeadingZero = true; CountStepper = Math.ceil(CountStepper); if (CountStepper == 0) CountActive = false; var SetTimeOutPeriod = (Math.abs(CountStepper)-1)*1000 + 1000; putspan(BackColor, ForeColor); var dthen = new Date(TargetDate); var dnow = new Date(); if(CountStepper>0) ddiff = new Date(dnow-dthen); else ddiff = new Date(dthen-dnow); gsecs = Math.floor(ddiff.valueOf()/1000); CountBack(gsecs); 
+4
source share
1 answer

As stated in the comments, I used PHP. In the end, to him:

Getting the value from the database and saving it for $ uptime (in the form of seconds).

 $uptime = (time() - $uptime); $uptime = date("m/d/YH:i:s",$uptime); 

Then I changed it using the date function to match the JS code and output it with the new $ uptime variable:

 <script type="text/javascript" language="JavaScript"> TargetDate = "<?php echo $uptime; ?>"; CountActive = true; </script> <script type="text/javascript" language="JavaScript" src="js/time.js"></script> 

This ensured that the date is displayed in the correct format suitable for JS.

+1
source

Source: https://habr.com/ru/post/1440525/


All Articles