CODEWITHSUNDEEP
javascriptphphtml
shane
shane

Reputation: 1

PHP/ Javascript Countdown Timer Script

I have IRC channel's stats web page which updates every 15 minutes.
I want to display live countdown on web page that links in with my server unix time and goes from 15:00 minutes down to 00:00 and then starts again at 15:00 minutes.
If the web page is refreshed, the timer must not refresh back to 15:00.

I have searched on internet & tried so many scripts but only found countdown's that count to a particular date in the future .
then found the followin solution but I am getting error "Uncaught SyntaxError: Unexpected token < "

How do I fix this error or is there any other script/way?
I would really appreciate it if someone help me out, thank you.
P.S: I am sorry if I made any mistake as this is my first post on stackoverflow.

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
   "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
#time {
 }
</style>

<? 
$currenttime = time(); 
$mins = date('i', (15 * 60) - ($currenttime % (15 * 60))); 
$secs = date('s', (15 * 60) - ($currenttime % (15 * 60)));
$usercount = date('i:s', (15 * 60) - ($currenttime % (15 * 60)));
?>
<script type="text/javascript">
var m = <? echo "$mins"; ?> ;
var s = <? echo "$secs"; ?> ;
window.onload=function() {
   fifteenMinutes();
 }
function fifteenMinutes(){
   s--;
if(s<0) {
   s=59;
   m--;
 }
if(m==-1) {
   m=14; #
 }
if(m<10) {
   mins='0'+m;
 }
else {
   mins=m;
 }
if(s<10) {
   secs='0'+s;
 }
else {
   secs=s;
 }
   document.getElementById('time').firstChild.nodeValue=mins+':'+secs;
   cd=setTimeout('fifteenMinutes()',1000);
}
</script>
</head>
<body>
<div id="time"> <? echo "$usercount"; ?>
</body>
</html>

Upvotes: 0

Views: 2434

Answers (2)

Adrian Brand
Adrian Brand

Reputation: 21638

Here is a simple count down from 15 minutes.

function tick(time) {
  setTimeout(() => {
    const newTime = new Date();
    const diff = Math.floor((newTime.getTime() - time.getTime()) / 1000);
    const timeFrom15 = (15 * 60) - diff; 
    const secs = timeFrom15 % 60;
    const mins = ((timeFrom15 - secs) / 60);
    document.getElementById('time').innerText = `${mins}:${secs < 10 ? '0' : ''}${secs}`;
    if (secs >= 0) {
      tick(time);
    } else {
      document.getElementById('time').innerText = '0:00';
    }
  }, 1000);
}

tick(new Date());
<div id="time"></div>

Upvotes: 1

Frish
Frish

Reputation: 1421

This is not valid javascript, which is why you are getting a syntax error:

var m = <? echo "$mins"; ?> ;
var s = <? echo "$secs"; ?> ;

Neither is this (remove the #):

m=14; #

Instead, use <?php, like so:

var m = <?php echo "$mins"; ?> ;
var s = <?php echo "$secs"; ?> ;

Upvotes: 0

Related Questions