Java script countdown timer Nan Help pls! [Archive]

krotz

01-06-2012, 11:09 AM

I realy need some help i pass the end_time of the script using ajax from a database then calculate the remaining time calculating the dif from the current time each second. It works for the first second then I get NaN error + the timer then refreshes back to the first output in a countinous loop..

the contents of my timer where the js does its job

<html>
<head>
<script type="text/javascript">
var xmlhttp;
var secs=0;
var mins=0;
var hours=0;
var days=0;
var t;

function loadXMLDoc(url,cfunc)
{
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=cfunc;
xmlhttp.open("GET",url,true);
xmlhttp.send();
}
function myFunction(actionvar)
{
var urlString = getHash();
var string = 'time.php?hash='+urlString+'&action='+actionvar;
loadXMLDoc(string,function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("timer").innerHTML='';
var end_time=xmlhttp.responseText;
end_time = parseInt(end_time);
end_time = end_time*1000;
end_time = parseInt(end_time);
update(end_time);
var t = setTimeout(function(){myFunction(end_time);},1000);

}
});
}

function getHash(){
return document.getElementById('hash').innerHTML;
}

function update(end_time){
out="";
var d=new Date();
end_time = parseInt(end_time);

var time= parseInt(d.getTime());

var amount = end_time - time; // The time left in milliseconds
amount = parseInt(amount);

amount = Math.floor(amount/1000);//kill the "milliseconds" so just secs

days=Math.floor(amount/86400);//days
amount=amount%86400;

hours=Math.floor(amount/3600);//hours
amount=amount%3600;

mins=Math.floor(amount/60);//minutes
amount=amount%60;

secs=Math.floor(amount);//seconds

if(days != 0){out += days +" "+((days==1)?"day":"days")+", ";}
if(hours != 0){out += hours +" "+((hours==1)?"hour":"hours")+", ";}
out += mins +" "+((mins==1)?"min":"mins")+", ";
out += secs +" "+((secs==1)?"sec":"secs")+", ";
out = out.substr(0,out.length-2);

document.getElementById('timer').innerHTML = out;

if(secs == 0 && mins == 0 && hours==0 && days == 0){
clearTimeout(t);
document.getElementById('timer').innerHTML='Boost ready';
}
}

</script>
</head>

<body style='background-image:url("main_bg.jpg");color:#580000'>
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />

<div id='timer' align='center'></div>
<div align='center'>

<?php

require('global.php');

if(!isset($_SESSION['user'])){
header("Location: lol.php");
exit;
}
$id=$_SESSION['id'];
$q= mysql_query("SELECT * FROM loltimerclient WHERE id='$id'");
$row = mysql_fetch_assoc($q);
$hash=$row['hash'];
echo "<div style='visibility:hidden' id='hash'>$hash</div>";
echo '<button type="button" onClick="myFunction(0)">Start timer NOW!</button>';

?>

</div>

<div align='center'><a href='logout.php'>Logout</a></div>

</body>
</html>

And the php that retrieves the time from the database (this file passes its info through ajax to the first code)

<?php

require('global.php');

$hash = $_GET['hash'];
$action = $_GET['action'];
if(!isset($hash)|| !isset($action))
exit;

$search_hash = mysql_query("SELECT * FROM loltimerclient WHERE hash='$hash' LIMIT 0,1");
if(mysql_num_rows($search_hash) < 1)
exit;

$row=mysql_fetch_assoc($search_hash);
$id= $row['id'];

$q = mysql_query("SELECT * FROM loltimers WHERE user_id='$id' LIMIT 0,1 ");

$endtime = time() + (60*60*24);

if($action == 0)
if(mysql_num_rows($q) == 1){
mysql_query("UPDATE loltimers SET end_time='$endtime' WHERE user_id='$id'");
echo $endtime;
}
else{

if(mysql_num_rows($q) < 1){
mysql_query("INSERT INTO loltimers SET user_id='$id', end_time='$endtime' ");
echo $endtime;
}
}
else
if($action == 1){
$row2=mysql_fetch_assoc($q);
echo $row2['end_time'];
}

?>

Any help is greatly appriciated since i can;t seem to figure this out.
Thx in advance!