Auto-refresh HTML at Given Time

I have a page that grabs data from a database and graphs it using flot. (BTW, If you need dynamic graphs or charts on your website and haven’t checked out flot, do it!) The database is populated by a weather station that aggregates data and records a new entry every 30 minutes. So, every hour at 0 and 30 minutes, new data is recorded and the graphs can be updated.

At first, I did a simple refresh of the page every minute to grab the new data. This works, but is annoying when you have scrolled down and are zooming in on a data set. Every minute, the page reloads and you start over.

I realized I know the exact time new data is available, so why not schedule the page reload on that? It’s not perfectly straightforward, but not really difficult after thinking about it for a few minutes. I’m still using the javascript::timeRefresh, but all I need is a way to set its argument dynamically. I’d explain what the code is doing, but I think you can tell. If not, use Google to look up the PHP functions. The only tricks are the logic on the minutes and setting the seconds parameter in mktime() to zero. PHP’s mktime() is a little magical because it handles the rollover of minutes and days for me. Thanks PHP!

<body onload="JavaScript:timedRefresh(
$year = date("Y");
$month = date("m");
$date = date("d");
$hour = date("H");
$minute = date("i");
if ($minute < 30)
    $minute = 30;
    $minute = 60;
echo 1000 * (mktime($hour,$minute,0,$month,$date, $year) - time());

Leave a Reply

Your email address will not be published. Required fields are marked *