Geographical Area Time

Setting up a new computer is an opportunity to streamline things that have become a bit klutzy.

That was my case recently.

On the previous computer, a separate desktop had been created for (among other things) clocks for various geographical locations where clients and friends live. Each clock on the desktop was a separate widget. Each widget used CPU resources, especially during loading but also for maintaining the time.

I decided to omit the clocks from my new computer's duties and instead put them on my personal portal page.

The PHP software resulting from that decision is presented further below. Also instructions for implementing it on your own personal portal page (or other page), even if the page is a file on your computer's hard drive.

First, an example output of the Geographical Area Time software:

The time format is customizable. The date is optional. HTML markup may be used.

I'll describe how to do those.

You may publish the local times of as many or as few geographical areas as you want. I'll describe how to do that, too.

But first, another example output:

The software uses geographical areas instead of time zones for determining the correct local time.

Why Not Time Zones?

The base time in any time zone can be calculated when the UTC time is known — UTC (Coordinated Universal Time) is a global time standard.

Calculating the time as an offset from UTC requires knowing the time zone offset (Adelaide and Sydney time differences are 30 minutes, for example). It also requires knowing when (and by how much) various geographical locations will adjust their clocks for Summer Time/Daylight Savings Time.

By naming geographical areas instead of calculating time zone offsets, your server's PHP installation determines the correct time for the named location at the moment it's requested.

Installing Geographical Area Time

Here is the Geographical Area Time PHP software source code. Instructions follow.

<?php
/*
   Geographical Area Time
   Version 1.0
   April 22, 2017

   Will Bontrager Software LLC
   https://www.willmaster.com/
   Copyright 2017 Will Bontrager Software LLC

   This software is provided "AS IS," without 
   any warranty of any kind, without even any 
   implied warranty such as merchantability 
   or fitness for a particular purpose.
   Will Bontrager Software LLC grants 
   you a royalty free license to use or 
   modify this software provided this 
   notice appears on all copies. 
*/

/************************/
/* Begin customization  */
/* Two places to format */

// Place 1 --
// Specify a time format (optionally, include date format) 
//    according to what the PHP date() function requires.
// See this page to generate a format:
//    https://www.willmaster.com/library/generators/date-and-time-formatting.php
// Or construct a format from the table on this page:
//    http://php.net/manual/en/function.date.php

$TimeFormat = "H:i:s (j M)";

// Place 2 --
// Between the two lines containing the word "BOUNDARY", 
//    below these instructions, type the content you wish 
//    to see in the output. Include HTML markup as appropriate. 
//    Use the {{TIME:GEO}} placeholder where the time is to 
//    be inserted. Blank lines are acceptable.
// In the {{TIME:GEO}} placeholder, replace GEO with the 
//    relevant human-readable code for the geographical area. 
//    The exact code can be obtained from: 
//    http://php.net/manual/en/timezones.php
//    (Code examples are "America/Chicago" and "Europe/Zurich")

$TimeZoneList = <<<BOUNDARY

<table border="0" cellpadding="2">
<tr><td><b>UTC</b>-</td>
   <td>{{TIME:UTC}}</td></tr>
<tr><td>Los Angeles-</td>
   <td>{{TIME:America/Los_Angeles}}</td></tr>
<tr><td><span style="color:blue; font-weight:bold;">Chicago</span>-</td>
   <td>{{TIME:America/Chicago}}</td></tr>
<tr><td>New York-</td>
   <td>{{TIME:America/New_York}}</td></tr>
<tr><td>London-</td>
   <td>{{TIME:Europe/London}}</td></tr>
<tr><td>Berlin-</td>
   <td>{{TIME:Europe/Berlin}}</td></tr>
<tr><td>Adelaide-</td>
   <td>{{TIME:Australia/Adelaide}}</td></tr>
<tr><td>Sydney-</td>
   <td>{{TIME:Australia/Sydney}}</td></tr>
</table>

BOUNDARY;

/* End of customization */
/************************/

while( preg_match('/\{\{TIME\:([^\}]+)\}\}/',$TimeZoneList,$match) )
{
   $geo = $match[1];
   date_default_timezone_set($geo);
   $TimeZoneList = preg_replace('/\{\{TIME\:'.preg_quote($geo,'/').'\}\}/',date($TimeFormat),$TimeZoneList);
}
echo $TimeZoneList;
?>

There are two places to customize. Each has instructions, but I'll expand on them here.

Customization Place 1 —

Here is where you specify a time format. The date may also be included.

The time can be published with 12- or 24-hour numbers. The hour may be 1 digit when less than 10 or forced into 2 digits with a leading zero. And there are many more options.

The format in the above source code is "H:i:s (j M)", which is the format used in the first example output in this article.

To exchange the format for your own, the Date and Time Formatting page (at this website) can be used for generating the correct code according to your preferences. Alternatively, a format can be constructed from the list of format characters at the PHP date - Manual page.

If you use the Willmaster.com Date and Time Formatting page to generate the format, get the generated PHP code (not the JavaScript or Perl). Use only the code between double-quote characters in the middle line of the generated code.

In the example generated code image above, "g:i a" is the time format to copy for customizing the Geographical Area Time PHP script. Example:

$TimeFormat = "g:i a";

Customization Place 2 —

Here is where you specify the content to be published, content with the local time of one or more geographical areas embedded.

This second customization place has two phases.

1. Phase One is where you specify the content. It has placeholders for where the time will be published.

2. Phase Two is where the placeholders are updated so the Geographical Area Time software knows which time to publish.

After instructions for the two phases, the content specified for both examples in this article will be addressed.

Phase One

This is where you put the time-related content, with HTML markup, that you want to publish. Use the {{TIME:GEO}} placeholder where the local time will be published.

(It may be convenient to do this part on a separate web page until the content is formatted the way you want it to appear.)

Here is an example:

<div>London: {{TIME:GEO}}</div>
<div style="color:blue;">Chicago: {{TIME:GEO}}</div>

Phase Two

In the {{TIME:GEO}} placeholder, replace GEO with the geographical area you're publishing the time for.

The human-readable code for every available geographical area is obtained from the PHP: List of Supported Time Zones - Manual page and its links.

Only continents and cities are listed, no countries.

Find the content and city within the relevant geographical area. Its human-readable code will be composed of (i) the continent name, (ii) a slash character, and (iii) the city name.

Copy the human-readable code and use it to replace GEO in the content you created in Phase One.

Here is the previous example, GEO replaced with the code for the relevant geographical areas:

<div>London: {{TIME:Europe/London}}</div>
<div style="color:blue;">Chicago: {{TIME:America/Chicago}}</div>

When the geographical time content is ready, paste it into the Geographical Area Time PHP software source code between the lines containing the word BOUNDARY.

The Examples In This Article

The Geographical Area Time PHP software source code contains the time format and the geographical time content of the first example in this article. Here is what it looks like.

$TimeZoneList = <<<BOUNDARY

<table border="0" cellpadding="2">
<tr><td><b>UTC</b>-</td>
   <td>{{TIME:UTC}}</td></tr>
<tr><td>Los Angeles-</td>
   <td>{{TIME:America/Los_Angeles}}</td></tr>
<tr><td><span style="color:blue; font-weight:bold;">Chicago</span>-</td>
   <td>{{TIME:America/Chicago}}</td></tr>
<tr><td>New York-</td>
   <td>{{TIME:America/New_York}}</td></tr>
<tr><td>London-</td>
   <td>{{TIME:Europe/London}}</td></tr>
<tr><td>Berlin-</td>
   <td>{{TIME:Europe/Berlin}}</td></tr>
<tr><td>Adelaide-</td>
   <td>{{TIME:Australia/Adelaide}}</td></tr>
<tr><td>Sydney-</td>
   <td>{{TIME:Australia/Sydney}}</td></tr>
</table>

BOUNDARY;

The geographical time content is a table. For each table row, the first column is the label naming the area the time applies to and the second column is the local time for the area.

And here is the geographical time content for the second example in this article.

$TimeZoneList = <<<BOUNDARY
<div style="display:inline-block; margin:.5em; border:3px solid blue; border-radius:50% 50%; height:7.5em; width:7.5em; padding-top:2.6em; text-align:center; box-sizing:border-box;">{{TIME:UTC}}<br>UTC</div>
<div style="display:inline-block; margin:.5em; border:3px solid blue; border-radius:50% 50%; height:7.5em; width:7.5em; padding-top:2.6em; text-align:center; box-sizing:border-box;">{{TIME:America/Los_Angeles}}<br>Los Angeles</div>
<div style="display:inline-block; margin:.5em; border:3px solid blue; border-radius:50% 50%; height:7.5em; width:7.5em; padding-top:2.6em; text-align:center; box-sizing:border-box;">{{TIME:America/Chicago}}<br>Chicago</div>
<div style="display:inline-block; margin:.5em; border:3px solid blue; border-radius:50% 50%; height:7.5em; width:7.5em; padding-top:2.6em; text-align:center; box-sizing:border-box;">{{TIME:America/New_York}}<br>New York</div>
<div style="display:inline-block; margin:.5em; border:3px solid blue; border-radius:50% 50%; height:7.5em; width:7.5em; padding-top:2.6em; text-align:center; box-sizing:border-box;">{{TIME:Europe/London}}<br>London</div>
<div style="display:inline-block; margin:.5em; border:3px solid blue; border-radius:50% 50%; height:7.5em; width:7.5em; padding-top:2.6em; text-align:center; box-sizing:border-box;">{{TIME:Europe/Berlin}}<br>Berlin</div>
<div style="display:inline-block; margin:.5em; border:3px solid blue; border-radius:50% 50%; height:7.5em; width:7.5em; padding-top:2.6em; text-align:center; box-sizing:border-box;">{{TIME:Australia/Adelaide}}<br>Adelaide</div>
<div style="display:inline-block; margin:.5em; border:3px solid blue; border-radius:50% 50%; height:7.5em; width:7.5em; padding-top:2.6em; text-align:center; box-sizing:border-box;">{{TIME:Australia/Sydney}}<br>Sydney</div>
BOUNDARY;

The time format for the second example is:

$TimeFormat = "g:i:s A";

As you can see, the format and content combinations are virtually unlimited.

Customize the Geographical Area Time script and then upload it to your server anywhere that a PHP script can be accessed with a URL.

Publishing the Geographical Area Time Output

There are two ways Geographical Area Time's output can be published.

1. By pulling in the content from Geographical Area Time with a line of PHP code. (It's how the examples are published.)

2. By pulling the content into an iframe.

For both of these, you'll need to know the URL of the Geographical Area Time PHP script on your server.

Publish With a Line of PHP Code

For PHP web pages, this line of code will publish the time content.

<?php echo(file_get_contents("[URL]")); ?>

Replace [URL] with the URL of Geographical Area Time and you're good to go.

Publish With an Iframe

Here is an example iframe for publishing the time content.

<iframe 
   src="[URL]" 
   style="border:3px solid #ccc; 
      border-radius:1em; 
      padding:.8em 0 0 1em; 
      overflow:auto; 
      width:2.5in; 
      height:2.3in;">
</iframe>

Replace [URL] with the URL of Geographical Area Time. Adjust the iframe size and other CSS as desired. The iframe is then ready.

Publish virtually any combination of time format with geographical locations — all within one short PHP script.

That's Geographical Area Time.

(This article first appeared in Possibilities newsletter.)

Will Bontrager