Commits

Shlomi Fish committed c73b0c8

Add the first version of the restored Ovid's CGI script.

Comments (0)

Files changed (12)

src/uses/web/index.html.wml

 </p>
 
 <define-tag cgi_course_url whitespace="delete">
-http://jdporter.perlmonk.org/cgi_course/
+./ovids_cgi_course/
 </define-tag>
 
 <p>

src/uses/web/ovids_cgi_course/appendix1.html

+<html>
+<head>
+<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
+<LINK REL=Prev HREF="http://jdporter.perlmonk.org/cgi_course/lesson_1.html" TITLE="Lesson 7">
+<LINK REL=Last HREF="http://jdporter.perlmonk.org/cgi_course/appendix2.html" TITLE="Appendix 2">
+<LINK REL=First HREF="http://jdporter.perlmonk.org/cgi_course/index.html" TITLE="Index">
+<link rel="stylesheet" href="http://web.archive.org/web/20091112150504cs_/http://jdporter.perlmonk.org/cgi_course/main.css" />
+<title>Getting Your CGI Scripts Working</title>
+</head>
+<body>
+<!-- BEGIN WAYBACK TOOLBAR INSERT -->
+
+<script type="text/javascript" src="http://staticweb.archive.org/js/disclaim-element.js" ></script>
+<script type="text/javascript" src="http://staticweb.archive.org/js/graph-calc.js" ></script>
+<script type="text/javascript" src="http://staticweb.archive.org/jflot/jquery.min.js" ></script>
+<script type="text/javascript">
+//<![CDATA[
+var firstDate = 820454400000;
+var lastDate = 1356998399999;
+var wbPrefix = "http://web.archive.org/web/";
+var wbCurrentUrl = "http:\/\/jdporter.perlmonk.org\/cgi_course\/appendix1.html";
+
+var curYear = -1;
+var curMonth = -1;
+var yearCount = 18;
+var firstYear = 1996;
+var imgWidth=450;
+var yearImgWidth = 25;
+var monthImgWidth = 2;
+var trackerVal = "none";
+var displayDay = "12";
+var displayMonth = "Nov";
+var displayYear = "2009";
+var prettyMonths = ["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"];
+
+function showTrackers(val) {
+	if(val == trackerVal) {
+		return;
+	}
+	if(val == "inline") {
+		document.getElementById("displayYearEl").style.color = "#ec008c";
+		document.getElementById("displayMonthEl").style.color = "#ec008c";
+		document.getElementById("displayDayEl").style.color = "#ec008c";		
+	} else {
+		document.getElementById("displayYearEl").innerHTML = displayYear;
+		document.getElementById("displayYearEl").style.color = "#ff0";
+		document.getElementById("displayMonthEl").innerHTML = displayMonth;
+		document.getElementById("displayMonthEl").style.color = "#ff0";
+		document.getElementById("displayDayEl").innerHTML = displayDay;
+		document.getElementById("displayDayEl").style.color = "#ff0";
+	}
+   document.getElementById("wbMouseTrackYearImg").style.display = val;
+   document.getElementById("wbMouseTrackMonthImg").style.display = val;
+   trackerVal = val;
+}
+function getElementX2(obj) {
+	var thing = jQuery(obj);
+	if((thing == undefined) 
+			|| (typeof thing == "undefined") 
+			|| (typeof thing.offset == "undefined")) {
+		return getElementX(obj);
+	}
+	return Math.round(thing.offset().left);
+}
+function trackMouseMove(event,element) {
+
+   var eventX = getEventX(event);
+   var elementX = getElementX2(element);
+   var xOff = eventX - elementX;
+	if(xOff < 0) {
+		xOff = 0;
+	} else if(xOff > imgWidth) {
+		xOff = imgWidth;
+	}
+   var monthOff = xOff % yearImgWidth;
+
+   var year = Math.floor(xOff / yearImgWidth);
+	var yearStart = year * yearImgWidth;
+   var monthOfYear = Math.floor(monthOff / monthImgWidth);
+   if(monthOfYear > 11) {
+       monthOfYear = 11;
+   }
+   // 1 extra border pixel at the left edge of the year:
+   var month = (year * 12) + monthOfYear;
+   var day = 1;
+	if(monthOff % 2 == 1) {
+		day = 15;
+	}
+	var dateString = 
+		zeroPad(year + firstYear) + 
+		zeroPad(monthOfYear+1,2) +
+		zeroPad(day,2) + "000000";
+
+	var monthString = prettyMonths[monthOfYear];
+	document.getElementById("displayYearEl").innerHTML = year + 1996;
+	document.getElementById("displayMonthEl").innerHTML = monthString;
+	// looks too jarring when it changes..
+	//document.getElementById("displayDayEl").innerHTML = zeroPad(day,2);
+
+	var url = wbPrefix + dateString + '/' +  wbCurrentUrl;
+	document.getElementById('wm-graph-anchor').href = url;
+
+   //document.getElementById("wmtbURL").value="evX("+eventX+") elX("+elementX+") xO("+xOff+") y("+year+") m("+month+") monthOff("+monthOff+") DS("+dateString+") Moy("+monthOfYear+") ms("+monthString+")";
+   if(curYear != year) {
+       var yrOff = year * yearImgWidth;
+       document.getElementById("wbMouseTrackYearImg").style.left = yrOff + "px";
+       curYear = year;
+   }
+   if(curMonth != month) {
+       var mtOff = year + (month * monthImgWidth) + 1;
+       document.getElementById("wbMouseTrackMonthImg").style.left = mtOff + "px";
+       curMonth = month;
+   }
+}
+//]]>
+</script>
+
+<style type="text/css">body{margin-top:0!important;padding-top:0!important;min-width:800px!important;}#wm-ipp a:hover{text-decoration:underline!important;}</style>
+<div id="wm-ipp" style="display:none; position:relative;padding:0 5px;min-height:70px;min-width:800px; z-index:9000;">
+<div id="wm-ipp-inside" style="position:fixed;padding:0!important;margin:0!important;width:97%;min-width:780px;border:5px solid #000;border-top:none;background-image:url(http://staticweb.archive.org/images/toolbar/wm_tb_bk_trns.png);text-align:center;-moz-box-shadow:1px 1px 3px #333;-webkit-box-shadow:1px 1px 3px #333;box-shadow:1px 1px 3px #333;font-size:11px!important;font-family:'Lucida Grande','Arial',sans-serif!important;">
+   <table style="border-collapse:collapse;margin:0;padding:0;width:100%;"><tbody><tr>
+   <td style="padding:10px;vertical-align:top;min-width:110px;">
+   <a href="file:///home/shlomif/OVID_CGI/wayback.archive.org/web/index.html" title="Wayback Machine home page" style="background-color:transparent;border:none;"><img src="file:///home/shlomif/OVID_CGI/staticweb.archive.org/images/toolbar/wayback-toolbar-logo.png" alt="Wayback Machine" width="110" height="39" border="0"/></a>
+   </td>
+   <td style="padding:0!important;text-align:center;vertical-align:top;width:100%;">
+
+       <table style="border-collapse:collapse;margin:0 auto;padding:0;width:570px;"><tbody><tr>
+       <td style="padding:3px 0;" colspan="2">
+       <form target="_top" method="get" action="http://wayback.archive.org/web/form-submit.jsp" name="wmtb" id="wmtb" style="margin:0!important;padding:0!important;"><input type="text" name="url" id="wmtbURL" value="http://jdporter.perlmonk.org/cgi_course/appendix1.html" style="width:400px;font-size:11px;font-family:'Lucida Grande','Arial',sans-serif;" onfocus="javascript:this.focus();this.select();" /><input type="hidden" name="type" value="replay" /><input type="hidden" name="date" value="20091112150504" /><input type="submit" value="Go" style="font-size:11px;font-family:'Lucida Grande','Arial',sans-serif;margin-left:5px;" /><span id="wm_tb_options" style="display:block;"></span></form>
+       </td>
+       <td style="vertical-align:bottom;padding:5px 0 0 0!important;" rowspan="2">
+           <table style="border-collapse:collapse;width:110px;color:#99a;font-family:'Helvetica','Lucida Grande','Arial',sans-serif;"><tbody>
+			
+           <!-- NEXT/PREV MONTH NAV AND MONTH INDICATOR -->
+           <tr style="width:110px;height:16px;font-size:10px!important;">
+           	<td style="padding-right:9px;font-size:11px!important;font-weight:bold;text-transform:uppercase;text-align:right;white-space:nowrap;overflow:visible;" nowrap="nowrap">
+               
+                       Oct
+                       
+               </td>
+               <td id="displayMonthEl" style="background:#000;color:#ff0;font-size:11px!important;font-weight:bold;text-transform:uppercase;width:34px;height:15px;padding-top:1px;text-align:center;" title="You are here: 15:05:04 Nov 12, 2009">NOV</td>
+				<td style="padding-left:9px;font-size:11px!important;font-weight:bold;text-transform:uppercase;white-space:nowrap;overflow:visible;" nowrap="nowrap">
+               
+                       Dec
+                       
+               </td>
+           </tr>
+
+           <!-- NEXT/PREV CAPTURE NAV AND DAY OF MONTH INDICATOR -->
+           <tr>
+               <td style="padding-right:9px;white-space:nowrap;overflow:visible;text-align:right!important;vertical-align:middle!important;" nowrap="nowrap">
+               
+                       <img src="file:///home/shlomif/OVID_CGI/staticweb.archive.org/images/toolbar/wm_tb_prv_off.png" alt="Previous capture" width="14" height="16" border="0" />
+                       
+               </td>
+               <td id="displayDayEl" style="background:#000;color:#ff0;width:34px;height:24px;padding:2px 0 0 0;text-align:center;font-size:24px;font-weight: bold;" title="You are here: 15:05:04 Nov 12, 2009">12</td>
+				<td style="padding-left:9px;white-space:nowrap;overflow:visible;text-align:left!important;vertical-align:middle!important;" nowrap="nowrap">
+               
+                       <img src="file:///home/shlomif/OVID_CGI/staticweb.archive.org/images/toolbar/wm_tb_nxt_off.png" alt="Next capture" width="14" height="16" border="0"/>
+                       
+			    </td>
+           </tr>
+
+           <!-- NEXT/PREV YEAR NAV AND YEAR INDICATOR -->
+           <tr style="width:110px;height:13px;font-size:9px!important;">
+				<td style="padding-right:9px;font-size:11px!important;font-weight: bold;text-align:right;white-space:nowrap;overflow:visible;" nowrap="nowrap">
+               
+                       2008
+                       
+               </td>
+               <td id="displayYearEl" style="background:#000;color:#ff0;font-size:11px!important;font-weight: bold;padding-top:1px;width:34px;height:13px;text-align:center;" title="You are here: 15:05:04 Nov 12, 2009">2009</td>
+				<td style="padding-left:9px;font-size:11px!important;font-weight: bold;white-space:nowrap;overflow:visible;" nowrap="nowrap">
+               
+                       2010
+                       
+				</td>
+           </tr>
+           </tbody></table>
+       </td>
+
+       </tr>
+       <tr>
+       <td style="vertical-align:middle;padding:0!important;">
+           <a href="file:///home/shlomif/OVID_CGI/wayback.archive.org/web/20091112150504*/http:/jdporter.perlmonk.org/cgi_course/appendix1.html" style="color:#33f;font-size:11px;font-weight:bold;background-color:transparent;border:none;" title="See a list of every capture for this URL"><strong>1 captures</strong></a>
+           <div style="margin:0!important;padding:0!important;color:#666;font-size:9px;padding-top:2px!important;white-space:nowrap;" title="Timespan for captures of this URL">12 Nov 09 - 12 Nov 09</div>
+       </td>
+       <td style="padding:0!important;">
+       <a style="position:relative; white-space:nowrap; width:450px;height:27px;" href="" id="wm-graph-anchor">
+       <div id="wm-ipp-sparkline" style="position:relative; white-space:nowrap; width:450px;height:27px;background-color:#fff;cursor:pointer;border-right:1px solid #ccc;" title="Explore captures for this URL">
+			<img id="sparklineImgId" style="position:absolute; z-index:9012; top:0px; left:0px;"
+				onmouseover="showTrackers('inline');" 
+				onmouseout="showTrackers('none');"
+				onmousemove="trackMouseMove(event,this)"
+				alt="sparklines"
+				width="450"
+				height="27"
+				border="0"
+				src="file:///home/shlomif/OVID_CGI/wayback.archive.org/web/jsp/graph.jsp"></img>
+			<img id="wbMouseTrackYearImg" 
+				style="display:none; position:absolute; z-index:9010;"
+				width="25" 
+				height="27"
+				border="0"
+				src="file:///home/shlomif/OVID_CGI/staticweb.archive.org/images/toolbar/transp-yellow-pixel.png"></img>
+			<img id="wbMouseTrackMonthImg"
+				style="display:none; position:absolute; z-index:9011; " 
+				width="2"
+				height="27" 
+				border="0"
+				src="file:///home/shlomif/OVID_CGI/staticweb.archive.org/images/toolbar/transp-red-pixel.png"></img>
+       </div>
+		</a>
+
+       </td>
+       </tr></tbody></table>
+   </td>
+   <td style="text-align:right;padding:5px;width:65px;font-size:11px!important;">
+       <a href="javascript:;" onclick="document.getElementById('wm-ipp').style.display='none';" style="display:block;padding-right:18px;background:url(http://staticweb.archive.org/images/toolbar/wm_tb_close.png) no-repeat 100% 0;color:#33f;font-family:'Lucida Grande','Arial',sans-serif;margin-bottom:23px;background-color:transparent;border:none;" title="Close the toolbar">Close</a>
+       <a href="file:///home/shlomif/OVID_CGI/faq.web.archive.org/index.html" style="display:block;padding-right:18px;background:url(http://staticweb.archive.org/images/toolbar/wm_tb_help.png) no-repeat 100% 0;color:#33f;font-family:'Lucida Grande','Arial',sans-serif;background-color:transparent;border:none;" title="Get some help using the Wayback Machine">Help</a>
+   </td>
+   </tr></tbody></table>
+
+</div>
+</div>
+<script type="text/javascript">
+ var wmDisclaimBanner = document.getElementById("wm-ipp");
+ if(wmDisclaimBanner != null) {
+   disclaimElement(wmDisclaimBanner);
+ }
+</script>
+<!-- END WAYBACK TOOLBAR INSERT -->
+
+<h1>Getting Your CGI Scripts Working</h1>
+
+<p>This tutorial has been developed to help you get your CGI script
+working. It focuses on common problems associated with setting
+up CGI scripts. There are some links to other helpful resources at
+the end. You should check these out if you cannot find the
+answers you need here.</p>
+
+<p>What follows is a sort of checklist to help you solve the
+problem quickly yourself. It is divided into four parts:</p>
+                                                                  
+<ol type="a">
+<li><a href="appendix1.html#A">Before uploading to the Server</a></li>
+<li><a href="appendix1.html#B">Uploading to the Server</a></li>
+<li><a href="appendix1.html#C">Setting Up on the Server</a></li>
+<li><a href="appendix1.html#D">Debugging</a></li>
+</ol>
+<hr>
+<h2><a name="A"></a>Before Uploading to the Server</h2>
+
+<h3>1. Does your script compile?</h3>
+
+<p>Like any Perl program, a CGI script needs to compile successfully
+before it will run. Until it does this you can forget everything else.
+To test this you need a command prompt and a working Perl interpreter.
+For information on how to build a Perl interpreter or to get a pre-built Perl for your platform,
+<a href="http://perlmonks.org/?node_id=236970">Installing and Adding to Perl</a> on PerlMonks.
+</p>
+
+<p>Once you have a perl you can access from a command prompt, type:</p>
+
+<pre>perl -c myscript.pl
+</pre>
+
+<p>What this does is compile (but not run) your script. You should
+see this:</p>
+
+<pre>perl -c myscript.pl
+myscript.pl syntax OK
+
+</pre>
+
+<p>Here are some common errors and solutions:</p>
+
+<h4>No Perl!</h4>
+
+<pre>perl -c test.pl
+Bad command or file name
+
+</pre>
+
+<p>This is telling you that your operating system can not find the
+Perl executable. Either it is not installed and/or it is not
+included in your path environment variable. So install perl and
+either include it in your path or type the full path to the
+executable. How you find perl depends on your system. On UNIX-like systems, type
+'which perl' at the command prompt to get the path (usually
+/usr/bin/perl). On Windows, do a file search (<i>Start > Find</i>) for perl.exe
+to get the path (but it's usually in C:\Perl\bin\).</p>
+
+<p>A bit of background: the PATH environment variable is a list of
+directories separated by colons (UNIX shells) or semicolons (Windows CMD.EXE).
+When you type a command name without giving an explicit path your
+shell searches each directory in the PATH list in order, looking
+for an executable file by that name, and the shell will run the
+first matching program it finds.</p>
+
+<pre>To check the path on Windows, type:
+
+path
+
+You'll get a response like:
+
+C:\;C:\WINDOWS;C:\WINDOWS\COMMAND;
+
+
+To add Perl to the path, type:
+
+path %PATH%;c:\perl\bin
+
+
+To check the path on UNIX-y systems, type:
+
+echo $PATH
+
+You'll get a response like:
+
+/bin:/usr/bin:
+
+And to add Perl to the path:
+
+  csh users type something like:
+  setenv PATH $PATH:/usr/bin
+
+  sh/bash/ksh users type something like:
+  PATH=$PATH:/usr/bin
+  export PATH
+</pre>
+
+<h4>Syntax Errors</h4>
+
+<pre>perl -c test.pl
+String found where operator expected at test.pl line 1, 
+near "printt "Hello World!""
+(Do you need to predeclare printt?)
+syntax error at test.pl line 1, near "printt "Hello World!""
+test.pl had compilation errors.
+
+</pre>
+
+<p>This is a simple syntax error typo problem. Perl can not find
+the function 'printt'. You need to fix all these.</p>
+
+<h4>Missing Modules</h4>
+
+<p>Modules are Perl's versions of libraries. There are modules
+available to do everything from read in CGI data to allowing you to
+write your script in Latin! To use them they need to be
+installed.</p>
+
+<pre>perl -c test.pl
+Can't locate Some/Module.pm in @INC (@INC contains: 
+C:/Perl/lib C:/Perl/site/lib .) at test.pl line 1.
+BEGIN failed--compilation aborted at test.pl line 1.
+
+</pre>
+
+<p>This is telling you that the module Some::Module required by a
+'use Some::Module;" directive is not installed. You will probably
+need to install the module. To install a module see
+<a href="http://perlmonks.org/?node=12444">A detailed How-To for locally installing modules</a>
+and
+<a href="http://perlmonks.org/?node=22783">Installing modules on Win32.</a>
+You <i>may</i> be able to get away with commenting out the
+<tt>use&nbsp;Some::Module;</tt>
+directive to test compile you script but this will fail if you have code like
+<tt>print&nbsp;Some::Module-&gt;Cool_Function;</tt>
+later on.</p>
+
+<h3>2. Are you using strict and warnings?</h3>
+
+<pre>
+#!/usr/bin/perl <a href="http://perlmonks.org/?node=53947"><tt>-w</tt></a> # "-w" turns on all sorts of warnings about probable errors. 
+use <a href="http://perlmonks.org/?node=doc://diagnostics"><tt>diagnostics;</tt></a>   # optional; causes warnings to be explained in greater detail.
+use <a href="http://perlmonks.org/?node=doc://strict"><tt>strict;</tt></a>        # generates compile and run-time errors for certain unsafe constructs.
+</pre>
+
+<p>While use strict and warnings are not required for any perl
+script to run (including CGI) they can help you sort out all manner
+of problems and are highly recommended. See:
+<a href="http://perlmonks.org/?node=87628">Use strict warnings and diagnostics or die</a></p>
+
+<h3>3. Are you using CGI.pm to parse your CGI input data?</h3>
+
+<p>The leading block of reusable code for CGI purposes is
+<a href="http://perlmonks.org/?node=mod://CGI">CGI.pm</a>.
+In a nutshell there is a lot more to parsing CGI data than first
+meets the eye - both from the functionality and security point of
+view. If you can't give ten good reasons not to use CGI.pm then
+*use it*. It is part of the standard perl distribution so should be
+available on any system that has Perl. Using it to get your form
+parameters is as easy as:</p>
+
+<pre>use CGI;            # use CGI.pm
+my $q = new CGI;    # create new CGI object
+
+# now get value of a form parameter named 'name'
+my $name     = $q-&gt;param('name');
+
+# now get an array of values of all form parameters named 'option'
+my @options  = $q-&gt;param('option');  
+</pre>
+
+<p>As you can see it is very easy to use CGI.pm. Besides this
+tutorial good entry points to all things CGI.pm, and why you should
+be using it are:
+<a href="http://perlmonks.org/?node=51012">use CGI or die;</a>
+and
+<a href="http://perlmonks.org/?node=77669">No excuses about not using CGI.pm</a>.</p>
+
+<h2><a name="B"></a>Uploading to the Server</h2>
+
+<h3>1. Did you upload in ASCII mode?</h3>
+
+<p>Assuming all has gone to plan so far we are ready to upload the
+script to the server. The server is the computer that is actually
+connected to the WWW and whose job it is the serve up HTML
+documents and process CGI scripts. A Perl script is just a text
+file. Unfortunately different computer operating systems handle
+text files differently. On UNIX-like systems, the line ending is a linefeed character
+(\n). On Windows, it is a carriage return + linefeed sequence (\r\n). On Macintosh,
+it is a carriage return character (\r). Clearly, some conversion will be in
+order when sending files from one system type to another. Never
+fear &mdash; the problem has been solved for you. All you need to do is to
+make the transfer (usually by FTP) in ASCII mode. In this mode the
+line endings will be automatically converted for you.</p>
+
+<p>Where you can strike problems is when you transfer a file in
+*BINARY* mode. In this mode the file is sent exactly as is so line
+endings are not converted. This can and does lead to problems. Make
+sure you transfer in ASCII mode.</p>
+
+<h3>2. Did you upload to the correct directory?</h3>
+
+<p>Most servers have a specific directory used to store Perl CGI
+scripts. Typically this will be something like:</p>
+
+<pre>/www.mydomain.com/cgi-bin/
+</pre>
+
+<p>
+If you're not sure, ask your system administrator about it. 
+Whatever the correct directory is, that is where you will want to
+upload your scripts into.
+</p>
+
+<h2><a name="C"></a>Setting Up on the Server</h2>
+
+<p>OK so now we have our script in the cgi-bin. We need to set it
+up so that it can be executed by the server when it is called. Here
+is how CGI works in a nutshell:</p>
+
+<blockquote>
+<p>(i) Browser requests a resource via a URL that is aimed at a CGI
+script, say via a link like:</p>
+
+<pre>  &lt;a href="http://www.mydomain.com/cgi-bin/myscript.cgi"&gt;Run my script&lt;/a&gt;
+ 
+</pre>
+
+<p>(ii) The server receives the request and goes "Ah ha! This is a
+cgi script that I need to run!"</p>
+
+<p>(iii) The server executes the script passing it data via the
+environment variables in the $ENV hash and via STDIN. The script
+can access this data and process it. The script generates output on
+STDOUT</p>
+
+<p>(iv) The server takes the output of the CGI script from STDOUT
+and returns it to the browser pretending it received a request for
+a static HTML document.</p>
+</blockquote>
+
+<p>We can have problems in any of these areas. Of course!</p>
+
+<h3>1. Is the HTML document that calls the script pointed at the
+correct place?</h3>
+
+<p>In order to execute the script you need to ask for it to be
+executed. If you link to the URL above and your cgi-bin happens to
+be named something else (like, say, localcgi) then you will get a "404 Document not
+found" error. Of course the server can't find the document in
+/www.mydomain.com/cgi-bin/! It is somewhere else.</p>
+
+<h3>2. Is the server configured to execute the script, and are the
+permissions set?</h3>
+
+<p>You can't execute an HTML document, well at least Perl can't
+compile it! You also don't want to return the code in your script
+to the browser when it is requested. So it is obvious that the
+server needs some way of deciding if it needs to return the
+requested document of execute it. As you might expect there are
+many ways to achieve this result. Your systems administrator should
+know the exact details for your system but here is a general
+guide.</p>
+
+<p>In UNIX, all files have permissions. They have permissions for
+the owner, the group, and everybody else. The permissions are
+4=read, 2=write, 1=execute. Thus a permission of 7 means that the
+file can be read , written and executed as 4+2+1=7. A permission of
+5 means the file can be read and executed as 4+1=5. As a general
+rule you will want permissions of 755 for your file which grants
+you read, write and execute permission and everyone else read and
+execute permission. You set this using the command chmod 755.
+Directories also have permissions which need to be correct but they
+should be fine if this is a standard cgi-bin.</p>
+
+<p>Some servers are configured to recognize any file that ends in
+.pl, .pm, or .cgi as a Perl executable (especially under Windows) and act
+accordingly. You will need to use one of these extensions if that
+is the case so the server knows to execute the file. Still other
+servers assume that all files in certain directories (ie cgi-bin)
+are executable. The bottom line is is all else fails then check
+with your sysadmin.</p>
+
+<h3>3. Is the shebang line pointed at the Perl interpreter?</h3>
+
+<p>In UNIX, if a request for a file marked as
+executable is made, then the first 2 bytes are examined for the <tt>#!</tt>
+shebang sequence. If this is found then the shell executes that
+file using the executable file it finds at the path following the
+<tt>#!</tt>. Therefore, what the line
+
+<pre>#!/usr/bin/perl
+</pre>
+
+actually says is: "Dear shell, if this file is called and
+it has read and execute permission please execute it using the
+executable file <tt>/usr/bin/perl</tt>". If the perl
+executable is not in the /usr/bin/ directory, the shell will
+complain about not being able to find perl. Unless the script has
+permissions of at least 5 (read and execute) the shell/Perl will
+not be able to read it (as it must) in order to execute it (as we
+want).</p>
+
+<p>Some servers are configured not to allow the execution of CGI
+scripts for security reasons, once again talk to ye sysadmin.</p>
+
+<h2><a name="D"></a>Debugging</h2>
+
+<h3>1. Before doing anything else add this code to the top of your
+script.</h3>
+
+<p>If you add this code your script will run for long enough that
+any errors appear in the browser window making it easy to see the
+problem, presuming of course that you have followed the advice
+above! This will avoid you getting the less than useful 500
+Internal Server Error or Premature end of script headers/Malformed
+script headers messages. You add this code just below the shebang
+line and before everything else. That's <u>everything else</u>. The
+reason for this is to minimise the lines which can cause problems
+before we reliably direct output (including syntax errors) to the
+browser</p>
+
+<pre>#!/usr/bin/perl -wT
+
+# ensure all fatals go to browser during debugging and set-up
+# comment this BEGIN block out on production code for security
+BEGIN {
+    $|=1;
+    print "Content-type: text/html\n\n";
+    use CGI::Carp('fatalsToBrowser');
+}
+
+# all the rest of the code goes here
+</pre>
+
+<p>Because this code is in a BEGIN block it is executed before
+everything else. Even before most of the script is compiled. In it
+we do three vital things to ensure that all errors from this point
+on will appear in the browser window thus making debugging *much*
+easier. You could look in the server logs to get the same
+information but as you may or may not have access to them and they
+can be anywhere on the server it is easier to use this instead.</p>
+
+<p>The $|=1; forces buffer flushing. This ensures that output from
+the script goes immediately to STDOUT. Trust us.  But if you really
+want the gory details, read
+<a href="http://perl.plover.com/FAQs/Buffering.html">Suffering from Buffering</a>.
+</p>
+
+<p>Next we print a complete valid header. In the HyperText
+Transport Protocol (the http bit in http://www.mydomain.com) every
+request and response needs a valid header. It may or may not
+include a body but it must have a header. The end of the header is
+recognised by the \n\n sequence. This prints one blank line. If,
+for any reason, a blank line is printed *before* the "Content-type:
+text/html\n\n" you will get a premature end of script header error.
+By printing a valid header we avoid this.
+The code here assumes that
+you want to output HTML, but it's also possible for a CGI script to
+output plain text, an image (JPEG, PNG, etc.), PDF, Microsoft Excel
+format, or any of a virtually infinite number of other file formats,
+using a special header which specifies data format types.
+The headers our script generates without this block will appear in
+the top left of the browser window where we can check that they are
+as expected. If you don't see them and your script now works your
+problem is that you are not outputting any valid header info.</p>
+
+<p>Finally we add
+<a href="http://perlmonks.org/?node=mod://CGI::Carp">CGI::Carp</a>,
+which essentially does the same as lines 1 and 2;
+but may not be as reliable as you might prefer.
+Combined with the two lines above virtually all errors appear in
+the browser window with an explanation.</p>
+
+<p>While we are in this topic the -w switch on the shebang line
+provides heaps of free help. If you want more detail add the line
+use diagnostics; as shown:</p>
+
+<pre>#!/usr/bin/perl -wT
+
+# comment this out on production code as it uses a lot
+# of memory and you won't have any errors left anyway :-)
+use diagnostics;
+</pre>
+
+<p>You may be wondering about the -T switch. Or you may not be.
+Regardless you want to use it. The -T switch switches on taint
+checking which is Perl's unique
+anti-<a href="http://en.wikipedia.org/wiki/Hacker_(computer_security)#Black_hat">cracker</a>
+mode which warns you if you are doing dangerous stuff that makes it easy to hack your
+server via your script. See
+<a href="http://www.w3.org/Security/Faq/">The World Wide Web Security FAQ</a>
+for more details.</p>
+
+<h3>2. Are you checking the return values from the functions built
+in to perl?</h3>
+
+<p>Most of the file and system functions set $! and have return
+values that you can test thus:</p>
+
+<pre>open(FILE, "&lt;/file.txt") or die "Error opening /file.txt Perl says: $!\n";
+</pre>
+
+<p>$! will contain an error message that will give you more
+information on where your program is going wrong. The
+<a href="http://perlmonks.org/?node=doc://perlfunc">perlfunc documentation</a>
+will give you more information on the return values
+from functions. It is very handy to know that the reason your
+script is not working is because you can not find/open/write to a
+file for instance.</p>
+
+<h3>3. Are the modules required by your script actually installed
+on the server?</h3>
+
+<p>As we saw earlier if you script uses modules they need to be
+installed. Some modules come with perl (like CGI.pm) but others
+need to be installed. If you have followed the advice so far you
+will get the typical:</p>
+
+<pre>Can't locate Some/Module.pm in @INC (@INC contains: 
+C:/Perl/lib C:/Perl/site/lib .) at test.pl line 12.
+</pre>
+
+<p>error message in your browser window. Get you sysadmin to
+install them. Or see the installing modules links above.</p>
+
+<h3>4. Don't be afraid to Ask</h3>
+
+<p>If you have tried all the stuff above and have an error you can't fix,
+<a href="http://perlmonks.org/?node_id=17974">ask the Perl Monks</a>.
+Many Monks do this stuff for a living so can probably help.
+In fact, you will often find that if you show you can help yourself,
+people will fall over themselves trying to help you.
+Good luck and enjoy the journey.</p>
+
+<h3>Credits</h3>
+
+<p>
+This tutorial, <i>Getting Your CGI Scripts Working</i>, was originally written by
+<a href="http://perlmonks.org/?node_id=651495">tachyon</a>
+(<a href="mailto:jfreeman@tassie.net.au?subject=CGI%20tutorial">Dr James Freeman</a>).
+Further improvements were made or suggested by:
+<ul>
+<li> <a href="http://perlmonks.org/?node=Ovid">Ovid</a> </li>
+<li> <a href="http://perlmonks.org/?node=Albannach">Albannach</a> </li>
+<li> <a href="http://perlmonks.org/?node=sierrathedog04">sierrathedog04</a> </li>
+<li> <a href="http://perlmonks.org/?node_id=17361">converter</a> </li>
+</ul>
+It is now collaboratively maintained by the 
+<a href="http://perlmonks.org/?node_id=591017">PerlMonks Pedagogues</a>.
+</p>
+
+<h3>Other Useful Tutorials</h3>
+
+<p>This tutorial owes much to Tom Christiansen's terse but informative
+<a href="http://www.perl.com/doc/FAQs/cgi/idiots-guide.html">The Idiot's Guide to Solving Perl CGI Problems</a>.
+Don't be offended by the title. It's a great reference, though it's primarily aimed at the UNIX world.
+Tom C also has a
+<a href="http://www.perl.com/doc/FAQs/cgi/perl-cgi-faq.html">CGI Programming FAQ</a>.
+</p>
+
+<p>For a short walk-through of setting up the Apache web server on
+a Windows box, see
+<a href="http://perlmonks.org/?node_id=44536">Setting up Perl/CGI with Windows</a>.
+</p>
+
+<p>
+If you know of any other good tutorials, please go to 
+<a href="http://perlmonks.org/">PerlMonks</a> and inform the
+<a href="http://perlmonks.org/?node_id=591017">Pedagogues</a> group
+about it. (They're the ones who maintain the 
+<a href="http://perlmonks.org/?node=Tutorials">Tutorials</a> hosted
+on that site.)
+</p>
+
+</body></html>
+
+
+
+
+
+<!--
+     FILE ARCHIVED ON 15:05:04 Nov 12, 2009 AND RETRIEVED FROM THE
+     INTERNET ARCHIVE ON 9:33:46 Aug 9, 2012.
+     JAVASCRIPT APPENDED BY WAYBACK MACHINE, COPYRIGHT INTERNET ARCHIVE.
+
+     ALL OTHER CONTENT MAY ALSO BE PROTECTED BY COPYRIGHT (17 U.S.C.
+     SECTION 108(a)(3)).
+-->

src/uses/web/ovids_cgi_course/appendix2.html

+<html>
+<head>
+<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
+<LINK REL=Prev HREF="http://jdporter.perlmonk.org/cgi_course/lesson_2.html" TITLE="Lesson 2">
+<LINK REL=Last HREF="http://jdporter.perlmonk.org/cgi_course/appendix1.html" TITLE="Appendix 1">
+<LINK REL=First HREF="http://jdporter.perlmonk.org/cgi_course/index.html" TITLE="Index">
+<link rel="stylesheet" href="http://web.archive.org/web/20091113183137cs_/http://jdporter.perlmonk.org/cgi_course/main.css" />
+<title>URL and HTML entities</title>
+</head>
+<body>
+<!-- BEGIN WAYBACK TOOLBAR INSERT -->
+
+<script type="text/javascript" src="http://staticweb.archive.org/js/disclaim-element.js" ></script>
+<script type="text/javascript" src="http://staticweb.archive.org/js/graph-calc.js" ></script>
+<script type="text/javascript" src="http://staticweb.archive.org/jflot/jquery.min.js" ></script>
+<script type="text/javascript">
+//<![CDATA[
+var firstDate = 820454400000;
+var lastDate = 1356998399999;
+var wbPrefix = "http://web.archive.org/web/";
+var wbCurrentUrl = "http:\/\/jdporter.perlmonk.org\/cgi_course\/appendix2.html";
+
+var curYear = -1;
+var curMonth = -1;
+var yearCount = 18;
+var firstYear = 1996;
+var imgWidth=450;
+var yearImgWidth = 25;
+var monthImgWidth = 2;
+var trackerVal = "none";
+var displayDay = "13";
+var displayMonth = "Nov";
+var displayYear = "2009";
+var prettyMonths = ["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"];
+
+function showTrackers(val) {
+	if(val == trackerVal) {
+		return;
+	}
+	if(val == "inline") {
+		document.getElementById("displayYearEl").style.color = "#ec008c";
+		document.getElementById("displayMonthEl").style.color = "#ec008c";
+		document.getElementById("displayDayEl").style.color = "#ec008c";		
+	} else {
+		document.getElementById("displayYearEl").innerHTML = displayYear;
+		document.getElementById("displayYearEl").style.color = "#ff0";
+		document.getElementById("displayMonthEl").innerHTML = displayMonth;
+		document.getElementById("displayMonthEl").style.color = "#ff0";
+		document.getElementById("displayDayEl").innerHTML = displayDay;
+		document.getElementById("displayDayEl").style.color = "#ff0";
+	}
+   document.getElementById("wbMouseTrackYearImg").style.display = val;
+   document.getElementById("wbMouseTrackMonthImg").style.display = val;
+   trackerVal = val;
+}
+function getElementX2(obj) {
+	var thing = jQuery(obj);
+	if((thing == undefined) 
+			|| (typeof thing == "undefined") 
+			|| (typeof thing.offset == "undefined")) {
+		return getElementX(obj);
+	}
+	return Math.round(thing.offset().left);
+}
+function trackMouseMove(event,element) {
+
+   var eventX = getEventX(event);
+   var elementX = getElementX2(element);
+   var xOff = eventX - elementX;
+	if(xOff < 0) {
+		xOff = 0;
+	} else if(xOff > imgWidth) {
+		xOff = imgWidth;
+	}
+   var monthOff = xOff % yearImgWidth;
+
+   var year = Math.floor(xOff / yearImgWidth);
+	var yearStart = year * yearImgWidth;
+   var monthOfYear = Math.floor(monthOff / monthImgWidth);
+   if(monthOfYear > 11) {
+       monthOfYear = 11;
+   }
+   // 1 extra border pixel at the left edge of the year:
+   var month = (year * 12) + monthOfYear;
+   var day = 1;
+	if(monthOff % 2 == 1) {
+		day = 15;
+	}
+	var dateString = 
+		zeroPad(year + firstYear) + 
+		zeroPad(monthOfYear+1,2) +
+		zeroPad(day,2) + "000000";
+
+	var monthString = prettyMonths[monthOfYear];
+	document.getElementById("displayYearEl").innerHTML = year + 1996;
+	document.getElementById("displayMonthEl").innerHTML = monthString;
+	// looks too jarring when it changes..
+	//document.getElementById("displayDayEl").innerHTML = zeroPad(day,2);
+
+	var url = wbPrefix + dateString + '/' +  wbCurrentUrl;
+	document.getElementById('wm-graph-anchor').href = url;
+
+   //document.getElementById("wmtbURL").value="evX("+eventX+") elX("+elementX+") xO("+xOff+") y("+year+") m("+month+") monthOff("+monthOff+") DS("+dateString+") Moy("+monthOfYear+") ms("+monthString+")";
+   if(curYear != year) {
+       var yrOff = year * yearImgWidth;
+       document.getElementById("wbMouseTrackYearImg").style.left = yrOff + "px";
+       curYear = year;
+   }
+   if(curMonth != month) {
+       var mtOff = year + (month * monthImgWidth) + 1;
+       document.getElementById("wbMouseTrackMonthImg").style.left = mtOff + "px";
+       curMonth = month;
+   }
+}
+//]]>
+</script>
+
+<style type="text/css">body{margin-top:0!important;padding-top:0!important;min-width:800px!important;}#wm-ipp a:hover{text-decoration:underline!important;}</style>
+<div id="wm-ipp" style="display:none; position:relative;padding:0 5px;min-height:70px;min-width:800px; z-index:9000;">
+<div id="wm-ipp-inside" style="position:fixed;padding:0!important;margin:0!important;width:97%;min-width:780px;border:5px solid #000;border-top:none;background-image:url(http://staticweb.archive.org/images/toolbar/wm_tb_bk_trns.png);text-align:center;-moz-box-shadow:1px 1px 3px #333;-webkit-box-shadow:1px 1px 3px #333;box-shadow:1px 1px 3px #333;font-size:11px!important;font-family:'Lucida Grande','Arial',sans-serif!important;">
+   <table style="border-collapse:collapse;margin:0;padding:0;width:100%;"><tbody><tr>
+   <td style="padding:10px;vertical-align:top;min-width:110px;">
+   <a href="file:///home/shlomif/OVID_CGI/wayback.archive.org/web/index.html" title="Wayback Machine home page" style="background-color:transparent;border:none;"><img src="file:///home/shlomif/OVID_CGI/staticweb.archive.org/images/toolbar/wayback-toolbar-logo.png" alt="Wayback Machine" width="110" height="39" border="0"/></a>
+   </td>
+   <td style="padding:0!important;text-align:center;vertical-align:top;width:100%;">
+
+       <table style="border-collapse:collapse;margin:0 auto;padding:0;width:570px;"><tbody><tr>
+       <td style="padding:3px 0;" colspan="2">
+       <form target="_top" method="get" action="http://wayback.archive.org/web/form-submit.jsp" name="wmtb" id="wmtb" style="margin:0!important;padding:0!important;"><input type="text" name="url" id="wmtbURL" value="http://jdporter.perlmonk.org/cgi_course/appendix2.html" style="width:400px;font-size:11px;font-family:'Lucida Grande','Arial',sans-serif;" onfocus="javascript:this.focus();this.select();" /><input type="hidden" name="type" value="replay" /><input type="hidden" name="date" value="20091113183137" /><input type="submit" value="Go" style="font-size:11px;font-family:'Lucida Grande','Arial',sans-serif;margin-left:5px;" /><span id="wm_tb_options" style="display:block;"></span></form>
+       </td>
+       <td style="vertical-align:bottom;padding:5px 0 0 0!important;" rowspan="2">
+           <table style="border-collapse:collapse;width:110px;color:#99a;font-family:'Helvetica','Lucida Grande','Arial',sans-serif;"><tbody>
+			
+           <!-- NEXT/PREV MONTH NAV AND MONTH INDICATOR -->
+           <tr style="width:110px;height:16px;font-size:10px!important;">
+           	<td style="padding-right:9px;font-size:11px!important;font-weight:bold;text-transform:uppercase;text-align:right;white-space:nowrap;overflow:visible;" nowrap="nowrap">
+               
+                       Oct
+                       
+               </td>
+               <td id="displayMonthEl" style="background:#000;color:#ff0;font-size:11px!important;font-weight:bold;text-transform:uppercase;width:34px;height:15px;padding-top:1px;text-align:center;" title="You are here: 18:31:37 Nov 13, 2009">NOV</td>
+				<td style="padding-left:9px;font-size:11px!important;font-weight:bold;text-transform:uppercase;white-space:nowrap;overflow:visible;" nowrap="nowrap">
+               
+                       Dec
+                       
+               </td>
+           </tr>
+
+           <!-- NEXT/PREV CAPTURE NAV AND DAY OF MONTH INDICATOR -->
+           <tr>
+               <td style="padding-right:9px;white-space:nowrap;overflow:visible;text-align:right!important;vertical-align:middle!important;" nowrap="nowrap">
+               
+                       <img src="file:///home/shlomif/OVID_CGI/staticweb.archive.org/images/toolbar/wm_tb_prv_off.png" alt="Previous capture" width="14" height="16" border="0" />
+                       
+               </td>
+               <td id="displayDayEl" style="background:#000;color:#ff0;width:34px;height:24px;padding:2px 0 0 0;text-align:center;font-size:24px;font-weight: bold;" title="You are here: 18:31:37 Nov 13, 2009">13</td>
+				<td style="padding-left:9px;white-space:nowrap;overflow:visible;text-align:left!important;vertical-align:middle!important;" nowrap="nowrap">
+               
+                       <img src="file:///home/shlomif/OVID_CGI/staticweb.archive.org/images/toolbar/wm_tb_nxt_off.png" alt="Next capture" width="14" height="16" border="0"/>
+                       
+			    </td>
+           </tr>
+
+           <!-- NEXT/PREV YEAR NAV AND YEAR INDICATOR -->
+           <tr style="width:110px;height:13px;font-size:9px!important;">
+				<td style="padding-right:9px;font-size:11px!important;font-weight: bold;text-align:right;white-space:nowrap;overflow:visible;" nowrap="nowrap">
+               
+                       2008
+                       
+               </td>
+               <td id="displayYearEl" style="background:#000;color:#ff0;font-size:11px!important;font-weight: bold;padding-top:1px;width:34px;height:13px;text-align:center;" title="You are here: 18:31:37 Nov 13, 2009">2009</td>
+				<td style="padding-left:9px;font-size:11px!important;font-weight: bold;white-space:nowrap;overflow:visible;" nowrap="nowrap">
+               
+                       2010
+                       
+				</td>
+           </tr>
+           </tbody></table>
+       </td>
+
+       </tr>
+       <tr>
+       <td style="vertical-align:middle;padding:0!important;">
+           <a href="file:///home/shlomif/OVID_CGI/wayback.archive.org/web/20091113183137*/http:/jdporter.perlmonk.org/cgi_course/appendix2.html" style="color:#33f;font-size:11px;font-weight:bold;background-color:transparent;border:none;" title="See a list of every capture for this URL"><strong>1 captures</strong></a>
+           <div style="margin:0!important;padding:0!important;color:#666;font-size:9px;padding-top:2px!important;white-space:nowrap;" title="Timespan for captures of this URL">13 Nov 09 - 13 Nov 09</div>
+       </td>
+       <td style="padding:0!important;">
+       <a style="position:relative; white-space:nowrap; width:450px;height:27px;" href="" id="wm-graph-anchor">
+       <div id="wm-ipp-sparkline" style="position:relative; white-space:nowrap; width:450px;height:27px;background-color:#fff;cursor:pointer;border-right:1px solid #ccc;" title="Explore captures for this URL">
+			<img id="sparklineImgId" style="position:absolute; z-index:9012; top:0px; left:0px;"
+				onmouseover="showTrackers('inline');" 
+				onmouseout="showTrackers('none');"
+				onmousemove="trackMouseMove(event,this)"
+				alt="sparklines"
+				width="450"
+				height="27"
+				border="0"
+				src="file:///home/shlomif/OVID_CGI/wayback.archive.org/web/jsp/graph.jsp"></img>
+			<img id="wbMouseTrackYearImg" 
+				style="display:none; position:absolute; z-index:9010;"
+				width="25" 
+				height="27"
+				border="0"
+				src="file:///home/shlomif/OVID_CGI/staticweb.archive.org/images/toolbar/transp-yellow-pixel.png"></img>
+			<img id="wbMouseTrackMonthImg"
+				style="display:none; position:absolute; z-index:9011; " 
+				width="2"
+				height="27" 
+				border="0"
+				src="file:///home/shlomif/OVID_CGI/staticweb.archive.org/images/toolbar/transp-red-pixel.png"></img>
+       </div>
+		</a>
+
+       </td>
+       </tr></tbody></table>
+   </td>
+   <td style="text-align:right;padding:5px;width:65px;font-size:11px!important;">
+       <a href="javascript:;" onclick="document.getElementById('wm-ipp').style.display='none';" style="display:block;padding-right:18px;background:url(http://staticweb.archive.org/images/toolbar/wm_tb_close.png) no-repeat 100% 0;color:#33f;font-family:'Lucida Grande','Arial',sans-serif;margin-bottom:23px;background-color:transparent;border:none;" title="Close the toolbar">Close</a>
+       <a href="file:///home/shlomif/OVID_CGI/faq.web.archive.org/index.html" style="display:block;padding-right:18px;background:url(http://staticweb.archive.org/images/toolbar/wm_tb_help.png) no-repeat 100% 0;color:#33f;font-family:'Lucida Grande','Arial',sans-serif;background-color:transparent;border:none;" title="Get some help using the Wayback Machine">Help</a>
+   </td>
+   </tr></tbody></table>
+
+</div>
+</div>
+<script type="text/javascript">
+ var wmDisclaimBanner = document.getElementById("wm-ipp");
+ if(wmDisclaimBanner != null) {
+   disclaimElement(wmDisclaimBanner);
+ }
+</script>
+<!-- END WAYBACK TOOLBAR INSERT -->
+
+<h1>URL and HTML entities</h1>
+
+<p> The following table was created entirely with Perl, using CGI.pm and several
+other modules. The program listing is <a href="appendix2.html#program">at the bottom</a>.
+</p>
+
+<table>
+    <tbody><tr>
+        <th>
+            Symbol
+        </th>
+        <th>
+            ASCII Value
+        </th>
+        <th>
+            URL encoded
+        </th>
+
+        <th>
+            HTML code
+        </th>
+    </tr>
+     <tr align="right" bgcolor="#cccccc">
+        <td>
+            &nbsp;
+        </td>
+        <td>
+
+            0
+        </td>
+        <td>
+            %00
+        </td>
+        <td>
+            &amp;#0;
+        </td>
+    </tr>
+    <tr align="right" bgcolor="#ffffff">
+
+        <td>
+            &nbsp;
+        </td>
+        <td>
+            1
+        </td>
+        <td>
+            %01
+        </td>
+        <td>
+
+            &amp;#1;
+        </td>
+    </tr>
+    <tr align="right" bgcolor="#cccccc">
+        <td>
+            &nbsp;
+        </td>
+        <td>
+            2
+        </td>
+
+        <td>
+            %02
+        </td>
+        <td>
+            &amp;#2;
+        </td>
+    </tr>
+    <tr align="right" bgcolor="#ffffff">
+        <td>
+            &nbsp;
+
+        </td>
+        <td>
+            3
+        </td>
+        <td>
+            %03
+        </td>
+        <td>
+            &amp;#3;
+        </td>
+
+    </tr>
+    <tr align="right" bgcolor="#cccccc">
+        <td>
+            &nbsp;
+        </td>
+        <td>
+            4
+        </td>
+        <td>
+
+            %04
+        </td>
+        <td>
+            &amp;#4;
+        </td>
+    </tr>
+    <tr align="right" bgcolor="#ffffff">
+        <td>
+            &nbsp;
+        </td>
+
+        <td>
+            5
+        </td>
+        <td>
+            %05
+        </td>
+        <td>
+            &amp;#5;
+        </td>
+    </tr>
+
+    <tr align="right" bgcolor="#cccccc">
+        <td>
+            &nbsp;
+        </td>
+        <td>
+            6
+        </td>
+        <td>
+            %06
+        </td>
+
+        <td>
+            &amp;#6;
+        </td>
+    </tr>
+    <tr align="right" bgcolor="#ffffff">
+        <td>
+            &nbsp;
+        </td>
+        <td>
+
+            7
+        </td>
+        <td>
+            %07
+        </td>
+        <td>
+            &amp;#7;
+        </td>
+    </tr>
+    <tr align="right" bgcolor="#cccccc">
+
+        <td>
+            &nbsp;
+        </td>
+        <td>
+            8
+        </td>
+        <td>
+            %08
+        </td>
+        <td>
+
+            &amp;#8;
+        </td>
+    </tr>
+    <tr align="right" bgcolor="#ffffff">
+        <td>
+            &nbsp;
+        </td>
+        <td>
+            9
+        </td>
+
+        <td>
+            %09
+        </td>
+        <td>
+            &amp;#9;
+        </td>
+    </tr>
+    <tr align="right" bgcolor="#cccccc">
+        <td>
+            &nbsp;
+
+        </td>
+        <td>
+            10
+        </td>
+        <td>
+            %0A
+        </td>
+        <td>
+            &amp;#10;
+        </td>
+
+    </tr>
+    <tr align="right" bgcolor="#ffffff">
+        <td>
+            &nbsp;
+        </td>
+        <td>
+            11
+        </td>
+        <td>
+
+            %0B
+        </td>
+        <td>
+            &amp;#11;
+        </td>
+    </tr>
+    <tr align="right" bgcolor="#cccccc">
+        <td>
+            &nbsp;
+        </td>
+
+        <td>
+            12
+        </td>
+        <td>
+            %0C
+        </td>
+        <td>
+            &amp;#12;
+        </td>
+    </tr>
+
+    <tr align="right" bgcolor="#ffffff">
+        <td>
+            &nbsp;
+        </td>
+        <td>
+            13
+        </td>
+        <td>
+            %0D
+        </td>
+
+        <td>
+            &amp;#13;
+        </td>
+    </tr>
+    <tr align="right" bgcolor="#cccccc">
+        <td>
+            &nbsp;
+        </td>
+        <td>
+
+            14
+        </td>
+        <td>
+            %0E
+        </td>
+        <td>
+            &amp;#14;
+        </td>
+    </tr>
+    <tr align="right" bgcolor="#ffffff">
+
+        <td>
+            &nbsp;
+        </td>
+        <td>
+            15
+        </td>
+        <td>
+            %0F
+        </td>
+        <td>
+
+            &amp;#15;
+        </td>
+    </tr>
+    <tr align="right" bgcolor="#cccccc">
+        <td>
+            &nbsp;
+        </td>
+        <td>
+            16
+        </td>
+
+        <td>
+            %10
+        </td>
+        <td>
+            &amp;#16;
+        </td>
+    </tr>
+    <tr align="right" bgcolor="#ffffff">
+        <td>
+            &nbsp;
+
+        </td>
+        <td>
+            17
+        </td>
+        <td>
+            %11
+        </td>
+        <td>
+            &amp;#17;
+        </td>
+
+    </tr>
+    <tr align="right" bgcolor="#cccccc">
+        <td>
+            &nbsp;
+        </td>
+        <td>
+            18
+        </td>
+        <td>
+
+            %12
+        </td>
+        <td>
+            &amp;#18;
+        </td>
+    </tr>
+    <tr align="right" bgcolor="#ffffff">
+        <td>
+            &nbsp;
+        </td>
+
+        <td>
+            19
+        </td>
+        <td>
+            %13
+        </td>
+        <td>
+            &amp;#19;
+        </td>
+    </tr>
+
+    <tr align="right" bgcolor="#cccccc">
+        <td>
+            &nbsp;
+        </td>
+        <td>
+            20
+        </td>
+        <td>
+            %14
+        </td>
+
+        <td>
+            &amp;#20;
+        </td>
+    </tr>
+    <tr align="right" bgcolor="#ffffff">
+        <td>
+            &nbsp;
+        </td>
+        <td>
+
+            21
+        </td>
+        <td>
+            %15
+        </td>
+        <td>
+            &amp;#21;
+        </td>
+    </tr>
+    <tr align="right" bgcolor="#cccccc">
+
+        <td>
+            &nbsp;
+        </td>
+        <td>
+            22
+        </td>
+        <td>
+            %16
+        </td>
+        <td>
+
+            &amp;#22;
+        </td>
+    </tr>
+    <tr align="right" bgcolor="#ffffff">
+        <td>
+            &nbsp;
+        </td>
+        <td>
+            23
+        </td>
+
+        <td>
+            %17
+        </td>
+        <td>
+            &amp;#23;
+        </td>
+    </tr>
+    <tr align="right" bgcolor="#cccccc">
+        <td>
+            &nbsp;
+
+        </td>
+        <td>
+            24
+        </td>
+        <td>
+            %18
+        </td>
+        <td>
+            &amp;#24;
+        </td>
+
+    </tr>
+    <tr align="right" bgcolor="#ffffff">
+        <td>
+            &nbsp;
+        </td>
+        <td>
+            25
+        </td>
+        <td>
+
+            %19
+        </td>
+        <td>
+            &amp;#25;
+        </td>
+    </tr>
+    <tr align="right" bgcolor="#cccccc">
+        <td>
+            &nbsp;
+        </td>
+
+        <td>
+            26
+        </td>
+        <td>
+            %1A
+        </td>
+        <td>
+            &amp;#26;
+        </td>
+    </tr>
+
+    <tr align="right" bgcolor="#ffffff">
+        <td>
+            &nbsp;
+        </td>
+        <td>
+            27
+        </td>
+        <td>
+            %1B
+        </td>
+
+        <td>
+            &amp;#27;
+        </td>
+    </tr>
+    <tr align="right" bgcolor="#cccccc">
+        <td>
+            &nbsp;
+        </td>
+        <td>
+
+            28
+        </td>
+        <td>
+            %1C
+        </td>
+        <td>
+            &amp;#28;
+        </td>
+    </tr>
+    <tr align="right" bgcolor="#ffffff">
+
+        <td>
+            &nbsp;
+        </td>
+        <td>
+            29
+        </td>
+        <td>
+            %1D
+        </td>
+        <td>
+
+            &amp;#29;
+        </td>
+    </tr>
+    <tr align="right" bgcolor="#cccccc">
+        <td>
+            &nbsp;
+        </td>
+        <td>
+            30
+        </td>
+
+        <td>
+            %1E
+        </td>
+        <td>
+            &amp;#30;
+        </td>
+    </tr>
+    <tr align="right" bgcolor="#ffffff">
+        <td>
+            &nbsp;
+
+        </td>
+        <td>
+            31
+        </td>
+        <td>
+            %1F
+        </td>
+        <td>
+            &amp;#31;
+        </td>
+
+    </tr>
+    <tr align="right" bgcolor="#cccccc">
+        <td>
+            &nbsp;
+        </td>
+        <td>
+            32
+        </td>
+        <td>
+
+            %20 or +
+        </td>
+        <td>
+            &amp;#32;
+        </td>
+    </tr>
+    <tr align="right" bgcolor="#ffffff">
+        <td>
+            !
+        </td>
+
+        <td>
+            33
+        </td>
+        <td>
+            %21
+        </td>
+        <td>
+            &amp;#33;
+        </td>
+    </tr>
+
+    <tr align="right" bgcolor="#cccccc">
+        <td>
+            "
+        </td>
+        <td>
+            34
+        </td>
+        <td>
+            %22
+        </td>
+
+        <td>
+            &amp;quot;
+        </td>
+    </tr>
+    <tr align="right" bgcolor="#ffffff">
+        <td>
+            #
+        </td>
+        <td>
+
+            35
+        </td>
+        <td>
+            %23
+        </td>
+        <td>
+            &amp;#35;
+        </td>
+    </tr>
+    <tr align="right" bgcolor="#cccccc">
+
+        <td>
+            $
+        </td>
+        <td>
+            36
+        </td>
+        <td>
+            %24
+        </td>
+        <td>
+
+            &amp;#36;
+        </td>
+    </tr>
+    <tr align="right" bgcolor="#ffffff">
+        <td>
+            %
+        </td>
+        <td>
+            37
+        </td>
+
+        <td>
+            %25
+        </td>
+        <td>
+            &amp;#37;
+        </td>
+    </tr>
+    <tr align="right" bgcolor="#cccccc">
+        <td>
+            &amp;
+
+        </td>
+        <td>
+            38
+        </td>
+        <td>
+            %26
+        </td>
+        <td>
+            &amp;amp;
+        </td>
+
+    </tr>
+    <tr align="right" bgcolor="#ffffff">
+        <td>
+            '
+        </td>
+        <td>
+            39
+        </td>
+        <td>
+
+            %27
+        </td>
+        <td>
+            &amp;#39;
+        </td>
+    </tr>
+    <tr align="right" bgcolor="#cccccc">
+        <td>
+            (
+        </td>
+
+        <td>
+            40
+        </td>
+        <td>
+            %28
+        </td>
+        <td>
+            &amp;#40;
+        </td>
+    </tr>
+
+    <tr align="right" bgcolor="#ffffff">
+        <td>
+            )
+        </td>
+        <td>
+            41
+        </td>
+        <td>
+            %29
+        </td>
+
+        <td>
+            &amp;#41;
+        </td>
+    </tr>
+    <tr align="right" bgcolor="#cccccc">
+        <td>
+            *
+        </td>
+        <td>
+
+            42
+        </td>
+        <td>
+            *
+        </td>
+        <td>
+            &amp;#42;
+        </td>
+    </tr>
+    <tr align="right" bgcolor="#ffffff">
+
+        <td>
+            +
+        </td>
+        <td>
+            43
+        </td>
+        <td>
+            %2B
+        </td>
+        <td>
+
+            &amp;#43;
+        </td>
+    </tr>
+    <tr align="right" bgcolor="#cccccc">
+        <td>
+            ,
+        </td>
+        <td>
+            44
+        </td>
+
+        <td>
+            %2C
+        </td>
+        <td>
+            &amp;#44;
+        </td>
+    </tr>
+    <tr align="right" bgcolor="#ffffff">
+        <td>
+            -
+
+        </td>
+        <td>
+            45
+        </td>
+        <td>
+            -
+        </td>
+        <td>
+            &amp;#45;
+        </td>
+
+    </tr>
+    <tr align="right" bgcolor="#cccccc">
+        <td>
+            .
+        </td>
+        <td>
+            46
+        </td>
+        <td>
+
+            .
+        </td>
+        <td>
+            &amp;#46;
+        </td>
+    </tr>
+    <tr align="right" bgcolor="#ffffff">
+        <td>
+            /
+        </td>
+
+        <td>
+            47
+        </td>
+        <td>
+            %2F
+        </td>
+        <td>
+            &amp;#47;
+        </td>
+    </tr>
+
+    <tr align="right" bgcolor="#cccccc">
+        <td>
+            0
+        </td>
+        <td>
+            48
+        </td>
+        <td>
+            0
+        </td>
+
+        <td>
+            0
+        </td>
+    </tr>
+    <tr align="right" bgcolor="#ffffff">
+        <td>
+            1
+        </td>
+        <td>
+            49
+        </td>
+
+        <td>
+            1
+        </td>
+        <td>
+            1
+        </td>
+    </tr>
+    <tr align="right" bgcolor="#cccccc">
+        <td>
+            2
+        </td>
+
+        <td>
+            50
+        </td>
+        <td>
+            2
+        </td>
+        <td>
+            2
+        </td>
+    </tr>
+
+    <tr align="right" bgcolor="#ffffff">
+        <td>
+            3
+        </td>
+        <td>
+            51
+        </td>
+        <td>
+            3
+        </td>
+
+        <td>
+            3
+        </td>
+    </tr>
+    <tr align="right" bgcolor="#cccccc">
+        <td>
+            4
+        </td>
+        <td>
+            52
+        </td>
+
+        <td>
+            4
+        </td>
+        <td>
+            4
+        </td>
+    </tr>
+    <tr align="right" bgcolor="#ffffff">
+        <td>
+            5
+        </td>
+
+        <td>
+            53
+        </td>
+        <td>
+            5
+        </td>
+        <td>
+            5
+        </td>
+    </tr>
+
+    <tr align="right" bgcolor="#cccccc">
+        <td>
+            6
+        </td>
+        <td>
+            54
+        </td>
+        <td>
+            6
+        </td>
+
+        <td>
+            6
+        </td>
+    </tr>
+    <tr align="right" bgcolor="#ffffff">
+        <td>
+            7
+        </td>
+        <td>
+            55
+        </td>
+
+        <td>
+            7
+        </td>
+        <td>
+            7
+        </td>
+    </tr>
+    <tr align="right" bgcolor="#cccccc">
+        <td>
+            8
+        </td>
+
+        <td>
+            56
+        </td>
+        <td>
+            8
+        </td>
+        <td>
+            8
+        </td>
+    </tr>
+
+    <tr align="right" bgcolor="#ffffff">
+        <td>
+            9
+        </td>
+        <td>
+            57
+        </td>
+        <td>
+            9
+        </td>
+
+        <td>
+            9
+        </td>
+    </tr>
+    <tr align="right" bgcolor="#cccccc">
+        <td>
+            :
+        </td>
+        <td>
+
+            58
+        </td>
+        <td>
+            %3A
+        </td>
+        <td>
+            &amp;#58;
+        </td>
+    </tr>
+    <tr align="right" bgcolor="#ffffff">
+
+        <td>
+            ;
+        </td>
+        <td>
+            59
+        </td>
+        <td>
+            %3B
+        </td>
+        <td>
+
+            &amp;#59;
+        </td>
+    </tr>
+    <tr align="right" bgcolor="#cccccc">
+        <td>
+            &lt;
+        </td>
+        <td>
+            60
+        </td>
+
+        <td>
+            %3C
+        </td>
+        <td>
+            &amp;lt;
+        </td>
+    </tr>
+    <tr align="right" bgcolor="#ffffff">
+        <td>
+            =
+
+        </td>
+        <td>
+            61
+        </td>
+        <td>
+            %3D