I am busy writing an countup timer for one of our office dashboards which counts the time since the last incident / reset.
I have a page where one of the senior admins can input a new timestamp which then updates a table in the database with the timestamp, my next page (the one i am having issues with) connects to the database, collects the data (via php) stores it in a variable. i then export the variable via json and grab it as the incident date in my count up script.
However when i run this it shows the wrong count standard 16534 days for every date inputted.
below is my code. can you help by telling me what i did wrong:
<html>
<head>
<style>
#countup p {
display: inline-block;
padding: 5px;
background: transparent;
margin: 0 0 20px;
font-family: sans-serif;
font-size: 57px;
}
</style>
<title>Days Without Incident</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>
<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<?php
$servername = "10.32.6.151";
$username = "server";
$password = "";
$dbname = "incident-counter";
$conn = new mysqli($servername, $username, $password, $dbname);
if ($conn->connect_error) {
die("Connection Failed : ". $conn->connect_error);
}
$sql = "SELECT * FROM counter";
$result = $conn->query($sql);
if ($result->num_rows > 0) {
// output data of each row
while($row = $result->fetch_assoc()) {
}
} else {
echo "0 results";
}
?>
<script>
var counter1 = <?php echo json_encode($row[date]) ?>
window.onload=function() {
// Month,Day,Year,Hour,Minute,Second
upTime(counter1); // ****** Change this line!
}
function upTime(countTo) {
now = new Date();
countTo = new Date(countTo);
difference = (now-countTo);
days=Math.floor(difference/(60*60*1000*24)*1);
hours=Math.floor((difference%(60*60*1000*24))/(60*60*1000)*1);
mins=Math.floor(((difference%(60*60*1000*24))%(60*60*1000))/(60*1000)*1);
secs=Math.floor((((difference%(60*60*1000*24))%(60*60*1000))%(60*1000))/1000*1);
document.getElementById('days').firstChild.nodeValue = days;
document.getElementById('hours').firstChild.nodeValue = hours;
document.getElementById('minutes').firstChild.nodeValue = mins;
document.getElementById('seconds').firstChild.nodeValue = secs;
clearTimeout(upTime.to);
upTime.to=setTimeout(function(){ upTime(countTo); },1000);
}
</script>
<!-- Save for Web Slices (Untitled-1) -->
<table id="Table_01" width="1920" height="1080" border="0" cellpadding="0" cellspacing="0">
<tr>
<td colspan="3">
<img src="images/incident_01.png" width="1920" height="588" alt=""></td>
</tr>
<tr>
<td rowspan="2">
<img src="images/incident_02.png" width="614" height="492" alt=""></td>
<td background="images/incident_03.png"><div id="countup" align="center">
<p id="days">00</p>
<p class="timeRefDays">days</p><br />
<p id="hours">00</p>
<p class="timeRefHours">hours</p><br />
<p id="minutes">00</p>
<p class="timeRefMinutes">minutes</p><br />
<p id="seconds">00</p>
<p class="timeRefSeconds">seconds</p><br />
</div>
<!--<img src="images/incident_03.png" width="1220" height="388" alt="">--></td>
<td rowspan="2">
<img src="images/incident_04.png" width="86" height="492" alt=""></td>
</tr>
<tr>
<td>
<img src="images/incident_05.png" width="1220" height="104" alt=""></td>
</tr>
</table>
<!-- End Save for Web Slices -->
<?php $conn->close(); ?>
</body>
</html>
