version 2.0 (c) 2006 Edward H. Trager. Last updated:2006.01.04.et

Introduction

Features

• Easy to Implement. The calendar component is inserted into an XHTML document using a single div:

  <div id="calendar" ></div>

  The showCalendar method is then simply assigned to the onClick event handler of one or more elements in your document. Dates selected in the calendar are transferred to whatever target ID you specify:

  onclick="showCalendar('targetDateField');"

• Fast. Javascript manipulation of the CSS display and positioning properties makes the calendar "pop up" seamlessly within your XHTML document. When supported by the browser, the opacity property is used to make the calendar fade in or out. The result is both faster and more appealing than a traditional popup window approach and it works without altering popup blocker settings.
• 

  Gladiator calendar for February, 1847, with Thomas Alva Edison's birthday highlighted.

  Accurate representation of the Gregorian Calendar (1, 2) from the year 1582 onward. The calendar has been specifically designed to handle both recent and historical dates. The calendar was originally developed for use in a web-based human pedigree data management application that required the ability to record dates in families stretching back many generations.

  Note: Almost all other web calendar and date components fail on dates prior to 1900. Some even fail on dates prior to 1970.

  Note: Only the Catholic countries in Europe adopted the Gregorian calendar immediately. Other countries adopted it much later. For example, both England and the American colonies did not adopt it until the middle of the 18th century. Countries such as Thailand did not adopt the international calendar until the late 19th century. Keep this in mind if your application requires historical dates.

• 

  Holidays and events can be retrieved from RSS-style XML feeds. Here the American Fourth of July is highlighted in the default holiday style while the french national day is highlighted using a CSS class featuring a flag background image.

  New! Ability to load holiday and event dates from RSS-style XML feeds. The calendar now supports loading one or more RSS-style XML holiday and event date files using asynchronous javascript and XML ( AJAX) technology. For example, you might want to show both national and school holidays on the calendar, where school holidays are derived from one XML feed, and national holidays from a different XML feed.

  The format of the XML file is very simple and can be easily generated by database and scripting engines:

  <entry>
   <title>Fête de la Victoire 1945</title>
   <date>2005-05-08</date>
   <class>french</class>
  </entry>

  The title and date tags are mandatory, while the optional class tag allows you to specify a special CSS class for displaying events with customized highlighting or colors.

  Note: Most browsers implement default security policies that require that the XML feeds come from the same domain as the web page which is requesting the data.

• 

  Five decades of years pop-up to streamline year selection.

  New! Quick decade pop-ups insure that users can quickly pick any year up to 50 years in the past or future without having to scroll through long drop-down lists.
• Localization in 12 languages (Arabic, German, Greek, English, Spanish, French, Italian, Japanese, Portugese, Russian, Thai, and Chinese). A call to setLocale() is all that is required to switch languages. You can even have multiple calendars with different locales on a single web page.
• 

  Localization includes localized digits and right-to-left layouts where appropriate. The Arabic localization is shown here.

  Support for localized digits (such as Arabic and Thai digits) and for right-to-left layouts (as for Arabic) is built in, making it easy to extend the calendar for use in almost any locale.
• Accurate representation of a proleptic calendar for the years from 4713 BCE until 1582. A proleptic calendar is the projection of a calendar (Gregorian, Julian, or otherwise) into the past prior to it's actual historical use. Very few applications will ever need dates prior to 1582, but the functionality is there if you need it.
• Round-trip conversion between Julian day numbers and Julian/Gregorian dates. The calendar adopts an algorithm presented in Press et. al., Numerical Recipes in C (Cambridge University Press) (3,4) to calculate Julian day numbers. From Julian day numbers, it is trivial to calculate the day of the week on which any month in any year started.
• CSS-based Styling. All graphic styling is accomplished via W3C CSS. What Christopher Schmitt (in this book) terms "HTML terrorism" is avoided entirely. The use of CSS simplifies the code, leading to faster rendering of the calendar component.
• Simple-to-follow Code. The code has been written so that you can read and understand it. It has not been obfuscated. Extensive use has been made of modern CSS and DOM-based Javascript to keep the code clean and simple.
• W3C Compliant. The calendar has been validated against the World Wide Web Consortium's CSS and XHTML validators.
• Unicode Compliant. The calendar uses the UTF-8 Unicode character encoding thus providing support for all the world's major scripts and many of the world's minority and historical scripts. Localization in any additional languages requires nothing more than a Unicode-capable editor.
• Seasonal Picture Support. The calendar can now display a different background picture for every month of the year. Alternatively, a smaller number of background pictures may be used to represent important seasons throughout the year.

  Note: The calendar is distributed with just four background images representing temperate zone seasons: winter, spring, summer, and fall.

Try it!