Copyright Year Range For Static XHTML Pages

UPDATE (June 22/14): The conditional Server Side Includes in this code no longer appear to work on GoDaddy. Some permission may have been changed on their server…

This simplified code does work for XHTML-Transitional, however:

<div id="copyright">© Chou Seh-fu <script src="javascript/copyrightYearRange.js" type="text/javascript" ></script><script>printCopyrightYears(2012);</script><noscript>

	<!--#config timefmt="%Y" -->
	<!--#set var="startYear" value="2012" -->
	<!--#echo var="startYear" -->-<!--#echo var="DATE_LOCAL" -->.
	</noscript>  All Rights Reserved.
</div>

The previous post showed how the current year could be added to a copyright notice for a static XHTML page. However, if the XHTML file creation year is the same as the current year, then undesirable output like the following may be obtained:

© Chou Seh-fu 2013-2013. All Rights Reserved.

This post will describe how to better automate the JavaScript and Server-Side Includes (SSI) to avoid this.

I. The JavaScript

The XHTML file copyright code† was changed slightly. It now calls a new JavaScript file, copyrightYearRange.js in the site’s javascript directory:

<div id="copyright">© Chou Seh-fu <script src="javascript/copyrightYearRange.js" type="text/javascript" ></script><script>printCopyrightYears(fileCreationYear);</script>  All Rights Reserved.</div>

After copyrightYearRange.js is called, a second set of <script> tags calls the printCopyrightYears() function, and feeds the XHTML file’s creation year into this function.

For example, if the static XHTML file was created in 2010, the code would look like this:

<div id="copyright">© Chou Seh-fu <script src="javascript/copyrightYearRange.js" type="text/javascript" ></script><script>printCopyrightYears(2010);</script>  All Rights Reserved.</div>

The JavaScript in the copyrightYearRange.js file consists of the following code:

var startingYear;

function printCopyrightYears(startingYear){
   var currentDate = new Date();
   var currentYear = currentDate.getFullYear();

   if (startingYear == currentYear){
      //Print the copyright as a single year (eg: "© Chou Seh-fu 2013...")
      document.write(startingYear + ".");
   }
   else{
      //Print the copyright as a range of years (eg: "© Chou Seh-fu 2010-2013...")
      document.write(startingYear + "-" + currentYear + ".");
   }
}

Here, the XHTML file’s year-of-creation is fed into the printCopyrightYears() function via the dummy variable startingYear. Next, the current year is generated, and compared to the year-of-creation. If the two are the same, the following copyright information is obtained:

© Chou Seh-fu 2013. All Rights Reserved.

On the other hand, if the current year and the file’s year-of-creation differ, the copyright information is printed in range format:

© Chou Seh-fu 2010-2013. All Rights Reserved.

II. Server-Side Include‡ Code (displayed in cases where JavaScript is disabled)

This was tricky, due to my unfamiliarity with SSI code. A webpage at  The University of Pennsylvania Computing helped me arrive at something that worked:

<div id="copyright">© Chou Seh-fu <script src="javascript/copyrightYearRange.js" type="text/javascript" ></script><script>printCopyrightYears(2010);</script><noscript>

      <!--#config timefmt="%Y" -->
      <!--#set var="CURRENTYEAR" value=$DATE_LOCAL -->
      <!--#if expr="$CURRENTYEAR = /2010/" -->
         <!--#echo var="CURRENTYEAR" -->
      <!--#else -->
         2010-<!--#echo var="CURRENTYEAR" -->
      <!--#endif -->

   </noscript>.  All Rights Reserved.
</div>

In this code, a variable called CURRENTYEAR is initialized and set to the current year. After that, it follows much the same logic as the JavaScript code (though of course, the syntax is quite different).

Nonetheless, this solution was somewhat dissatisfying, since the webmaster was required to remember to set the year-of-creation three times (once in the JavaScript function call, and twice in the SSI).

FortBoise.org provided the basis for the final code:

<div id="copyright">© Chou Seh-fu <script src="javascript/copyrightYearRange.js" type="text/javascript" ></script><script>printCopyrightYears(fileCreationYear);</script><noscript>

      <!--#config timefmt="%Y" -->
      <!--#set var="startYear" value="fileCreationYear" -->
      <!--#if expr="${DATE_LOCAL} = ${startYear}" -->
         <!--#echo var="DATE_LOCAL" -->.
      <!--#else -->
         <!--#echo var="startYear" -->-<!--#echo var="DATE_LOCAL" -->.
      <!--#endif -->
   </noscript>  All Rights Reserved.
</div>

Worth noting is the conditional statement <!--#if expr="${DATE_LOCAL} = ${startYear}"-->; getting the syntax correct for this line took a very long time. In the end, it was helpful to be aware that “this is a string comparison, not a numeric comparison”.

This final SSI code requires the webmaster to set the year-of-creation only twice. Thus, for example, if the XHTML file’s year-of-creation was 2012, the code would read as follows:

<div id="copyright">© Chou Seh-fu <script src="javascript/copyrightYearRange.js" type="text/javascript" ></script><script>printCopyrightYears(2012);</script><noscript>

	<!--#config timefmt="%Y" -->
	<!--#set var="startYear" value="2012" -->
	<!--#if expr="${DATE_LOCAL} = ${startYear}" -->
		<!--#echo var="DATE_LOCAL" -->.
	<!--#else -->
		<!--#echo var="startYear" -->-<!--#echo var="DATE_LOCAL" -->.
	<!--#endif -->
	</noscript>  All Rights Reserved.
</div>

POSTSCRIPT: After some testing, it appears that caching is not a problem for the SSI code.

In that case, it is probably unnecessary for webmasters to use both JavaScript and SSI for generating copyright notices (SSI is probably preferable, given that it is viewable by everyone).

In the interests of completeness then, this is what the code would look like just using SSI:

<div id="copyright">© Chou Seh-fu 

	<!--#config timefmt="%Y" -->
	<!--#set var="startYear" value="fileCreationYear" -->
	<!--#if expr="${DATE_LOCAL} = ${startYear}" -->
		<!--#echo var="DATE_LOCAL" -->.
	<!--#else -->
		<!--#echo var="startYear" -->-<!--#echo var="DATE_LOCAL" -->.
	<!--#endif -->
	All Rights Reserved.
</div>

† The code in this post is word-wrapped. If copying & pasting, do NOT add returns to this code!

‡ Server-Side Includes do not work in offline testing – the XHTML file which contains them needs to be uploaded to a server!