Industry guru Dave Taylor answers free tech support questions about a wide variety of business and technical topics, including blogging, Google AdSense, MySpace, Sony PSP, Apple iPod, Mp3 players, management, Linux, SEO, Mac OS X, Facebook, Twitter, LinkedIn and Microsoft Windows.

Can I change my Web page based on time of day?

Dave, I need your help. I'm updating my Web site for The David Lawrence Show and would like to display 'ON THE AIR' between 7p and 10p PT (3a to 6a GMT) Monday through Saturday, and 'OFF THE AIR' the rest of the time. How do I do this? Later, I can easily replace this displayed text with an image tag once I find an on-air light graphic that doesn't look like it's from 1943. :-)


Dave's Answer:

This is a classic situation where you could use a number of different paths to attain the same goal, ranging from a CGI solution to a small server-side include, to a PHP script or, the solution I'll demonstrate here, a JavaScript client-side snippet.

Each has its strengths and weaknesses, and for JavaScript the risk is that some percentage of your viewers will probably have JavaScript disabled in their browsers. Assuming you can live with only about 95% of your visitors knowing if you're on the air at that moment, this should work reasonably well, and it's really easy to add without making any changes on the server.

There's one other potential hiccup in that since JavaScript is client-side, and since it's working with time, there's no way for the script to know if the visitor has their computer clock set wrong. Ah well. Let's assume that's not a big crisis either, shall we?

The first part of this script simply grabs the current time of day then extracts the Universal Time Coordinated (UTC, this used to be called Greenwich Mean Time and then Zulu Time) values for day of week and hour of day. Three simple lines:

var thedate   = new Date();
var dayofweek = thedate.getUTCDay();
var hourofday = thedate.getUTCHours();

I'll also create a simple function that lets you add conditional HTML content anywhere on the page by simply testing if (onAir()):

function onAir()
{
   // return TRUE if it's Mon through Sat, 3a-6a UTC

   if (dayofweek != 0 && 
      ((hourofday > 2 && hourofday < 7))) {
     return true;
   }
   return false;
}

To show how this works, here's an entire HTML page that includes this JavaScript and an example of how to use this new function elsewhere in the page:

<head>
<script type="text/javascript">

var thedate   = new Date();
var dayofweek = thedate.getUTCDay();
var hourofday = thedate.getUTCHours();

function onAir()
{
   // return TRUE if it's Mon through Sat, 3a-6a UTC

   if (dayofweek != 0 && 
      ((hourofday > 2 && hourofday < 7))) {
     return true;
   }
   return false;
}

</script>
</head><body>

<h1>The David Lawrence Show!</h1>

<script type="text/javascript">
if (onAir()) {
  document.write("<h2>ON THE AIR</h2>");
} else {
  document.write("<h2>OFF THE AIR</h2>");
}
</script>

<p>
If you want to learn more about David's show, 
please visit
<a href="http://thedavidlawrenceshow.com/">The 
David Lawrence Show</a>
</p>
</body>
</html>

I'll leave the rest of it in your capable hands, David, and encourage everyone else to pop over to your sites and learn about both of your great radio programs The David Lawrence Show and Online Tonight.



Help others find this article at Del.icio.us, Digg, Netscape, Reddit, and Simpy.

Subscribe!

Never miss another useful Q&A article again! Subscribe to AskDaveTaylor with Google Reader.

Comments

Dave, how could one accomplish this using PHP?

Posted by: Kevin Walter at February 20, 2005 1:30 AM

The PHP version is pretty similar. It makes use of PHP's <a href="http://www.php.net/manual/en/function.date.php">date</a> command.

First, here's the onAir() function in PHP:
<?php
//place this somewhere in your web page before the "On the air" section below
function onAir() {
     //PHP's time() function adds the time zone, so adjust for that
     //(see comments at bottom of http://www.php.net/manual/en/function.time.php )
     $gmtime=time() - date('Z');
     //if today is Sunday, return false
     if(date('w',$gmtime)==0) {
          return FALSE;
     }
     $hour=date('H',$gmtime);
     if($hour> 2 AND $hour< 7) {
          return TRUE;
     }
     return FALSE;
}
?>

Now, you just use the function above to decide whether to display "On Air" or "Off the Air."

<?php
if (onAir()) {
?>
      <h2>ON THE AIR</h2>
<?php
} else {
?>
      <h2>OFF THE AIR</h2>
<?php
}
?>

Posted by: Derek Scruggs at February 20, 2005 4:50 PM

Try ZOPE.
It has based functions that allow you to tell time...

Posted by: Ben Jolitz at March 13, 2005 10:58 PM

I need a script based on the Sabbath times- friday sundown to sat sundown, that will forward to a certian page I specify to say temp closed due to sabbath.

Here are the times for sundown in my area.

7 Oct 6:27
12 Oct 6:17
14 Oct 6:14
17 Oct 6:09
21 Oct 6:02
24 Oct 5:57
28 Oct 5:51
4 Nov 4:41
11 Nov 4:32
18 Nov 4:25
25 Nov 4:19
2 Dec 4:16
9 Dec 4:14
16 Dec 4:15
23 Dec 4:18
30 Dec 4:22
6 Jan 4:29
13 Jan 4:37
20 Jan 4:46
27 Jan 4:56
3 Feb 5:06
10 Feb 5:16
17 Feb 5:26


24 Feb 5:36
3 Mar 5:45
10 Mar 5:54
17 Mar 6:04
24 Mar 6:13
31 Mar 6:22
7 Apr 7:30
12 Apr 7:37
14 Apr 7:39
18 Apr 7:44
21 Apr 7:48
28 Apr 7:57
5 May 8:05
12 May 8:14
19 May 8:22
26 May 8:29
1 Jun 8:35
2 Jun 8:36
9 Jun 8:41
16 Jun 8:45
23 Jun 8:46
30 Jun 8:47
7 Jul 8:45
14 Jul 8:41
21 Jul 8:35
28 Jul 8:28
4 Aug 8:20
11 Aug 8:10
18 Aug 7:59
25 Aug 7:47
1 Sep 7:34
8 Sep 7:21
15 Sep 7:08
22 Sep 6:55

Posted by: Thomas Strand at February 21, 2006 4:09 PM

Perfect! Thanks this HTML example does exactly what I needed!
Erny

Posted by: Vertaalbureau at April 19, 2007 1:04 AM

Hello great script, but how do i make it show a particular graphic instead of saying 'on air' eg, I want to add a graphic on a web page that changes as per certain times of the day to a different graphic in the same position and will change back once the time changes..

Paul

Posted by: Paul at December 14, 2007 3:44 AM

I have a lot to say, but ...
Starbucks coffee cup I have a lot to say, and questions of my own for that matter, but most of all I'd like to say thank you for all your efforts on this Web site by buying you a chai!

I do have a comment, now that you mention it!









Remember personal info?


Please note that I will never send you any unsolicited commercial email. Ever.

While I'm at it, please note that by submitting a question or comment you're agreeing to my terms of service, which are: you relinquish any subsequent rights of ownership to your material by submitting it on this site.









Search
Find just the answers you seek from among our 1700+ free tech support articles by using our Lijit search engine.


Help!





Subscribe to
Ask Dave Taylor!

Add to Google Reader
Add to My Yahoo!
Subscribe in NewsGator Online

RDF   XML

Free Updates!
Sign up and get free weekly updates and special offers on books, seminars, workshops and more.


Recent Entries
Join the List!
Join my author info mailing list, where you'll learn about my upcoming books, speaking gigs, and more!


Book Links
© 2002 - 2008 by Dave Taylor. All Rights Reserved.

Note: This web site is for the purpose of disseminating information for educational purposes, free of charge, for the benefit of all visitors. We take great care to provide quality information. However, we do not guarantee, and accept no legal liability whatsoever arising from or connected to, the accuracy, reliability, currency or completeness of any material contained on this web site or on any linked site.

[whiteboard marker tray]