<?xml version='1.0' encoding="ISO-8859-1"?>
<xsl:stylesheet version="1.1" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:output method="html" indent="no" encoding="iso-8859-1" />
<!--@+leo-->
<!--@+node:0::@file multilevel.xsl-->
<!--@+body-->
<!--@@first-->
<!--@@first-->
<!--@@first-->
<!--@@language html-->

<!-- 

Author: Joe Orr, copyright 2001x.
Use permitted under the same terms as the Perl Artistic License. See
http://www.perl.com/pub/a/language/misc/Artistic.html for more information.

CLIENT.XSL IS A DERIVED FILE. DO NOT EDIT CLIENT.XSL DIRECTLY - YOUR EDITS WILL BE OVERWRITTEN.

To edit this file, see the associated LEO file (flextable.leo).

See associated LEO file for complete documentation, including version information.

-->


<!--@<< parameters >>-->
<!--@+node:1::<< parameters >>-->
<!--@+body-->
<!--@@code-->

<!-- appPrefix: valid values: QN, QE -->
<xsl:param name="appPrefix" select="'QE'"/>

<!-- paged: valid values: true, false -->
<xsl:param name="paged" select="'false'"/>

<!-- reportTitle valid values: anything -->
<xsl:param name="reportTitle" select="'Your Title Here'"/>

<!-- printReportTitle valid values: anything -->
<xsl:param name="printReportTitle" select="'Summit Inquiry'"/>

<!-- titleFormat valid values: 'pagehead', 'pagehead2', or add a new custom style to the stylesheet -->
<xsl:param name="titleFormat" select="'pagehead'"/>

<!-- orientation valid values: 'portrait', 'landscape' -->
<xsl:param name="orientation" select="'landscape'"/>

<!-- rowCount valid values: numeric -->
<xsl:param name="rowCount" select="'22'"/>

<!-- navigation valid values: 
	   'true' - navbar will show
	   'false' - navbar will be hidden -->
<xsl:param name="navigation" select="'true'"/>

<!-- pop up window? true or false -->
<xsl:param name="popUp" select="'true'"/>

<!-- customization valid values:
	   'true' - (default) customization dialog will be displayed
	   'false' - customization dialog will not be displayed -->
<xsl:param name="customization" select="'true'"/>

<!-- footnote valid values: any string except 'null': will be displayed.
	 'null' : nothing will be displayed
	 '': "1 of 6 rows" will be displayed -->
<xsl:param name="footnote" select="''"/>

<!-- numOfFrozenCols valid values: a single digit number -->
<xsl:param name="numNonScrollingCols" select="'0'"/>

<!-- leftPanePixelWidth: a single digit number-->
<xsl:param name="leftPanePixelWidth" select="'50'"/>

<!-- table width -->
<xsl:param name="tableWidth" select="782"/>

   

<!--@-body-->
<!--@-node:1::<< parameters >>-->


<!--@<< global variables >>-->
<!--@+node:2::<< global variables >>-->
<!--@+body-->
<!--@@code-->

<xsl:variable name="rightPanePixelWidth">
  <xsl:choose> 
    <xsl:when test="$numNonScrollingCols != '0'"><xsl:value-of select="'770' - $leftPanePixelWidth"/></xsl:when> 
    <xsl:otherwise><xsl:value-of select="'770'"/></xsl:otherwise>
  </xsl:choose>    
</xsl:variable>  


<!-- KLUDGE SECTION 
     This section should be removed as soon as convenient. 
-->

<xsl:variable name="printReportTitlex">
  <xsl:choose>
    <xsl:when test="$appPrefix = 'QE'">SUMMIT Inquiry Results (Fast Print)</xsl:when>
    <xsl:otherwise>Standard Report</xsl:otherwise>
  </xsl:choose>
</xsl:variable>

<!-- END KLUDGE SECTION -->


<!-- if the navigation is turned off, set the number of rows to be displayed to be equal to the total number of rows in the xml -->
<xsl:variable name="newRowCount">
  <xsl:choose>
	<xsl:when test="$navigation = 'false'">
	  <xsl:value-of select="count(//rows/row)"/> 
	</xsl:when>
	<xsl:otherwise>
	  <xsl:value-of select="$rowCount"/>
	</xsl:otherwise>
  </xsl:choose>
</xsl:variable>


<!--@-body-->
<!--@-node:2::<< global variables >>-->


<!--@<< main template >>-->
<!--@+node:3::<< main template >>-->
<!--@+body-->
<!--@@code-->

<xsl:template match="/">

<html>


<!--@<< head >>-->
<!--@+node:1::<< head >>-->
<!--@+body-->
<!--@@code-->

<head id="topw">


<!--@<< css >>-->
<!--@+node:1::<< css >>-->
<!--@+body-->
<!--@@code-->

<style type="text/css">
BODY          {font-family:Arial,sans-serif; font-size:8pt;  font-weight:100; margin-top:0; margin-left:6; margin-right:0}
TD            {font-family:Arial,sans-serif; font-size:8pt;  font-weight:100;}
SELECT        {font-family:Arial,sans-serif; font-size:12px; font-weight:normal}
OPTION        {font-family:Arial,sans-serif; font-size:12px; font-weight:normal}
TH            {font-family:Arial,sans-serif; font-size:12px; font-weight:bold; text-align:left}
BUTTON        {font-size:14; font-weight:bold; width:30; text-align:center}
INPUT         {font-family:Arial; font-size:10pt;}
a:link        {text-decoration:underline;}
a:visited     {text-decoration:underline;}
a:active      {text-decoration:underline;}
a:hover       {text-decoration:underline;}

.plusButton       {font-family:Arial,sans-serif; font-size:8pt; font-weight:normal; width:16; height:6;color:black; background-color:gainsboro; border:1px solid gray; text-align:center;}
.plusButtonHeader {width:20;}
.plusButtonFooter {width:19;}

.pagehead   {color:#0C6EB0; font-family:arial, helvetica, sans-serif; font-weight:bold; font-size:9pt; height:22px;}
.pagehead2  {text-align:center;color:#0C6EB0; font-family:arial, helvetica, sans-serif; font-weight:bold; font-size:11pt;}
.printReportHeader {font-family:Arial,sans-serif; font-size:12pt; font-weight:bold; text-align:center; margin-bottom:5;}

.colhead         {color:white; padding-right:0; cursor:hand; background-color:#003366; height:12; text-align:left; font-weight:bold; border-top:1px solid white; border-right:1px solid white;}
.colheadportrait {color:white; cursor:hand; background-color:slateblue; height:12; text-align:center; font-weight:bold; border-bottom:1px solid white;}
.colheadsorted   {color:white; padding-right:0; cursor:hand; background-color:blue; height:12; text-align:left; font-weight:bold; border-top:1px solid white; border-right:1px solid white;}

.evenrow  {background-color:#E9F2F2; cursor:hand; xline-height:17px;}
.oddrow   {background-color:#C9E5E7; cursor:hand; xline-height:17px;}

.dialogtable   {border:2px solid #000000;background-color:#E9F2F2;}
.dialogrow     {background-color:#C9E5E7; cursor:hand; xline-height:19px;}
.dataTable     {background-color:#FFFFFF}
.datarow       {background-color:lavender;cursor:hand;}
.default       {text-align:right;}
.Text          {text-transform:capitalize;}
.Number        {text-align:right;}
.summaryRow    {background-color:#7EBEBE; color:black; text-align:right; border-color:#7EBEBE;}
.summaryItem   {background-color:#7EBEBE; color:black; font-weight:700; font-size:7pt; height:26px; text-align:right;border-top:1px solid white;border-right:1px solid white;}
.summaryItem2  {background-color:#7EBEBE; color:white; font-weight:700; font-size:7pt; text-align:right;border-bottom:1px solid white;}
.highlightedRow{background-color:navy; color:white; cursor:hand}
.navbutton     {cursor:hand}
.cellStylePortrait {text-align:right;text-transform:capitalize;border-right:1px solid white;border-bottom:1px solid white;}

<!-- deprecated -->
.subTable {margin-left:20;background-color:white;border-collapse:collapse; margin-top:5; width:700;}
.subHead {color:black; background-color:gainsboro; cursor:hand; height:12; text-align:left;}
.subHeadCell {font-weight:bold; border:1px solid teal; text-transform:capitalize}
.subRow   {color:white}
.subCell  {border:1px solid teal;text-transform:capitalize}

<!-- Each table (level) in a hierarchical tree table has 5 styles attached -->
.level1Table {}
.level1Row   {background-color:E1EAEA; cursor:hand}
.level1Cell  {border:1px solid white;}
.level1ColHead {color:white; cursor:hand; background-color:#003366; height:12; text-align:center; font-weight:bold;}
.level1Highlight {background-color:003163; color:white; cursor:hand}

.level2Table {margin-left:40; border-collapse:collapse;background-color:white; margin-top:4;width:700}
.level2Row   {background-color:C8DFDF; text-transform:capitalize; cursor:hand}
.level2Cell  {border:1px solid white;}
.level2ColHeadRow {text-weight:bold; color:white; background-color:#4E8787; cursor:hand; height:12; text-align:left; font-weight:bold; text-transform:capitalize}
.level2ColHeadCell  {border:1px solid white; font-weight:bold; font-size:8pt}
.level2Highlight {background-color:003163; color:white; cursor:hand; text-transform:capitalize}

.sortLink  {color:white;cursor:hand}
.dialogCustom1 {position:absolute; top:4; left:200}
.hSpace1   {height:-1}

.datetime  {text-align:right;}
.money     {text-align:right;}
.char      {text-align:left;text-transform:capitalize;}
.varchar   {text-align:left;text-transform:capitalize;}
.decimal   {text-align:right;}
.timestamp {text-align:right;}
.default,.Text,.Number,.Date,.datetime,.money,.char,.varchar.decimal,.timestamp, {border-top:1px solid white;border-right:1px solid white;}

</style>

<!--@-body-->
<!--@-node:1::<< css >>-->


<xsl:text>
</xsl:text>


<!--@<< script >>-->
<!--@+node:2::<< script >>-->
<!--@+body-->
<!--@@language java-->
<!--@@code-->

<script>

// Script by Joe Orr copyright 2002 under the Perl Artistic License.
// For information about use see: 
// http://www.perl.com/pub/a/language/misc/Artistic.html

// This is a DERIVED file. The source is in a LEO file.
// Formatting of the scripts in this file may not be as intended.
// Also, this script is HEAVILY documented in the source LEO file (flextable.leo) 
// which should be present in the same directory as this one. 
// For information about using LEO see
// http://www.jserv.com/jk_orr/leo.htm

// minor formatting function
var loaded = false;
function init() {
  <xsl:if test="$customization != 'false'">
  orientation[0].checked = 'true'; 
  </xsl:if>
  loaded = true;

//  fso = new ActiveXObject("Scripting.FileSystemObject");
//  f = fso.CreateTextFile('test95.htm',true);
//  f.write(document.documentElement.innerHTML);
//  f.Close();

}


<!--@<< dhtmltable object >>-->
<!--@+node:1::<< dhtmltable object >>-->
<!--@+body-->
<!--@@code-->


<!--@<< constructor >>-->
<!--@+node:1::<< constructor >>-->
<!--@+body-->
<!--@@code-->

// N.B. LOTS of extra documentation for this code is in the LEO file
// in which the code was created.


// the table object ==============================
/**
 * @numRows      the number of rows to display at a time
 * @index        the starting row for the dataArray, from which comes the table data
 * @id           the DOM id to be given to the DHTML table
 * @name         set this to the same name as the variable holding the instance of this object
 * @dataArray    the name of a two-dimensional array contain the data to be put in the table
 * @container    the html element in which to place this table
 * @colNames     column names (field names)
 * @colTitles    column headings
 * @colTypes     array containing datatype of each cell (determines cell formatting, e.g. right-alignment)
 * @colFormats   array containing data formats for cell item (determines formatting of item, e.g. currency)
 * @orientation  (optional) portrait or landscape
 * @tableStyle   (optional) if 'masterdetail' will display tree grid
 * @totalsHash   (optional) an associate array (hash) containing col name keys and sum values.
 * @detail       (optional) object holding the url for the detail page and list of params.
 *                             When user double clicks on a line, the colum values corresponding to
 *                             the param names will be appended to the url and browser will be
 *                             redirected to the resulting url.
 *
 * if you use one of the 'optional' parameters, you'll have to pass in null for any optional
 * parameters to the left of the optional parameter you are using. True optional parameters
 * aren't available for Javascript 1.2
 */
function clsDHTMLTable (numRows, index, id, name, container, dataArray, colNames, colTitles, colTypes, colFormats, orientation, tableStyle, totalsHash, detail) {
<![CDATA[

  // required parameters =====================================
  this.tableRows = numRows;
  this.startRow  = index;
  this.id        = id;
  this.name      = name;
  this.dataArray = dataArray;
  this.totalRows = dataArray.length;
  this.container = container;
  this.names     = colNames;
  this.titles    = colTitles;
  this.types     = colTypes;
  this.formats   = colFormats;
  // end of required parameters section =======================

  // optional parameters ======================================  
  // orientation:  
  //   landscape = col header (normal database table presentation, field name is in col header)
  //   portrait  = row header (rows become columns, field name is in row header)
  this.orientation = orientation;
  if (! this.orientation) this.orientation = 'landscape';
  this.tableStyle = tableStyle; // paged, scrolling or master detail
  if (! this.tableStyle) this.tableStyle = 'paged';
  this.totalsHash = totalsHash; // associative array (hash) containing col names and totals
  this.details = oDetailJSP;
  // end of optional parameters section =======================

  // used for remembering which row is highlighted
  this.highlightedRow = null;
  // used for holding col totals (which we might calculate ourselves)
  this.colTotals = new Array();

  // array to hold flag indicating whether a given column is to have
  // a total calculated by the script
  this.totalFlags = new Array();

  // array to hold list of columns that will not scroll horizontally (they will be
  // placed in left side, outside of horizontally scrolling window)
  this.nonScrollingColumns = new Array();

  // other properties 
  this.mixedCase = true;
  this.divHeight = 0; //if this is greater than 0, the table will be displayed in a scrolling window
  this.showLineNums = false;
  this.colPickList = false;
  this.tableWidth = ]]><xsl:value-of select="$tableWidth"/><![CDATA[

  // next property is currently not being used but is used when 
  // implementing single-click multicolumn sort
  this.numOfColumnsToSort = 2;

  // create an array to hold a list of the indexes in the order in which
  // you want them displayed. This is used for "moving" columns around.
  this.columnIndexes = new Array();
  for (i = 0; i < this.dataArray[0].length; i++) this.columnIndexes[i] = i;

  // Do the same thing for the rows. This is used for sorting rows.
  this.rowIndexes = new Array();
  for (i = 0; i < this.dataArray.length; i++) this.rowIndexes[i] = i;

  // An array to add arbitrary functions to summarize a column
  // For future functionality
  //this.sumFunctions = new Array();
  //for (i = 0; i < this.columnIndexes.length; i++) this.sumFunctions[i] = 'nothing';

  // An array to hold the styles so we can do stuff like overwrite the cursor
  // for all styles with the hourglass icon and then restore the original.
  // This array is describing something in the page (the stylesheet) so it isn't really
  // necessary to put inside the object. However, this is done to make the code more
  // component-like.
  this.rules = new Array();

  // for remembering which row we are currently on
  this.currDetailRow = -2; 

  // for remembering which row we are currently on
  this.currHighlightedRow = -2; 
  
  // resize table after window has been resized  
  this.resized = false;
  window.onresize = this.flagResize;


]]>
}

<!--@-body-->
<!--@-node:1::<< constructor >>-->


<!--@<< other dhtml table methods >>-->
<!--@+node:2::<< other dhtml table methods >>-->
<!--@+body-->
<!--@@code-->


<!--@<< accessor methods >>-->
<!--@+node:1::<< accessor methods >>-->
<!--@+body-->
<!--@@code-->

<![CDATA[
/**
 * Set the number of rows that the table will display
 * @param numRows   The number of rows to display. This can be changed at any time, and 
 *                  the table will redraw with the requested number of rows. If the table
 *                  is displaying in portrait mode, this is actually the number of columns,
 */
function setTableRows (numRows) {
  numRows = numRows / 1;  // make sure Javascript knows that it is a number
  if (numRows == "") numRows = this.tableRows;
  if (numRows < 2) {alert("At least 2 records must be displayed."); return}
  if (numRows > this.totalRows) {numRows = this.totalRows}
  if (numRows > 50) {alert("Maximum of 50 rows may be displayed"); numRows = 50;}
  this.tableRows = numRows / 1;  
  this.startRow = 0;
  if (this.orientation == 'landscape') {
	//if (this.divHeight > 0) this.divHeight = numRows * 24 + 90; 
  }
  this.drawEmptyTable();
  this.fillTable();

}
/**
 * Set which is the first record (from the array of data) from which the table
 * will start filling.
 *
 */ 
function setStartRow (r) {
  r = r / 1;  // make sure it Javascript knows that it is a number
  if (r + this.tableRows > this.totalRows) {
	r = this.totalRows - this.tableRows;      
  }
  if (r < 0) r = 0;
  this.startRow = r;
  this.fillTable();
}

function setOrientation (x) {
  if (x != 'portrait' && x != 'landscape') return; 
  this.orientation = x;
  if (x == 'portrait') {
	//this.divHeight = this.columnIndexes.length * 26;
  } else {
	//this.divHeight = this.tableRows * 24 + 90;
  }
  this.drawEmptyTable();
  this.fillTable();
}

// next function not currently in use
function setNumOfColumnsToSort (i) {
  if (i < 4 && i > 0) this.numOfColumnsToSort = i;
}

]]>


<!--@-body-->
<!--@-node:1::<< accessor methods >>-->


<!--@<< current detail row methods >>-->
<!--@+node:2::<< current detail row methods >>-->
<!--@+body-->
<!--@@code-->

<![CDATA[

// Next three functions are for remembering what row is the
// current detail row (the row being viewed in detail view).
function getCurr() {
  return rows[this.currDetailRow + this.startRow][0];  
}

function getNext() {
  if (this.currDetailRow + this.startRow < this.dataArray.length - 1) {
    return rows[this.currDetailRow + this.startRow + 1][0];
  } else {
    return -1;
  }  
}

function getPrev() {
  if (this.currDetailRow > 0) {
    return rows[this.currDetailRow + this.startRow - 1][0];
  } else {
    return -1;
  }

}

]]>

<!--@-body-->
<!--@-node:2::<< current detail row methods >>-->


<!--@<< column totals >>-->
<!--@+node:3::<< column totals >>-->
<!--@+body-->
<!--@+doc-->
<!--


This function will calculate col totals. (Col totals can also be
passed via the xml). You have to tell the object to calculate a
particular row:

 Tell the dataTable object to sum the 3d column:
 dataTable.totalFlags[2] = true;


-->

<!--@-doc-->
<!--@@code-->
<![CDATA[

function calculateColTotals() {

  var summClass = 'summaryItem';
  if (this.orientation == 'portrait') summClass = 'summaryItem2';

  for(c = 0; c < this.columnIndexes.length; c++){
  	total = "&nbsp;";

  	// if flags have been set for us to calculate the col totals, do so now
  	if (this.totalFlags[c] != undefined) {
  	  total = 0;
  	  for (j = 0; j < this.totalRows; j++) {
  		num = this.dataArray[j][c];
  		num = num / 1 ;
  		total += num;
  	  }
  	  total = total * 100;
  	  total = Math.round(total)
  	  total = total / 100;
  	  if (this.formats[c] == "MYF") total = this.formatItem(total, "MYF");
  	}
  	// if col totals have been passed in via the hashTotals, use those. 
  	if (this.totalsHash) {
  	   // if there is key in the totalsHash corresponding to the name of
  	   // the current col, then get the value for that key as the total
  	   if (this.totalsHash[this.names[c]] != undefined) {
  		 total = this.totalsHash[this.names[c]];
  		   // format the total based according to the format specified for the current col
  		   total = formatItem(total, this.formats[c]);
  		 }
  	}	
  	this.colTotals[c] = '<td class="' + summClass + '"><nobr style="overflow:hidden" id="sumCell">' + total + '</nobr></td>';	
  }

}  

]]>

<!--@-body-->
<!--@-node:3::<< column totals >>-->


<!--@<< draw and fill table >>-->
<!--@+node:4::<< draw and fill table >>-->
<!--@+body-->
<!--@+doc-->
<!--


drawEmptyTable draws an empty table.
fillTable populates it with data.


-->

<!--@-doc-->
<!--@@code-->


<!--@<< draw empty table >>-->
<!--@+node:1::<< draw empty table >>-->
<!--@+body-->
<!--@@code-->

<![CDATA[

function drawEmptyTable() {
  var rowStyle;
  var cellStyle;
  var html = '';

  // start table dhtml (main dhtml, will be right pane when there are two panes)
  html += "<table id='" + this.id + "' border='0' cellpadding='2' bgcolor='white' cellspacing='0' STYLE='border-collapse:collapse;border-color:white;' class='dataTable';>";

  // start container table with left pane for holding non-scrollable columns
  // and right pane to hold the data table
  html = '<table border="0" cellspacing="0" cellpadding="0"><tr>'
	 + '<td valign="top"><div id="leftPane"></div></td>'
	 + '<td><div id="rightPane" style="width:' + this.tableWidth + '; overflow-X:auto;">' 
	 + html    

    
		var aHeadings = new Array();
		var nowrap = "";
		var item;


		var pickList = "";

		for(c = 0; c < this.columnIndexes.length; c++){

		  // if picklist will appear in place of col headers
		  if (this.pickList) {
			
				  pickList = "<select onclick=\"window.event.cancelBubble = true;\" onchange='dataTable.changeCol(" + c + ", this.value, this.options[this.selectedIndex].text)'>";
				  // loop thru all of the field titles to create a pick list
				  for (cc = 0; cc < this.columnIndexes.length; cc++) {
					pickList += "<option value='";
					pickList += cc;
					pickList += "'";
					if (cc == this.columnIndexes[c]) pickList += " selected ";
					pickList += ">" + this.titles[cc];
					pickList += "</option>";
				  }
				  pickList += "</select>";
				  item = pickList;
				} else {

				  item = this.titles[this.columnIndexes[c]];
				  item = '<span class="sortLink">' + item + '</span>';
			  	  	
		  }

		  if (this.orientation == 'landscape') {
			
					  aHeadings[c] = '<td' 
			  		  + ' class="colhead" ' 
			  		  + nowrap + ' col="' + c + '" id="' + this.id + 'Col' + c + '">' 

					  // mini table to contain header + resize link
					  + '<nobr>'
					  + '<table width="100%" border="0" cellspacing="0" cellpadding="0"><tr>' 
					  // label (col head text)
					  + '<td  onmousedown="dataTable.showHourGlass();" title="Click to Sort Table on This Column"' 
					  + ' onclick="dataTable.sortRows(this.parentElement.parentElement.parentElement.parentElement.parentElement, ' + c + ',1); "'		  
			//          + ' onclick="dataTable.sortRows(' + this.id + 'Col' + c + ',' + c + '); "'		  
					  + '>'
					  + '<nobr id="colLabel"><b>' + item + '</b></nobr>' 
					  + '</td>'
					  // resizing handle
					  + '<td onmouseover="this.style.cursor=\'E-resize\'" onmousedown="colresize=true;dataTable.TDselDown()" style="width:8" title="Drag to Resize" >&nbsp;&nbsp;</td>'
					  + '</tr></table>'
					  + '</nobr>'
					  // end of mini table

					  + '</td>';
			
		  } else {
			aHeadings[c] = '<td ' 
			 + ' class="colheadportrait" ' 
			 + nowrap + ' col="' + c + '" id="' + this.id + 'Col' + c + '">' + item + '</td>';
		  }

		}

		// add col headers to html
		if (this.orientation != 'portrait') { 

			html += "<tr>";
			for (i = 0; i < aHeadings.length; i++) html += aHeadings[i];
			html += "</tr>";
	  }
	

    this.calculateColTotals();  

    var maxR = this.tableRows;
    var maxC = this.columnIndexes.length;

    // If in portrait orientation, the table is in effect rotated 90 degrees to the left
    // Therefore, the rows become columns and the columns become rows, from the standpoint 
    // of the original orientation.
    if (this.orientation == 'portrait') {
  	maxR = this.columnIndexes.length;
  	maxC = this.tableRows;
    }
    var startC = 0;
    if (this.showLineNums) startC = -1;

	  for(r = 0; r < maxR; r++){

	  	// alternate the row styles
	  	rowStyle = 'oddrow';
	  	if (r % 2 == 0) rowStyle = 'evenrow';

	//  	if (this.tableStyle == 'masterDetail') rowStyle = 'dataRow';

	  	// TR
		html += "<tr ondblclick='" 
	  			   + this.name + ".goSubreport(this);'" 
	  			   + " class='" + rowStyle + "'" 
	  			   + " onclick='" + this.name + ".highlightRow(this); selection.empty()'" 
	  			   + " rowIndex=" + r 
	  			   + ">";

	  	// if it is portrait format, then put field titles in first cell of each row
	  	if (this.orientation == 'portrait') {
	  	   html += aHeadings[r];
	  	}

	  	// TD
		for(c = startC; c < maxC; c++){
	  	  cellStyle = this.types[this.columnIndexes[c]];
	  	  if (this.orientation == 'portrait') cellStyle = 'cellStylePortrait';
	 	  html += '<td nowrap class="' + cellStyle + '" ><nobr>&nbsp;</nobr></td>';	
	  	}

	  	// if it is portrait format, then put totals in last cell of row
	  	if (this.orientation == 'portrait') html += this.colTotals[r];

	  	html += "</tr>";

	  } // end of row loop
	
    
		  // Footer row for summaries. 
		  var total;
		  var num;
		  html += "<tr class='summaryRow'>";
		  if (this.orientation != 'portrait') {
			for (i = 0; i < this.colTotals.length; i++) html += this.colTotals[this.columnIndexes[i]];
			html += "</tr>";
		  }
		  

    // finish data table (right pane)
    html += "</table>";
  	 

  // close container table (that has left pane and right pane)
  html += '<br></div></td></tr></table>';

  
    // start box to display record count and current index and navbar
   html += '<table border="0" width="100%"><tr></tr>';
   html += '<tr></tr>';
   html += "<td align='left' nowrap align='left'><span id='" + this.id + "Footer'></span></td>"

     
	    /*
	 	* add navbar. This consists of 4 button images.
	 	* Each button has an id which consists of the table id (dom id of the dthml table) concatenated with:
	 	*   buttonFirst, buttonPrev, buttonNext, buttonLast
	 	* Each button has the onclick event linked to an appropriate method:
	 	*   goFirst, goPrev, goNext, goLast 
	 	*/
	 	var b1 = '<img' 
	   		   + ' onclick="' + this.name + '.goFirst()"' 
	   		   + ' id="' + this.id	+ 'ButtonFirst" ' 
	   		   + ' alt="First Record" '
	   		   + ' style="cursor:hand;filter:gray alpha(opacity=20)" '
	   		   + ' src="../images/up1.gif">'; 
	 	var b2 = '<img' 
	   		   + ' onclick="' + this.name + '.goPrev()"' 
	   		   + ' id="' + this.id	+ 'ButtonPrev" '
	   		   + ' alt="Prev Page" ' 
	   		   + ' style="cursor:hand;filter:gray alpha(opacity=20)"'
	   		   + ' src="../images/up2.gif">'; 
	 	var b3 = '<img' 
	   		   + ' onclick="' + this.name + '.goNext()"' 
	   		   + ' id ="' + this.id	+ 'ButtonNext" ' 
	   		   + ' alt="Next Page" ' 
	   		   + ' style="cursor:hand;filter:gray alpha(opacity=20)" '
	   		   + ' src="../images/down2.gif">'; 
	 	var b4 = '<img' 
	   		   + ' onclick="' + this.name + '.goLast()"' 
	   		   + ' id ="' + this.id	+ 'ButtonLast" ' 
	   		   + ' alt="Last Page" ' 
	   		   + ' style="cursor:hand;filter:gray alpha(opacity=20)" '
	   		   + ' src="../images/down1.gif">'; 	

	 	var navBarStyle = 'display:block';  

	 	]]>

	 	<xsl:choose>
	 	<xsl:when test="$navigation != 'true'">
	   	 <![CDATA[navBarStyle = 'display:none';]]>
	 	</xsl:when>
	 	<xsl:otherwise>
		<![CDATA[navBarStyle = 'display:none';]]>
	 	</xsl:otherwise>
	 	</xsl:choose>

	   <![CDATA[

	   var navBar = '<td align="left">&nbsp;' 
	 	 + '<table cellspacing="0" cellpadding="0" border="0" style="' + navBarStyle 
	 	 + ';position:absolute;left:600px;"><tr>' 
	 	 + '<td>' + b1 + '</td><td>' + b2 + '</td><td>' + b3 + '</td><td>' + b4 + '</td>'
	 	 + '</tr></table>'
	   	 + '</td>'

	 	html += navBar;
	 

    // close box to display record count and current index and navbar
    html += '</table>';

  // render the table
  eval (this.container + ".innerHTML = html");

}

]]>


<!--@-body-->
<!--@-node:1::<< draw empty table >>-->


<!--@<< fill table >>-->
<!--@+node:2::<< fill table >>-->
<!--@+body-->
<!--@@code-->
<![CDATA[

/*
 *@showNavigation  If not false, the navbuttons will be greyed as appropriate. This
 *                 doesn't determine whether the buttons exist, only whether they 
 *				   are updated to show the current navigable status of the widget.
 */
function fillTable(showNavigation) {

  var maxR = Math.min(this.tableRows, this.totalRows);
  var maxC = this.columnIndexes.length;
  var startC = 0;
  var oDHTMLTable = eval(this.id);

  var colShift = 0;
  var rowShift = 0;
	   
  if (this.orientation == 'portrait') {
	  
	  maxR = this.columnIndexes.length;
	  maxC = Math.min(this.tableRows, this.totalRows);
	  for(c = 0; c < maxC; c++){
	    for(r = 0; r < maxR; r++){
	  	oDHTMLTable.rows(r + rowShift).cells(c + 1).innerHTML = this.formatItem(rows[this.rowIndexes[c +   this.startRow]][this.columnIndexes[r]], this.formats[this.columnIndexes[r]], this.types[this.columnIndexes[r]]);
	    }
	  }
	  changeStyle('.colhead', 'height', '12');
	  
	} else if (this.orientation == 'landscape') {
	  
	  for(r = 0; r < maxR; r++){
	    for(c = 0; c < maxC; c++){
	  	//tmp = this.formatItem(this.dataArray[this.rowIndexes[r +  this.startRow]][this.columnIndexes[c]], this.formats[this.columnIndexes[c]],this.types[this.columnIndexes[c]])
	  	tmp = this.formatItem(this.dataArray[r +  this.startRow][this.columnIndexes[c]], this.formats[this.columnIndexes[c]],this.types[this.columnIndexes[c]])
	  	//tmp = '<nobr>' + tmp + '</nobr>';
	  	oDHTMLTable.rows(r + 1).cells(c + colShift).firstChild.innerHTML = tmp;
	    }
	  }
	  changeStyle('.colhead', 'height', '42');
	  
  }  
  ]]>
  
  // table footer ("1 - 5 of 100 rows found")
  <xsl:choose>
  <xsl:when test="$footnote = ''">
  var f = (this.startRow + 1) + " - " + (Math.min(this.startRow + this.tableRows, this.totalRows)) 
     + " of " 
     + this.totalRows + " found ";
  eval (this.id + "Footer.innerHTML = '" + f + "'"); 
  </xsl:when>
  <xsl:when test="$footnote = 'null'">
  </xsl:when>
  <xsl:otherwise>
  eval (this.id + "Footer.innerHTML = '" + "<xsl:value-of select="$footnote"/>" + "'"); 
  </xsl:otherwise>
  </xsl:choose>
  
<![CDATA[

  
  if (showNavigation != false) {
    eval (this.id + 'ButtonFirst.style.filter = ""');
    eval (this.id + 'ButtonPrev.style.filter = ""');
    eval (this.id + 'ButtonNext.style.filter = ""');
    eval (this.id + 'ButtonLast.style.filter = ""');
    if (this.startRow == 0) {
  	eval (this.id + 'ButtonFirst.style.filter = "gray alpha(opacity=20)"');
  	eval (this.id + 'ButtonPrev.style.filter = "gray alpha(opacity=20)"');
    } 
    if (this.startRow + this.tableRows >= this.totalRows) {
  	eval (this.id + 'ButtonNext.style.filter = "gray alpha(opacity=20)"');
  	eval (this.id + 'ButtonLast.style.filter = "gray alpha(opacity=20)"');
    } 
  }
  
  if (this.orientation == 'landscape') {
	
	  var leftPaneHTML = "";

	  // get a ref to the DHTML Table;
	  var oDHTMLTable = eval(this.id);
	  var maxTableR = oDHTMLTable.rows.length;

	  
	    for (r = 0; r < maxTableR; r++) {

	    	// skip if not landscape mode
	    	if (this.orientation != 'landscape') break;

	    	// create the tr start tag, and copy the row style from the data table
	    	//leftPaneHTML += '<tr ';
	    	var rowClass = oDHTMLTable.rows(r).className;
	    	var currRowIndex = oDHTMLTable.rows(r).rowIndex;

	    	leftPaneHTML += "<tr ondblclick='"  + this.name + ".goSubreport(this);'" 
	   	  + " class='" + rowClass + "'" 
	   	  + " onclick='" + this.name + ".highlightRow(this)'" 
	   	  + " rowIndex='" + currRowIndex + "'"
	  	  + ">";

	  	
		    	for (c = 0; c < this.nonScrollingColumns.length; c++) {
		    	  // skip the column if it hasn't been given a 'true' value in
		    	  // the non-scrolling columns Array.
		    	  if (this.nonScrollingColumns[c] == undefined) continue;
		    	  if (! this.nonScrollingColumns[c]) continue;

		    	  // copy the cell to the left pane 
		    	  // first unhide the cell in the right pane in case it has been hidden
		    	  oDHTMLTable.rows(r).cells(c).style.display = "block";
		  	  leftPaneHTML += oDHTMLTable.rows(r).cells(c).outerHTML;
		    	  // hide the cell in the right pane
		    	  oDHTMLTable.rows(r).cells(c).style.display = "none";
		    	}
		  

	    	leftPaneHTML += '</tr>';
	    }
	  
	  
	    leftPane.innerHTML = 
	    '<table ' 
	  	 + 'id = ' + this.id + 'LeftPaneTable '
	  	 + 'style="background-color:white; border-collapse:collapse;" '
	  	 + 'cellpadding="2" border="0" cellspacing="0" bgcolor="black"'
	  	 + '>' 
	  	 + leftPaneHTML 
	  	 + '</table><br>';
	    rightPane.style.width = this.tableWidth - (eval (this.id + "LeftPaneTable.clientWidth"));
	  

	  
	    var oLeftPane = eval(this.id + 'LeftPaneTable');
	    for (i = 0; i < oLeftPane.rows(0).cells.length; i++) {
	  	oLeftPane.rows(0).cells(i).col = i;
	    }
	    var oRightPane = oDHTMLTable;
	    for (j = 0; j < oRightPane.rows(0).cells.length; j++) {
	  	if (oRightPane.rows(1).cells(j).style.display != 'none') {
	  	  oRightPane.rows(0).cells(j).col = j;
	  	}
	    }
	  
	  
  }
  
}

function fillCell(table, r, c, colShift) {
  tmp = this.formatItem(this.dataArray[this.rowIndexes[r + this.startRow]][this.columnIndexes[c]], this.formats[this.columnIndexes[c]],this.types[this.columnIndexes[c]]);
  table.rows(r).cells(c + colShift).firstChild.innerHTML = tmp;  
}

]]>

<!--@-body-->
<!--@-node:2::<< fill table >>-->


<!--@<< draw and fill scrolling table >>-->
<!--@+node:3::<< draw and fill scrolling table >>-->
<!--@+body-->
<!--@@code-->

<![CDATA[

function drawFilledTable() {

  var rowStyle;
  var cellStyle;
  var html = '';
  
  
  <!--@<< table dhtml >>-->
  <!--@+node:1::<< table dhtml >>-->
  <!--@+body-->
  <!--@@code-->

    // start table dhtml (main dhtml, will be right pane when there are two panes)
    html += "<table id='" + this.id + "' border='0' cellpadding='2' bgcolor='white' cellspacing='0' STYLE='border-collapse:collapse;border-color:white;' class='dataTable';>";
  
    // start container table with left pane for holding non-scrollable columns
    // and right pane to hold the data table
    var leftOverflow = "overflow:hidden;";
    var overflow = ";overflow-X:hidden;overflow-Y:auto;";
    var height = "height:462px;";
    var onscroll ='" onscroll="leftPane.scrollTop = this.scrollTop;" ';
    
    html = '<table border="0" cellspacing="0" cellpadding="0">'
            + '<tr>'
  	      +   '<td valign="top"><div id="leftPane" '
  		  +   ' style="' + height + leftOverflow + '"'
  		  +   '></div></td>'
  	      +   '<td>'
  		  +     '<div id="rightPane" style="width:' 
  		  +       this.tableWidth 
  		  +       overflow
  		  +       height 
  		  +       onscroll
  		  +     '>' 
  	      +     html; 
  		    
    
	<!--@<< dhtml table body filled >>-->
	<!--@+node:1::<< dhtml table body filled >>-->
	<!--@+body-->
	<!--@@code-->

	  
	  <!--@<< col headers filled >>-->
	  <!--@+node:1::<< col headers filled >>-->
	  <!--@+body-->
	  <!--@@code-->

	      var aHeadings = new Array();
	      var nowrap = "";
	      var item;
	  
	      var pickList = "";
	      
	      for(c = 0; c < this.columnIndexes.length; c++){
	  
	        // if picklist will appear in place of col headers
	        if (this.pickList) {
	          
			  <!--@<< picklist items filled >>-->
			  <!--@+node:1::<< picklist items filled >>-->
			  <!--@+body-->
			  <!--@@code-->

			  	  pickList = "<select onclick=\"window.event.cancelBubble = true;\" onchange='dataTable.changeCol(" + c + ", this.value, this.options[this.selectedIndex].text)'>";
			        // loop thru all of the field titles to create a pick list
			  	  for (cc = 0; cc < this.columnIndexes.length; cc++) {
			  		pickList += "<option value='";
			  		pickList += cc;
			  		pickList += "'";
			  		if (cc == this.columnIndexes[c]) pickList += " selected ";
			  		pickList += ">" + this.titles[cc];
			  		pickList += "</option>";
			  	  }
			        pickList += "</select>";
			        item = pickList;
			      } else {
			    	  
			        item = this.titles[this.columnIndexes[c]];
			        item = '<span class="sortLink">' + item + '</span>';
			  
			  <!--@-body-->
			  <!--@-node:1::<< picklist items filled >>-->
  	  	
	        }
	    	
	        if (this.orientation == 'landscape') {
	          
			  <!--@<< landscape col headers filled >>-->
			  <!--@+node:2::<< landscape col headers filled >>-->
			  <!--@+body-->
			  <!--@@code-->

			            aHeadings[c] = '<td' 
			    	      + ' class="colhead" ' 
			    	      + nowrap + ' col="' + c + '" id="' + this.id + 'Col' + c + '">' 
			  
			            // mini table to contain header + resize link
			            + '<nobr>'
			  		  + '<table width="100%" border="0" cellspacing="0" cellpadding="0"><tr>' 
			            // label (col head text)
			  		  + '<td  onmousedown="dataTable.showHourGlass();" title="Click to Sort Table on This Column"' 
			            + ' onclick="dataTable.sortRows(this.parentElement.parentElement.parentElement.parentElement.parentElement, ' + c + ',1); "'		  
			  //          + ' onclick="dataTable.sortRows(' + this.id + 'Col' + c + ',' + c + '); "'		  
			  		  + '>'
			  		  + '<nobr id="colLabel"><b>' + item + '</b></nobr>' 
			  		  + '</td>'
			  		  // resizing handle
			  		  + '<td onmouseover="this.style.cursor=\'E-resize\'" onmousedown="colresize=true;dataTable.TDselDown()" style="width:8" title="Drag to Resize" >&nbsp;&nbsp;</td>'
			            + '</tr></table>'
			  		  + '</nobr>'
			  		  // end of mini table
			  
			  		  + '</td>';
			  
			  <!--@-body-->
			  <!--@-node:2::<< landscape col headers filled >>-->

	        } else {
	  	    // portrait col headers
	          aHeadings[c] = '<td ' 
	           + ' class="colheadportrait" ' 
	           + nowrap + ' col="' + c + '" id="' + this.id + 'Col' + c + '"><nobr>' + item + '</nobr></td>';
	        }
	  
	      }
	  
	    
	  
	  <!--@-body-->
	  <!--@-node:1::<< col headers filled >>-->

	  
	  this.calculateColTotals();  
	
	  var maxR = this.tableRows;
	  var maxC = this.columnIndexes.length;
	
	  var startC = 0;
	
	  
	  <!--@<< rows filled >>-->
	  <!--@+node:2::<< rows filled >>-->
	  <!--@+body-->
	  <!--@@code-->

	  var htmlRowLines = new Array();
	  var myLine = "";
	    
	  // a couple of arrays to hold cells to be copied to left pane
	  var field = "";
	  var fields = new Array();
	  var leftPaneLines = new Array();
	    
	  var table = eval(this.id);
	  var CSSClass = "";
	  var inlineStyle = "";
	  for(r = 0; r < maxR; r++){
	  
	    // alternate the row styles
	    rowStyle = 'oddrow';
	    if (r % 2 == 0) rowStyle = 'evenrow';
	  
	    this.tableStyle = 'scrolling';
	  
	    // TR
	    myLine = "<tr ondblclick='" 
	   	   + this.name + ".goSubreport(this);'" 
	         + " class='" + rowStyle + "'" 
	         + " onclick='" + this.name + ".highlightRow(this);'" 
	         + " rowIndex=" + r 
	         + ">";
	  
	    // Master-Detail button
	    myLine += '<td id="plusButton" class="dataRow" style="display:none" onclick="' + this.name + '.toggleRowOpen(this);"' + '><nobr class="plusButton">&minus;</nobr></td>';
	  
	    // TD
	    leftPaneLines[r] = myLine;
	    for(c = startC; c < maxC; c++){
	  
	      CSSClass = this.types[this.columnIndexes[c]];
	  
	      inlineStyle = "";
	      if (this.nonScrollingColumns[c] != undefined){
	        inlineStyle = 'style="display:none;"';
	      }
	  	
	      field = '<td nowrap class="' + CSSClass + '"' + inlineStyle + ' ><nobr>'
	        + this.getCellData(r, c)
	        + '</nobr></td>';	
	    	
	      myLine += field;
	  
	      // copy into left pane if nec
	      if (this.nonScrollingColumns[c] != undefined){
	        field = '<td nowrap class="' + CSSClass + '" ><nobr>'
	         + this.getCellData(r, c)
	  	   + '</nobr></td>';	
	     	  fields[c] = field;
	      }
	    	
	    }
	    leftPaneLines[r] += fields.join("") + "</tr>";
	  
	    myLine += "</tr>";
	  
	    
		<!--@<< subtable filled >>-->
		<!--@+node:1::<< subtable filled >>-->
		<!--@+body-->
		<!--@@code-->

		var subTable;
		var sr;
		var sc;
		var maxDetail = 5;
		
		var pk = this.getCellData(r, 0);
		var detailHTML = "";
		for (j = 0; j < maxDetail; j++) {
		  detailHTML += '<span id="level1_' + j + '" + pk = "' + pk + '"></span>';
		}
		myLine  += '<tr STYLE="display:none"><td id="detailFrame" pk="' + pk + '" colspan="' 
		        + (this.columnIndexes.length + 1) + '">' 
		//	    + subTable 
		        + detailHTML
			    + '</td></tr>';
		
		<!--@-body-->
		<!--@-node:1::<< subtable filled >>-->

	    
	    htmlRowLines[r] = myLine;
	  	  
	  } // end of row loop
	  
	  html += htmlRowLines.join("");
	  //html += htmlDataLines.join("");
	  
	  
	  <!--@-body-->
	  <!--@-node:2::<< rows filled >>-->

	
	
	  
	
	
	<!--@-body-->
	<!--@-node:1::<< dhtml table body filled >>-->
		
  
    // finish data table (right pane)
    html += "</table>";    
  
    // close container table (that has left pane and right pane)
    html += '   <br></div></td>'
         +  '  </tr>'
  	   +  '</table>';
  
  <!--@-body-->
  <!--@-node:1::<< table dhtml >>-->


  
  <!--@<< col resizing div element >>-->
  <!--@+node:2::<< col resizing div element >>-->
  <!--@+body-->
  <!--@@code-->

   
  
  <!--@-body-->
  <!--@-node:2::<< col resizing div element >>-->

  
  <!--@<< create and add col header html >>-->
  <!--@+node:3::<< create and add col header html >>-->
  <!--@+body-->
  <!--@@code-->

    // add col headers for landscape (must be placed in separate div tags for left and
    // right pane headers). First, place all col headers in right pane, left pane col
    // headers will be moved into left pane later.
    var headHTML;
    // first make a table with a two cells, each cell contains a div tag which
    // will hold the left or right pane col headers
    headHTML = '<table id="colHeaderTable" style="border-collapse:collapse;" cellpadding="0" cellspacing="0"><tr>';
    headHTML += '<td><div id="leftPaneHeader"></div></td>';
    headHTML += '<td><div id="rightPaneHeader" style="overflow:hidden">'
    headHTML += '<table style="border-collapse:collapse; border-color:white"><tr>';
    // add dummy cell for head of open button column
    headHTML += '<td id="plusButtonHeader" class="colHead" style="display:none;" ' + this.name + '.toggleRowOpenAll(this);"' + '><nobr class="plusButtonHeader">&nbsp;</nobr></td>';
    
    for (i = 0; i < aHeadings.length; i++) headHTML += aHeadings[i];
    headHTML += '</tr></table>';
  
    // now put the colheader table containing left and right col headers together
    // with the main data table.
    html = '<table border="0" style="border-collapse:collapse; border-color:white">' +
  	       '<tr><td>' + 
  		   headHTML + 
  		   '</td></tr></table>' +
  		   html +
  		   '</td></tr></table>';
  
  <!--@-body-->
  <!--@-node:3::<< create and add col header html >>-->

  
  <!--@<< create and add summary row html >>-->
  <!--@+node:4::<< create and add summary row html >>-->
  <!--@+body-->
  <!--@@code-->

    var total;
    var num;
    var sumRowHTML = "";
  //  if (this.tableStyle == 'masterDetail') {
  //    sumRowHTML += '<td class="openButton" id="openButton">&nbsp;</td>';
  //  }
    for (i = 0; i < this.colTotals.length; i++) sumRowHTML += this.colTotals[this.columnIndexes[i]];
    var sumHTML = '<table border="0" id="sumRowTable" style="border-collapse:collapse;" cellpadding="0" cellspacing="0"><tr>';
    sumHTML += '<td valign="top"><div id="leftPaneSumRow" style="height:42;"></div></td>';
    sumHTML += '<td><div id="rightPaneSumRow" style="height:42;overflow-X:auto" onscroll="rightPane.scrollLeft=this.scrollLeft; rightPaneHeader.scrollLeft=this.scrollLeft">'
    sumHTML += '<table border="0" style="margin:0;border:0px solid #7EBEBE; border-collapse:collapse;" cellpadding="0" cellspacing="0"><tr>';
    sumHTML += '<td id="plusButtonFooter" class="summaryItem" style="display:none;"><nobr class="plusButtonFooter">&nbsp;</nobr></td>';
    sumHTML += sumRowHTML;
    sumHTML += '</tr></table>';
    sumHTML += '</div></td></tr></table>';
  
    html += sumHTML;  
  
  <!--@-body-->
  <!--@-node:4::<< create and add summary row html >>-->
  
  
  <!--@<< footnote >>-->
  <!--@+node:5::<< footnote >>-->
  <!--@+body-->
  <!--@@code-->

    // start box to display record count and current index and navbar
    html += '<table border="0" width="100%"><tr>';
    html += "<td align='left' nowrap align='left'><span id='" + this.id + "Footer'>xxx</span></td>"  
    
    // close box to display record count and current index and navbar
    html += '</table>';
    
  
  <!--@-body-->
  <!--@-node:5::<< footnote >>-->

    
  // render the table
  eval (this.container + ".innerHTML = html");

  
  <!--@<< fix data cell widths >>-->
  <!--@+node:6::<< fix data cell widths >>-->
  <!--@+body-->
  <!--@@code-->

    // fix the first cell in the col of the data field to
    // be the width of the col header. This way the col will
    // be at least as wide as the col header.
    var table = eval(this.id);
    var cells = table.rows(0).cells;
    var w, label, cell;
    
    for (c = 0; c < colLabel.length; c++) {
      label = colLabel(c); // col header cell  
      cell = cells(c + 1);     // first data cell
      // TODO: move this to string init?
      label.style.overflow = 'hidden';
  //	alert(label.innerHTML + "\n = " + label.parentElement.clientWidth);
  	cell.style.width = label.parentElement.clientWidth;// - 20;
    } 
  
  <!--@-body-->
  <!--@-node:6::<< fix data cell widths >>-->

  
  <!--@<< put left pane html in left pane and adjust width of right pane >>-->
  <!--@+node:7::<< put left pane html in left pane and adjust width of right pane >>-->
  <!--@+body-->
  <!--@@code-->

    // put left pane html in left pane
    var leftPaneHTML = "";
    leftPaneHTML = leftPaneLines.join("");
    leftPane.innerHTML = 
     '<table ' 
       + 'id = ' + this.id + 'LeftPaneTable '
       + 'style="background-color:white; border-collapse:collapse;" '
       + 'cellpadding="2" border="0" cellspacing="0" bgcolor="black"'
       + '>' 
       + leftPaneHTML 
       + '</table><br>';
  
    // adjust right pane width now that left pane has been filled
    rightPane.style.width = this.tableWidth - (eval (this.id + "LeftPaneTable.clientWidth"));
  
  <!--@-body-->
  <!--@-node:7::<< put left pane html in left pane and adjust width of right pane >>-->

   
  
  <!--@<< move col headers and sum cells into left pane >>-->
  <!--@+node:9::<< move col headers and sum cells into left pane >>-->
  <!--@+body-->
  <!--@@code-->

    // move col headers and col sum fields into left pane
    var rightPaneHeaderTable = rightPaneHeader.firstChild;
    var leftPaneHeaderHTML = "";
    var rightPaneSumRowTable = rightPaneSumRow.firstChild;
    var leftPaneSumRowHTML = "";
    for (c = 0; c < this.nonScrollingColumns.length; c++) {
      // skip the column if it hasn't been given a 'true' value in
      // the non-scrolling columns Array.
      if (this.nonScrollingColumns[c] == undefined) continue;
      if (! this.nonScrollingColumns[c]) continue;
  
        // copy the cell to the left pane 
        // first unhide the cell in the right pane in case it has been hidden
        rightPaneHeaderTable.rows(0).cells(c + 1).style.display = "block";
  	  leftPaneHeaderHTML += rightPaneHeaderTable.rows(0).cells(c + 1).outerHTML;
        rightPaneSumRowTable.rows(0).cells(c + 1).style.display = "block";
  	  leftPaneSumRowHTML += rightPaneSumRowTable.rows(0).cells(c + 1).outerHTML;
  
    	  // hide the cell in the right pane
    	  rightPaneHeaderTable.rows(0).cells(c + 1).style.display = "none";
    	  rightPaneSumRowTable.rows(0).cells(c + 1).style.display = "none";
  
    }
  //  leftPaneHeaderHTML = '<table cellpadding="0" cellspacing="0">' + leftPaneHeaderHTML + '</table>';
    leftPaneHeaderHTML = '<tr>' + leftPaneHeaderHTML + '</tr>';
    leftPaneSumRowHTML = '<tr>' + leftPaneSumRowHTML + '</tr>';
  
    leftPaneHeader.innerHTML = 
    '<table ' 
       + 'style="background-color:white; border-collapse:collapse;" '
       + 'cellpadding="2" border="0" cellspacing="0" bgcolor="black"'
       + '>' 
       + leftPaneHeaderHTML 
       + '</table>';
    leftPaneSumRow.innerHTML = 
    '<table ' 
       + 'style="background-color:black; border:0px solid #7EBEBE; border-collapse:collapse;" '
       + 'cellpadding="0" border="0" cellspacing="0" bgcolor="black"'
       + '>' 
       + leftPaneSumRowHTML 
       + '</table>';
  	  
    rightPaneHeader.style.overflow = "hidden";
    rightPaneHeader.style.width = rightPane.clientWidth;
    
    rightPaneSumRow.style.overflow = "hidden";
    rightPaneSumRow.style.width = rightPane.clientWidth;
  <!--@-body-->
  <!--@-node:9::<< move col headers and sum cells into left pane >>-->

  
  <!--@<< footnote (1 - 100 of 100 rows) >>-->
  <!--@+node:10::<< footnote (1 - 100 of 100 rows) >>-->
  <!--@+body-->
  <!--@@code-->

    ]]>
  <xsl:choose>
  <xsl:when test="$footnote = ''">
  var f = (this.startRow + 1) + " - " + (Math.min(this.startRow + this.tableRows, this.totalRows)) 
     + " of " 
     + this.totalRows + " found ";
  eval (this.id + "Footer.innerHTML = '" + f + "'"); 
  </xsl:when>
  <xsl:when test="$footnote = 'null'">
  </xsl:when>
  <xsl:otherwise>
  eval (this.id + "Footer.innerHTML = '" + "<xsl:value-of select="$footnote"/>" + "'"); 
  </xsl:otherwise>
  </xsl:choose>
    <![CDATA[ 
  
  <!--@-body-->
  <!--@-node:10::<< footnote (1 - 100 of 100 rows) >>-->

  
  <!--@<< fix col header and sum row cell width >>-->
  <!--@+node:8::<< fix col header and sum row cell width >>-->
  <!--@+body-->
  <!--@@code-->

    var cells = table.rows(0).cells;
    var leftPaneCells = leftPane.firstChild.rows(0).cells;
    var w, w2, label, cell;
    for (c = 0; c < cells.length - 1; c++) {
    
      if (c < this.nonScrollingColumns.length) {
        cell = leftPaneCells(c + 1); // offset by one bc of "+" button
        label = colLabel(c); // col header cell  
        label.style.overflow = 'hidden';
        w = cell.clientWidth;
  	  label.style.width = w + 100;
        label = sumCell(c);   
        label.style.width = w;
  	  if (c == 0) label.style.width = w + 1;
      } else {
        cell = cells(c + 1); // offset by one bc of "+" button
        colLabelx = colLabel(c); // col header cell  
        sumCellx = sumCell(c);
  	   
  	  // first check if sum cell is wider than reg cell
  	  // if so reset first cell to be same width as sum cell
  //      alert(cell.clientWidth + " " + sumCellx.clientWidth + "\n" + sumCellx.outerHTML);
  	  if (sumCellx.parentElement.clientWidth > cell.clientWidth) {
  	    cell.style.width = sumCellx.parentElement.clientWidth + 1;
  //		alert(sumCellx.innerHTML);
  	  }
  	  colLabelx.style.width = cell.clientWidth - 7;
        sumCellx.style.width = cell.clientWidth;
  	  // now reset col header
  //      cell = cells(c + 1); // offset by one bc of "+" button
  //      label = colLabel(c); // col header cell  
  //      label.style.overflow = 'hidden';
  //      w = cell.clientWidth;
  //	  label.style.width = w - 9;
  //      label = sumCell(c);   
  //      label.style.width = w;
  
  //       // check if sum cell width is greater than col header width
  //	   // if, so reset col header width
  //       cell = cells(c + 1);     // first data cell  
  //       label = colLabel(c);
  //	   sumCell = sumCell(c);
  //       w = cell.clientWidth;
  //       w2 = label.parentElement.clientWidth + 5;
  //       w3 = sumCell(c).clientWidth;
  
  //       w = cells(c + 1).clientWidth;
  //	   w2 = colLabel(c).parentElement.clientWidth + 5;
  //	   w3 = sumCell(c).clientWidth;
  
  //	   w = Math.max(w, w2, 23);
  
  //       colLabel(c).p
  //	   cells(c + 1).firstChild.style.width = w2 - 4;
  //	   sumCell(c).style.width = w;   
  //	   if (w2 > w) {
  //	     cells(c + 1).firstChild.style.width = w2 - 4;
  //         w = w2;
  //	   } else {
  //	     label.style.width = w - 9;
  //       }
         // sum cell
  //       label = sumCell(c);
  //       label.style.overflow = 'hidden';
  //       label.style.width = Math.max(w, 10);
      }
    }
  
  <!--@-body-->
  <!--@-node:8::<< fix col header and sum row cell width >>-->
 
}

function getCellData(r, c) {
  return this.formatItem(this.dataArray[this.rowIndexes[r + this.startRow]][this.columnIndexes[c]], this.formats[this.columnIndexes[c]],this.types[this.columnIndexes[c]]);
}


]]>

<!--@-body-->
<!--@-node:3::<< draw and fill scrolling table >>-->


<!--@-body-->
<!--@-node:4::<< draw and fill table >>-->
 

<!--@<< field formatting >>-->
<!--@+node:5::<< field formatting >>-->
<!--@+body-->
<!--@@code-->

<![CDATA[

/**
 * Format an item, e.g. convert a date from 1999-10-01 to 10/01/99.
 * 
 * @item        The item to be formatted.
 * @formatName  The format to use. When you construct a clsDHTMLTable object, you may pass the
 *              the constructor an array containing a list of column formats. To add a new
 *              format, simply edit the "switch" statement below.
 */ 
function formatItem(item, formatName, dataType){

  try {
    dataType = dataType.toUpperCase();
  } catch (e) {
  
  }

  switch (dataType) {
  case "DECIMAL":
    formatName = "MYF";
    break;
  case "TIMESTAMP":
    formatName = "SDT";
    break;
  case "default":
    formatName = "MYF";
    break;
  case "DATE":
    formatName = "SDT";
    break;
  default:
      
  }
  
  if (item == 'null') return "&#160;";
  if (item == '') return "&#160;";

  var myItem = item;
  if (myItem == undefined) return;
  if (myItem.length < 3) return myItem;
  
  switch (formatName) {
    case "default":
    case "money":
    case "MY":
	case "RTH":
    case "MYF": 
	  //if (myItem > 1) {myItem = myItem / 1};
	  myItem = myItem / 1; // get rid of exponential notation
	  myItem = myItem.toString();
      if (myItem.indexOf('.') == -1) myItem += ".00";
	    myItem += "0000"; // make sure we've go enough zeros on end
      myItem = myItem.replace(/(\.\d\d)\d+/, "$1"); // truncate to 2 dec places    
      myItem = commify(myItem);
      break;    
  case "MYD": // drop pennies
    myItem = Math.floor(myItem / 1);
    myItem = commify(myItem);
    break;
  case "MYT": // amount in thousands
    myItem = Math.floor(myItem / 1000);  
    myItem = commify(myItem);
    break;
  case "MYM": // amount in millions
    myItem = Math.floor(myItem / 1000000);  
    myItem = commify(myItem);
    break;
  case "RTF": // format rate forced
    myItem = myItem / 1; // get rid of exponential notation
    myItem = myItem.toString();
    if (myItem.indexOf('.') == -1) myItem += ".00";
    myItem += "0000"; // make sure we have enough zeros on end
    myItem = myItem.replace(/(\.\d\d\d)\d+/, "$1"); // truncate to 3 dec places    
    break;
  case "FC":
    // remove leading and trailing spaces
    myItem = myItem.replace(/^\s+/, '');
    myItem = myItem.replace(/\s+$/, '');
    myItem = myItem.replace(/&/, '&amp;');
	break;	
  case "datetime":
  case "SDT":
    myItem = myItem.replace(/^(\d\d)(\d\d)-(\d\d)-(\d\d).*/, "$3/$4/$2"); // rearrange the data items
    break;
  default: 
     // remove leading and trailing spaces
     myItem = myItem.replace(/^\s+/, '');
     myItem = myItem.replace(/\s+$/, '');
 
    // kludge alert: some code fields have format type = 'text'. So assume
    // that anything below 4 chars is a code.
    if (this.mixedCase) {
    if (myItem.length > 3) myItem = myItem.toLowerCase();
  
    // fields which are text with mixed numbers and letters and no spaces are codes and should
    // be in caps 
    if ((myItem.search(/\s/) == -1) && (myItem.search(/\d/) != -1) && (myItem.search(/[A-Za-z]/) != -1)){
      myItem = myItem.toUpperCase();
    }

  }

	// roman numerals in text fields
        myItem = myItem.replace(/\sii$/g, ' II');
        myItem = myItem.replace(/\siii$/g, ' III');
        myItem = myItem.replace(/\siv$/g, ' IV');
        myItem = myItem.replace(/\svi$/g, ' VI');
  }
  return myItem;
}

]]>

<!--@-body-->
<!--@-node:5::<< field formatting >>-->


<!--@<< col resizing methods >>-->
<!--@+node:6::<< col resizing methods >>-->
<!--@+body-->
<!--@+doc-->
<!--


html+= '<div id="TDsel"
             onmouseover="dragTD=true"
			 onmouseout="dragTD=false"
			 onmousemove="dataTable.TDselMove()"
			 onmouseup="dataTable.TDselUp()"
			 style="position:absolute;filter:alpha(opacity=20);border:2 solid 
black;top:0;left:-1000;height:100%;z-index:2;background-color:white" >
		</div>';



-->

<!--@-doc-->
<!--@@code-->

var lLeft;
var oPaneDiv;
var currCol;
var oDHTMLTable = eval(this.id);


<!--@<< mouse down >>-->
<!--@+node:1::<< mouse down >>-->
<!--@+body-->
<!--@@code-->

function TDselDown(){

  // find out height of the title bar, if any
  titleHeight = 0;
  try { titleHeight = tableHeader.clientHeight } catch (e) {}
  
  // the TD element for the col head
  //              TD            TR          TABLE          NOBR         TD
  oEL = event.srcElement.parentElement.parentElement.parentElement.parentElement;
  
  // the NOBR element for the first cell
  currCol = (oEL.col / 1);

  // currCol = this.columnIndexes[currCol];

  // the DIV element holding the data table
  oPaneDIV = oEL.parentElement.parentElement.parentElement.parentElement;
    
  // the TD containing the data table (this will be either left or right pane
  oPaneTD = oEL.parentElement.parentElement.parentElement.parentElement.parentElement;
  
  // change the TDsel style
  tst=TDsel.style;

  // we need the offset of the TD for this col, plus
  // the offset of the TD holding the pane (e.g. right pane)
  // minus how much the pane has been scrolled
  tst.pixelLeft=oEL.offsetLeft + oPaneTD.offsetLeft - oPaneDIV.scrollLeft + 5;
  tst.posWidth=oEL.offsetWidth; 
  
  var oDHTMLTable = eval(this.id);
  if (this.tableStyle == "paged") {
    tst.pixelHeight=(oDHTMLTable.parentElement.offsetHeight); 
  } else {
    tst.pixelHeight=(oDHTMLTable.parentElement.offsetHeight + 45);   
  }
  tst.pixelTop=titleHeight+3;
  lLeft=tst.pixelLeft;
  dragTD=true; 
  TDsel.setCapture();
  

}

<!--@-body-->
<!--@-node:1::<< mouse down >>-->


<!--@<< mouse move >>-->
<!--@+node:2::<< mouse move >>-->
<!--@+body-->
<!--@@code-->

function TDselMove(){

  var oDHTMLTable = eval(this.id);
  TDcellWidth=event.clientX + oDHTMLTable.scrollLeft - lLeft; // + oDHTMLTable.scrollTop - lLeft + 8;

  // resize TDsel
  TDsel.style.posWidth = TDcellWidth;

}

<!--@-body-->
<!--@-node:2::<< mouse move >>-->


<!--@<< mouse up >>-->
<!--@+node:3::<< mouse up >>-->
<!--@+body-->
<!--@@code-->

function TDselUp(){  
 
  var oDHTMLTable = eval(this.id);

  TDsel.releaseCapture();
  TDcellWidth = Math.max(TDcellWidth, 6);

  var oRightPane = eval(this.id);
  
  // in scrolling or masterDetail there is another row for every data row,
  // so when loooping thru the rows, we need to step by two
  // Also, the row to start on will be 1 in the case of the paged display,
  // because the col header is row 0 
  var step = 2;
  var startR = 0;
  if (this.tableStyle == "paged") {
    step = 1;
	startR = 1;  
  }
 
  if ((oPaneDIV.id == 'leftPaneHeader') || (oPaneDIV.id =='leftPane')) {
    
    
	<!--@<< left pane >>-->
	<!--@+node:1::<< left pane >>-->
	<!--@+body-->
	<!--@@code-->

	    oLeftPane = eval(this.id + "LeftPaneTable")	
		
		// adjust the col label 
		label = colLabel(currCol);
	    label.style.overflow = 'hidden';
		label.style.width = TDcellWidth - 6;
	
	    // resize the col footer
	    label = sumCell(currCol);
	    label.style.width = TDcellWidth + 4;	
		
	    // shift the col num if this is not paged view bc of the button (visible or not) that
		// exists in the other views
		if (this.tableStyle != "paged")  currCol++;	
		
		// loop thru the NOBR elements in each field in the column
	    var oLeftPaneDHTML = eval(this.id + "LeftPaneTable");
		for (r = startR; r &lt; oLeftPaneDHTML.rows.length; r++) {
	      // get the NOBR element in the cell
	      nobrEL = oLeftPane.rows(r).cells(currCol).firstChild;
	      nobrEL.style.overflow = 'hidden';
	      nobrEL.style.width=TDcellWidth;
	      nobrEL.parentElement.style.width=TDcellWidth;
	    }
	
	    // adjust the size of the right pane since the size of the left pane has changed.
	    oRightPane.parentElement.style.width = Math.max(this.tableWidth - oLeftPane.clientWidth, 5);
	
		if (this.tableStyle != "paged") {
	      rightPaneHeader.style.width = oRightPane.parentElement.style.width;
	      rightPaneSumRow.style.width = oRightPane.parentElement.style.width;
	    }
	
	<!--@-body-->
	<!--@-node:1::<< left pane >>-->

  
  } else {
  
    
	<!--@<< right pane >>-->
	<!--@+node:2::<< right pane >>-->
	<!--@+body-->
	<!--@@code-->

	    // resize the col header
	    label = colLabel(currCol + this.nonScrollingColumns.length);
	    label.style.overflow = 'hidden';
	    label.style.width = TDcellWidth - 5;  
	
	    // resize the col footer
	    label = sumCell(currCol + this.nonScrollingColumns.length);
	    label.style.width = TDcellWidth + 4;	
		
	    // shift the col num if this is not paged view bc of the button (visible or not) that
		// exists in the other views
		if (this.tableStyle != "paged")  currCol++;
		
	    // loop thru the NOBR elements in each field in the column (right pane)
	    for (r = startR; r &lt; oDHTMLTable.rows.length; r = r + step) {
	      // get the NOBR element in the cell
	      nobrEL = oRightPane.rows(r).cells(currCol).firstChild;
	      nobrEL.style.overflow = 'hidden';
	      nobrEL.style.width=TDcellWidth;
	      nobrEL.parentElement.style.overflow = 'hidden';
	      nobrEL.parentElement.style.width=TDcellWidth;
	
	    }
	
	<!--@-body-->
	<!--@-node:2::<< right pane >>-->

  
  }
  // move TDsel off the screen
  TDsel.style.left=-1000;


<!--@-body-->
<!--@-node:3::<< mouse up >>-->



}


<!--@-body-->
<!--@-node:6::<< col resizing methods >>-->


<!--@<< row methods >>-->
<!--@+node:7::<< row methods >>-->
<!--@+body-->
<!--@@code-->
<![CDATA[
var oldSubTableRow;
function highlightSubTableRow(me) {

  try {
    oldSubTableRow.className = "level1Row"; 
  } catch (e) {}
  me.className = "level2Highlight";
  oldSubTableRow = me;
  
}

/** 
 * highlightRow
 *
 * @me  The element that was clicked on.
 *
 */
function highlightRow(me) {

  var theTable = eval(this.id);
  var rowIndex = me.rowIndex;
 // var startRow = 0;

  var step = 1;
  var d = 2;
  var style1 = "evenrow";
  var style2 = "oddrow";
  
  if (this.tableStyle != "paged") d = 4;
  if (this.tableStyle != "paged") step = 2;
  
  if (this.tableStyle == "paged") {
    style1 = "oddrow";
	style2 = "evenrow";
	rowIndex++;
  }
  
  if (this.tableStyle == "masterDetail") {
    for (r = 0; r < theTable.rows.length; r = r + 2) {
      theTable.rows(r).className = "level1Row"
	}
    eval("theTable.rows(" + (rowIndex / 1) * 2 + ").className = 'level1Highlight'");   
    return;
  }  
    
  // unhilite all rows in right pane
  var r;
  var row;
  for (r = 0; r < theTable.rows.length; r = r + step) {
    row = theTable.rows(r);
	if (r % d == 0) {
	  row.className = style1;
	} else {
	  row.className = style2;
    }
  }

  // hilite row (this will hilite the row in the right pane regardless of which
  // pane was clicked on
  eval("theTable.rows(" + (rowIndex / 1) * step + ").className = 'highlightedRow'");   
  
  // try to hilight the same row in the left pane (there may be no
  // columns in the left pane, so put this in a try clause).
  try {
    // unhilite
    theTable = eval(this.id + "LeftPaneTable");
    var r;
    for (r = 0; r < theTable.rows.length; r++) {
      row = theTable.rows(r);
      if (r % 2 == 0) {
        row.className = style1;
	  } else {
	    row.className = style2;
      }
    }

    // hilite row
    eval("theTable.rows(" + (rowIndex / 1) + ").className = 'highlightedRow'");   
  } catch (e) {
    // do nothing
  }

  // save the current index for use with getnext and getprev functions
  // and to show which row was prev highlighted
  this.currDetailRow = (rowIndex / 1);

  this.currHighlightedRow = (rowIndex / 1);

  this.resize();
  
}


/* changeStyle : change a CSS style in the document
 *
 *@styleName : name of style to change, e.g. TD or .custom1
 *@key       : e.g. width or font-family
 *@value     : value to be set
 *
 * example: changeStyle(".custom", "line-height", "6px");
 */
function changeStyle(styleName, key, value) {

  var myRules = document.styleSheets[0].rules;
  var size;
  var lineHeight = "";
  for (i = 0; i < myRules.length; i++) {
	if (myRules[i].selectorText == styleName) {
	  eval ("myRules[i].style." + key + " = " + value);
	  break; 
	}
  }	

}



]]>


<!--@-body-->
<!--@-node:7::<< row methods >>-->


<!--@<< fast print >>-->
<!--@+node:8::<< fast print >>-->
<!--@+body-->
<!--@@code-->

<![CDATA[


<!--@<< support functions >>-->
<!--@+node:1::<< support functions >>-->
<!--@+body-->
<!--@@code-->

function zoom(op) {
  eval("z = z " + op + " 10");
  for (i = 0; i < repWindow.fastReportTable.length; i++) {
    repWindow.fastReportTable(i).style.zoom =  z + '%';
  }
}        

// for use by fast report window: resize the report so that the at
// least the first table of data is no longer than 1000 pixels wide.
// This way it should print out on one A4 piece of paper (landscape)
function initFastReport() {


  var w = repWindow.fastReportTable(0).clientWidth;
  resizePct = 940 / w;

  for (i = 0; i < repWindow.fastReportTable.length; i++) {
    repWindow.fastReportTable(i).style.zoom = resizePct;
  }

}

<!--@-body-->
<!--@-node:1::<< support functions >>-->


var repWindow; // this will hold a pointer to the print report window

// for use by fast report window 
var z = 100;

function makeReport() {

  // zoom variable: see above
  z = 100;
  
  var d = new Date();
  var today = (d.getMonth() + 1) + "/" + d.getDate() + "/" + d.getYear();

  var repTitle = ']]><xsl:value-of select="$printReportTitle"/><![CDATA[';

  //var repTitle = top.document.title;
  //try {
  //  tmp = repTitle.split("-");
  //  repTitle = tmp[1];
  //  repTitle = repTitle.replace(/^\s+/, "");
  //  repTitle = repTitle.replace(/\s+$/, "");
  //  repTitle += "(Fast Print)";
  //} catch (e) {
  //}
  
  // report header
  var repHeader = 
      '<div class="notice">This report should be printed in Landscape View. To configure your browser '
	+ ' to print in Landscape View, select File > Page Setup > Landscape.</div>'
    + '<table  width=100% align="center"><tr>'
    + '<td width="33%" style="border:0px"></td>'
    + '<td width="33%" style="border:0px" class="printReportHeader" align="center"><nobr>]]>'
	//+ '<xsl:value-of select="$printReportTitle"/><![CDATA[</td>'
    + repTitle + '</nobr></td>'
	+ '<td style="border:0px" align="right" width="33%">'
	+ '<a href="javascript:window.print()" class="menuItem">Print</a> &nbsp; '
	+ '<a href="javascript:window.close()" class="menuItem">Exit</a></td></tr></table>';

  var zoomMenu = '<span class=\'zoomMenu\'><a href="javascript:top.opener.zoom(\'+\')">zoom in</a> &#160; <a href="javascript:top.opener.zoom(\'-\')">zoom out</a></span>'; 
  zoomMenu = '';
  
  if (repWindow != undefined) {
    repWindow.close();
  }
  repWindow = null;
  repWindow = window.open("",repWindow,
    "height=600,width=940,status=no,toolbar=no,menubar=yes,scrollbars=yes,location=no,left=40,top=10");
  repWindow.focus();
    
  // loading 1 of 10 rows
  repWindow.document.write('<div align="center" class="printReportHeader" id="tmpmsg">Loading row <span id="rowIndex">0</span> of ' + this.dataArray.length + ' rows.</div>');
  
  // this var will hold the html for displaying the main table
  myHTML = "";	  
  var tableHeader = "";
  
  myHTML = '\n<html><head><style type="text/css">\n'
  		 + 'BODY    {font-family:Arial,sans-serif; font-size:8pt; font-weight:100; margin-left:0;}\n'
  		 + 'TR      {font-family:Arial,sans-serif; font-size:8pt; font-weight:100; }\n'
  		 + 'TD      {font-family:Arial,sans-serif; font-size:8pt; font-weight:100; border:1px solid gray;text-transform:capitalize;}\n'
  		 + '.colheader  {color:black; background-color:#DDDDDD; height:30}'
  		 + '.summaryItem{color:black; font-weight:bold; background-color:#DDDDDD; height:30; text-align:right}'
  		 + '.default    {text-align:right;}\n'
  		 + '.Text       {text-transform:capitalize}\n'
  		 + '.Number     {text-align:right;}\n'
		 + '.zoomMenu   {font-size:9px}\n'
		 + '.notice     {font-weight:bold; color:red; text-align:center; margin-bottom:20}'
		 + '.menuItem   {font-weight:bold;}'
		 + '@media print{\n'
         + '  .notice     {display:none}\n'
         + '  .menuItem   {display:none}\n'
         + '  .zoomMenu   {display:none}\n'
		 + '}\n'
       + '.printReportHeader {align:center; font-family:Arial,sans-serif; font-size:10pt; font-weight:bold; text-align:center; height:20; margin-bottom:5;}\n'
  		 + '</style>\n'
  		 + '</head><body onload="top.opener.initFastReport()">\n'
  		 + repHeader;
  
  
  tableHeader = '\n<div style="height:620;" class="printPage">'
              + '<table STYLE="border-collapse:collapse" cellpadding="2" id="fastReportTable" width="100%">\n';

  // data table headers (a string containing the html for the col header row)
  tableHeader += '<tr class="colheader">';
  for (c = 0; c < this.columnIndexes.length; c++) {
    tableHeader = tableHeader + "<td><b>" + this.titles[this.columnIndexes[c]] + "</b></td>";
  }
  tableHeader += '</tr>';
    
  var cellData;
  var cellStyle;
  var maxR = this.dataArray.length;
  var maxC = this.dataArray[0].length;
  var HTMLLines = new Array();
  var lineHTML;
  for(r = 0; r < maxR; r++){
   	if (r % 35 == 0) {
 	    lineHTML = tableHeader + '<tr>';
 	  } else {
 	    lineHTML = '<tr>';
   	}
 	  // the html for the table
    for(c = 0; c < maxC; c++){
        cellStyle = this.types[this.columnIndexes[c]];	
   		lineHTML += '<td nowrap class="' + cellStyle + '">';
    	// get the cell data. This is basically equivalent to 
 	    // this.rows[r][c] except that:
 	    // 1. we want to format the data: formatItem(item, formatName)
 	    // 2. we have to look things up via index, bc they might have been moved around
 	    cellData = this.formatItem(rows[this.rowIndexes[r]][this.columnIndexes[c]],    this.formats[this.columnIndexes[c]]);
 	    lineHTML += cellData;
   	}
   	lineHTML += '</tr>\n';
   	if (r % 35 == 34) lineHTML += '\n</table></div><br><br>\n' + repHeader;
    HTMLLines[r] = lineHTML;
   	repWindow.rowIndex.innerHTML = r + 1;
  } 
  
  // concatenate the rows of data 
  myHTML += HTMLLines.join(""); 
  var totalsHTML = '<tr>';
  this.calculateColTotals();
  for (i = 0; i < this.colTotals.length; i++) totalsHTML += this.colTotals[this.columnIndexes[i]];
  totalsHTML += '</tr>';
  myHTML += totalsHTML;
  
  myHTML += '\n</table>';
  
  // if (repWindow != undefined) repWindow.document.write(myHTML);
  //repWindow.document.write(repHeader);
  
  //repWindow.document.close();
  repWindow.document.write(myHTML);
  
  repWindow.tmpmsg.outerHTML = "";
 // repWindow.zoomMenuHolder(0).innerHTML = zoomMenu;
  repWindow.document.close();

}

// next function not currently in use
function stopReport() {
  this.reportStop = true; 
}

]]>

<!--@-body-->
<!--@-node:8::<< fast print >>-->


<!--@<< navigation >>-->
<!--@+node:9::<< navigation >>-->
<!--@+body-->
<!--@@code-->

<![CDATA[

// Navigation methods
function goNext() {
  this.setStartRow(this.startRow + this.tableRows);
}
function goPrev() {
  this.setStartRow(this.startRow - this.tableRows);
}
function goFirst() {
  this.startRow = 0; this.fillTable();
}
function goLast() {
  this.setStartRow(this.totalRows - this.tableRows);
}

]]>

<!--@-body-->
<!--@-node:9::<< navigation >>-->
 

<!--@<< go to subreport >>-->
<!--@+node:10::<< go to subreport >>-->
<!--@+body-->
<!--@@code-->

<![CDATA[
function goSubreport(me) {

  if (! this.details.pageURL) return;
  if (me.rowIndex > this.dataArray.length) {
    // alert('Say there, pal. You just double clicked on an empty row.\nWhat exactly are you trying to accomplish?');
     return;
  }
  
  var myURL = this.details.pageURL + "&";
  var myParam = "";
  var myValue = "";
  var colNum = 0;
  var popWinName = "nothing";
  for (i=0; i < this.details.params.length; i++) {
  	myParam = this.details.params[i];

    // We have the name of the col (this is the param name)
    // now we need to get the value of the column that 
    // has this name. In order to do that first we need
    // to know what is the column index for the given col name.
    // So, we loop thru the col name array and find what position
    // this name is at.
    for (colNum = 0; c < this.names.length; colNum++) {
      if (this.names[colNum] == myParam) break;
    }
    // Now that we've got the col num we can get the value
    // from the data Array. Each row of the table has a "rowIndex" 
    // attribute, and the startRow is the index of the first row
    // (which might not be zero, because the user might have clicked
    // on 'next'). We divide rowIndex by 1 so that Javascript knows 
    // that it is a number and not a string. We use row index to look
	// up the actual rowindex bc the table might have been sorted, meaning
	// that the row index is no longer the same as the data order.
    myValue = this.dataArray[this.rowIndexes[me.rowIndex / 1] + this.startRow][colNum];
    // append the param (i.e. the col name) and value on to the url
    myURL += myParam + '=' + myValue;
 
    // save the first param value to use in the popup window name. The first
    // value should be some kind of unique id, so that the pop window (used
    // for detail screen) will correspond to that id
    popWinName = myValue;

    if (i < this.details.params.length - 1) myURL += '&';
  } 
  ]]>
  <xsl:choose>
  <xsl:when test="$popUp = 'false'">
  location.href=myURL;
  </xsl:when>
  <xsl:otherwise>

  var popWin = window.open(myURL,popWinName,"height=618,width=934,left=40,top=45,status=no,toolbar=no,menubar=no,location=no,resizable=yes");
  popWin.focus();
  </xsl:otherwise>
  </xsl:choose>

<![CDATA[  
//  window.open("Sample.htm",null,"height=400,width=800,status=yes,toolbar=no,menubar=no,location=no");

}
]]>

<!--@-body-->
<!--@-node:10::<< go to subreport >>-->


<!--@<< sorting >>-->
<!--@+node:11::<< sorting >>-->
<!--@+body-->
<!--@@code-->

<![CDATA[
/** 
 * sortRows: Sort rows based on one column
 * 
 * @me                  the TD element of the colheader that was clicked
 * @colThatWasClicked   On the html table object, the number of the column that the user clicked on.
 *
 */
function sortRows(me, colThatWasClicked) {

  colThatWasClicked;

  // First we need to figure out which actual data col is in the current html col.
  var colIndex = this.columnIndexes[colThatWasClicked] + 1;

  colIndex--;
  // code to toggle the search direction
  if (colThatWasClicked == this.colThatWasClickedPrev) {
	this.oldSort = this.oldSort * -1;
  } else {
	this.oldSort = 1;
  }
  this.colThatWasClickedPrev = colThatWasClicked;  

  oldSort = this.oldSort;
  
  // the alphabetic sort
  function charBasedSort(a,b) { 
    if (b[colIndex] < a[colIndex]) return oldSort; 
    if (b[colIndex] > a[colIndex]) return oldSort * -1; 
    if (b[colIndex] == a[colIndex]){
      return 0;
    }
  }

  // the numeric sort
  function numBasedSort(a, b) { 
	 x = (a[colIndex])/1 - (b[colIndex])/1;  
	 return x * oldSort;
  }  	 

  // Find out what data type that col has
  var colDataType = this.types[colIndex];
   
  // Now that we know the type, we choose the sort
  switch (colDataType) {
  case 'Text':
  case 'Date':
	this.dataArray.sort(charBasedSort);
	break;
  default:
	this.dataArray.sort(numBasedSort);
  }

  // reset the col header style to that for an unsorted col,
  // and save the col widths (because they will be lost when the table is redrawn)
  var leftColWidths = new Array();
  var oLeftPane = eval(this.id + 'LeftPaneTable');
  for (c = 0; c < oLeftPane.rows(0).cells.length; c++) {
    leftColWidths[c - 1] = oLeftPane.rows(0).cells(c).clientWidth;
	//alert("x c =" + c + "  \nw = " + oLeftPane.rows(0).cells(c).clientWidth);
    oLeftPane.rows(0).cells(c).className = "colhead";
  }
  var rightColWidths = new Array();
  var oRightPane = eval(this.id);
  for (c = 0; c < oRightPane.rows(0).cells.length; c++) {
    rightColWidths[c - 1] = oRightPane.rows(0).cells(c).clientWidth;
    oRightPane.rows(0).cells(c).className = "colhead";
  }

  if (this.tableStyle == "paged") {
    this.fillTable();
  } else {
    this.drawFilledTable();
  }
  eval(me.id + '.className = "colheadsorted"');

  // Try to highlight col in left pane.
  // If the clicked col has been moved into the left pane, then there will be more
  // than one col with the same id, and the first one will be accessible as id(0).   
  eval ('try{' + me.id + '(0).className="colhead colheadsorted"}catch(e){}finally{}');

  this.restoreMouseDefaults();
  //this.setColWidths(leftColWidths,rightColWidths);
  return;

}


<!--@<< fix col widths >>-->
<!--@+node:1::<< fix col widths >>-->
<!--@+body-->
<!--@@code-->

function setColWidths(leftColWidths, rightColWidths) {

  // right pane
  var oRightPane = eval(this.id);
  var step = 1;
  var colAdjust = 1;
  var startRow = 1;
  if (this.tableStyle != "paged") {
    step = 2;   
    colAdjust = 0;
	startRow = 0;
  }

  for (c = 0; c < oRightPane.rows(0).cells.length; c++) {

    label = colLabel(c + colAdjust); 
//alert(label);
    label.style.overflow = 'hidden';
    label.style.width = Math.max(rightColWidths[c] - 10, 0);
	//alert(c + " " + rightColWidths[c]);
    // loop thru the NOBR elements in each field in the column
//    alert(c);
	for (r = startRow; r < oRightPane.rows.length; r += step) {
      // get the NOBR element in the cell
      nobrEL = oRightPane.rows(r).cells(c).firstChild;
      nobrEL.style.overflow = 'hidden';
      nobrEL.style.width=Math.max(rightColWidths[c] - 10, 10);
    }  
  }
return;
  if (this.tableStyle == "masterDetail") return;

  // left pane
  var oLeftPane = eval(this.id + "LeftPaneTable"); 
  for (c = 0; c < oLeftPane.rows(0).cells.length; c++) {

    label = colLabel(c); 
    label.style.overflow = 'hidden';
//	alert(leftColWidths[c]);
    label.style.width = Math.max(leftColWidths[c] - 10, 0);

    // loop thru the NOBR elements in each field in the column
    for (r = 1; r < oLeftPane.rows.length; r++) {
      // get the NOBR element in the cell
      nobrEL = oLeftPane.rows(r).cells(c).firstChild;
      nobrEL.style.overflow = 'hidden';
      nobrEL.style.width=Math.max(leftColWidths[c] - 10, 0);
    }  
  }

  // adjust left and right pane widths
  oRightPane.parentElement.style.width = Math.max(this.tableWidth - oLeftPane.clientWidth, 10);  
  
}

<!--@-body-->
<!--@-node:1::<< fix col widths >>-->


// Hey, why isn't this function inside the sort function, since that is only place it will be called
// from? Gee I'm glad you asked that. It's bc this function has to be called in a separate event
// (e.g. onclick) than the soft function, otherwise, the screen doesn't get refreshed with the new
// cursor.
function showHourGlass() {
return;
  var myRules = document.styleSheets[0].rules;
  for (i = 0; i < myRules.length; i++) {
	this.rules[i] = myRules[i].style.cursor;
	myRules[i].style.cursor = 'wait';
  }

}

function restoreMouseDefaults() {
return;
  // Need this line in case showHourGlass wasn't called
  if (this.rules[0] == undefined) return;

  var myRules = document.styleSheets[0].rules;
  for (i = 0; i < myRules.length; i++) {
	 myRules[i].style.cursor = this.rules[i];
  }  

}

]]>

<!--@-body-->
<!--@-node:11::<< sorting >>-->


<!--@<< multilevel >>-->
<!--@+node:12::<< multilevel >>-->
<!--@+body-->
<!--@@code-->


<!--@<< get multilevel data >>-->
<!--@+node:1::<< get multilevel data >>-->
<!--@+body-->
<!--@@code-->

<![CDATA[
// this array will be used to remember which detail tables we have already retrieved
gotIt = new Array();

function getDetail(show, position, url) {

  if (this.tableStyle == 'paged') {
    alert("Multilevel view is only available when this result set is shown in vertically scrolling display.\nThe current display is paged (not vertically scrolled). \nPlease choose vertical scrolling from the options menu.")
    return;
  }

  mlMenu.style.display = "block";

  function hash() {
  }

  var dataRowHash = new hash();

  if (show) {

    // check to see if we already have this data
    if (gotIt[position]) {
      itemFrame = eval ("level1_" + position);
      for (r = 0; r < detailFrame.length; r++) {
        itemFrame(r).style.display = "block";
      }
      return;
    }
    gotIt[position] = true;
  
    rowsetXML.async = false;
    rowsetXML.load(url);

    var dataCols, lineHTML, pk;
    var dataRows = rowsetXML.getElementsByTagName("row");

  // get the formats and headers for the detail table
  var formats  = rowsetXML.getElementsByTagName("format");
  var headings = rowsetXML.getElementsByTagName("heading");
  var types    = rowsetXML.getElementsByTagName("type");
  var colNames = rowsetXML.selectNodes("//column/@name");
  var widths = new Array();  
  
  // if the cell is a desc cell, make it wide
  for (c = 0; c < colNames.length; c++) {
    widths[c] = "10";
	if (colNames[c].text.match(/desc/i)) {
	  widths[c] = "";  
    }
  }
  
  var width=10;
  // create a hash with keys = the pk and values = the html for the detail table rows for that pk
  lineHTML = "";
  for (r = 0; r < dataRows.length; r++) {
    dataCols = dataRows[r].getElementsByTagName("value");
    lineHTML = "";
	for (c = 2; c < dataCols.length; c++) {
	  lineHTML += '<td class="' 
	                + types(this.columnIndexes[c]).text + '"'
			        //+ ' style="width:' 
					// + (widths[c].text * 6) + '"'
					// + widths[c] + '"'
					+ ' nowrap>' 
			        + this.formatItem(dataCols[c].text, formats[c].text) 
			      + '</td>';
	}
	lineHTML = '<tr onclick="highlightSubTableRow(this)" class="level2Row">' + lineHTML + '</tr>';
    pk = dataCols[1].text; // KLUDGE
	if (dataRowHash[pk] == undefined) {
	  dataRowHash[pk] = lineHTML;
	} else {
	  dataRowHash[pk] += lineHTML;
	} 
  }

  // the html for the detail table head
  var headingHTML = "";
  for (c = 2; c < headings.length; c++) {
    headingHTML += '<td valign="top" class="level2ColHeadCell" nowrap>' + this.formatItem(headings[c].text, "") + '</td>';
  }    
  headingHTML = '<tr class="level2ColHeadRow">' + headingHTML + '</tr>';
  
  // now loop thru the detail tables in the DHTML and insert the table lines
  // detailFrame is an empty element holding all of the subtables for a given master line
  // itemFrame is an empty element holding a single subtable
  itemFrame = eval ("level1_" + position);
  for (r = 0; r < detailFrame.length; r++) {
	pk = itemFrame(r).pk;
	if (dataRowHash[pk]) {
      itemFrame(r).innerHTML = '<table border="0" class="level2Table">' + headingHTML + dataRowHash[pk] + '</table>';
    } else {
      itemFrame(r).innerHTML = '<table border="0" class="level2Table">' + headingHTML + '</table>';	     
	}   
	detailFrame(r).parentElement.style.display = "block";
  }
    
  // show the buttons
  this.multilevel();
    
} else { // else hide it

  itemFrame = eval ("level1_" + position);
  for (r = 0; r < detailFrame.length; r++) {
    itemFrame(r).style.display = "none";
  }

}

  //fso = new ActiveXObject("Scripting.FileSystemObject");
  //f = fso.CreateTextFile('testm.htm',true);
  //f.write(topx.innerHTML);
  //f.Close();


}



]]>	      		

<!--@-body-->
<!--@-node:1::<< get multilevel data >>-->


<!--@<< show multilevel view >>-->
<!--@+node:2::<< show multilevel view >>-->
<!--@+body-->
<!--@@code-->

<![CDATA[
function multilevel() {

  var oDHTMLTable = eval(this.id);
  this.tableStyle = "masterDetail";
  
  // get rid of left pane, including col headers and col sums
  leftPane.innerHTML = "";
  leftPaneHeader.innerHTML = "";
  leftPaneSumRow.innerHTML = "";

  // unhide cols in right pane
  var maxTableR = oDHTMLTable.rows.length;
  for (r = 0; r < maxTableR; r = r + 2) {
    oDHTMLTable.rows(r).className = "level1Row";
    for (c = 0; c < this.nonScrollingColumns.length; c++) {
      // skip the column if it hasn't been given a 'true' value in
      // the non-scrolling columns Array.
      if (this.nonScrollingColumns[c] == undefined) continue;
      if (! this.nonScrollingColumns[c]) continue;
      // alert(oDHTMLTable.rows(0).cells(c + 1).innerHTML);
      oDHTMLTable.rows(r).cells(c + 1).className = "level1Cell";
      oDHTMLTable.rows(r).cells(c + 1).style.display = "block";
    }
  }

  var rightPaneHeaderTable = rightPaneHeader.firstChild;
  var rightPaneSumRowTable = rightPaneSumRow.firstChild;
  // unhide col headers and col sums
  for (c = 0; c < this.nonScrollingColumns.length; c++) {
    if (this.nonScrollingColumns[c] == undefined) continue;
    if (! this.nonScrollingColumns[c]) continue;
    sumCell(c).style.display = 'block';	
    rightPaneHeaderTable.rows(0).cells(c + 1).style.display = "block";
    rightPaneSumRowTable.rows(0).cells(c + 1).style.display = "block";	   
  }
      
  // show the open/close buttons
  for (c = 0; c < plusButton.length; c++) {
    plusButton(c).style.display = 'block';
  }
  plusButtonHeader.style.display = 'block';
  plusButtonFooter.style.display = 'block';
  
  // reset the data pane width (now right pane only)
  rightPane.style.width = 782;
  rightPaneHeader.style.width = 782;
  rightPaneSumRow.style.width = 782;
}
]]>
<!--@-body-->
<!--@-node:2::<< show multilevel view >>-->


<!--@<< multilevel row methods >>-->
<!--@+node:3::<< multilevel row methods >>-->
<!--@+body-->
<!--@@code-->
<![CDATA[
function toggleRowOpen(me) {

  event.cancelBubble = true;
  var myDisplay;
	 myDisplay = me.parentNode.nextSibling.style.display;
	 if (myDisplay != 'none') {
	   myDisplay = 'none';
	   me.firstChild.innerHTML = '+';
	 } else {
	   myDisplay = 'block';
	   me.firstChild.innerHTML = '&minus;';
	 }
	 me.parentNode.nextSibling.style.display = myDisplay;

//  if (this.highlightedRow != null) {
//	this.highlightedRow.className = this.oldRowStyle;
//  }
//  this.oldRowStyle = me.className;
//  me.className = "highlightedRow";
//  this.highlightedRow = me;  

}

function closeAll() {

  if (this.tableStyle == 'masterDetail') {
	var r;
	var maxRows = this.tableRows;
	var runMe;
	for (r = 1; r < maxRows * 2; r = r + 2) {
	  runMe = (this.id + '.rows(' + r + ').style.display = "none";');
	  eval(runMe);
	  runMe = (this.id + '.rows(' + (r - 1) + ').cells(0).firstChild.innerHTML = "+";');
	  eval(runMe);
	}
  } else {
	alert("Nothing to close!");
  }

}

function openAll(){

  if (this.tableStyle == 'masterDetail') {
	var r;
	var maxRows = this.tableRows;
	var runMe;
	for (r = 1; r < maxRows * 2; r = r + 2) {
	  runMe = (this.id + '.rows(' + r + ').style.display = "block"');
	  eval(runMe);
	  runMe = (this.id + '.rows(' + (r - 1) + ').cells(0).firstChild.innerHTML = "&minus;"');
	  eval(runMe);
	}
  } else {
	alert("Nothing to open!");
  }

}
]]>

<!--@-body-->
<!--@-node:3::<< multilevel row methods >>-->




<!--@-body-->
<!--@-node:12::<< multilevel >>-->


<!--@<< unsorted >>-->
<!--@+node:13::<< unsorted >>-->
<!--@+body-->
<!--@@code-->


<![CDATA[

/**
 * changeCol: Change which column of data appears in a given colum in the display table.
 *
 * @colIndex    The column in the table that the picklist is in.
 * @titleIndex  The title index that has been chosen to put in that column.
 */

// the "action" parameter is for future functionality
function changeCol(colIndex, titleIndex, action) {

  // which data column was being displayed in this html column?
  var oldIndex = this.columnIndexes[colIndex];

  // find out which html col now contains the data column which is being moved
  // to the chosen col. Put the old data col in that html col.
  for (i = 0; i < this.columnIndexes.length; i++) {
	if (this.columnIndexes[i] == titleIndex) {
	  this.columnIndexes[i] = oldIndex;
	  break;
	}
  }

  // assign the chosen data column to the chosen html column
  this.columnIndexes[colIndex] = titleIndex;

  this.drawEmptyTable();
  this.fillTable();

  this.restoreMouseDefaults();
  return;

}

]]>

<![CDATA[
// Set columns back to same order as beginning (which is the same as in the original data).
function reset() {

  for (i = 0; i < this.dataArray.length; i++) this.rowIndexes[i] = i;
  for (i = 0; i < this.dataArray[1].length; i++) this.columnIndexes[i] = i;
  this.drawEmptyTable();
  this.fillTable();

}
]]>


<![CDATA[

// The following function is under development.
function addSumFunctionByColName(colName, strSumFunction) {

  var colIndex = -1;
  for(c = 0; c < this.columnIndexes.length; c++){  
    if (this.titles[c] == colName) {
	  colIndex = c;
	  break;
    }
  }
  this.sumFunctions[colIndex] = strSumFunction;

}

// for resizing table after window has been resized
function resize () {
  if (this.resized == true) {
    try {
      oDHTMLTable = eval(this.id);
      oDHTMLTable.style.display = 'none';
      this.tableWidth = document.body.clientWidth - 20;

      // "tableHeader" is temporarily hard coded here til I decide
      // what to do with it... TODO fix
      tableHeader.style.width = document.body.clientWidth - 20;
      rightPaneHeader.style.width = rightPane.clientWidth;
	  
      oDHTMLTable.style.display = 'block';
      this.fillTable();
    } catch (e) {
    }
  }
  this.resized = false;

}

function flagResize () {
  // can't seem to get "this.resized" to work so have hard coded the name here...
  dataTable.resized = true;
}

  
]]>










<!--@-body-->
<!--@-node:13::<< unsorted >>-->
<!--@-body-->
<!--@-node:2::<< other dhtml table methods >>-->


// End of method definitions, now add each method to the object prototype

// Accessor Methods
clsDHTMLTable.prototype.setTableRows = setTableRows;
clsDHTMLTable.prototype.setStartRow = setStartRow;
clsDHTMLTable.prototype.setOrientation = setOrientation;

// draw and fill table
clsDHTMLTable.prototype.drawEmptyTable = drawEmptyTable;
clsDHTMLTable.prototype.drawFilledTable = drawFilledTable;
clsDHTMLTable.prototype.fillTable = fillTable;
clsDHTMLTable.prototype.fillCell = fillCell;
clsDHTMLTable.prototype.getCellData = getCellData;

// misc methods
clsDHTMLTable.prototype.calculateColTotals = calculateColTotals;
clsDHTMLTable.prototype.formatItem = formatItem;
clsDHTMLTable.prototype.highlightRow = highlightRow;
clsDHTMLTable.prototype.changeCol = changeCol;
clsDHTMLTable.prototype.addSumFunctionByColName = addSumFunctionByColName;

// sorting and related methods
clsDHTMLTable.prototype.sortRows = sortRows;
clsDHTMLTable.prototype.reset = reset;
clsDHTMLTable.prototype.showHourGlass = showHourGlass;
clsDHTMLTable.prototype.restoreMouseDefaults = restoreMouseDefaults;
clsDHTMLTable.prototype.setColWidths = setColWidths; // used after sorting
// deprecated
//clsDHTMLTable.prototype.buildSortFunctionBody = buildSortFunctionBody;

// master detail methods
clsDHTMLTable.prototype.toggleRowOpen = toggleRowOpen;
clsDHTMLTable.prototype.closeAll = closeAll;
clsDHTMLTable.prototype.openAll = openAll;
clsDHTMLTable.prototype.multilevel = multilevel;
clsDHTMLTable.prototype.getDetail = getDetail;

// Navigation methods
clsDHTMLTable.prototype.goNext  = goNext;
clsDHTMLTable.prototype.goPrev  = goPrev;
clsDHTMLTable.prototype.goFirst = goFirst;
clsDHTMLTable.prototype.goLast  = goLast;

// Report and detail screens
clsDHTMLTable.prototype.makeReport  = makeReport;
clsDHTMLTable.prototype.goSubreport = goSubreport;

// get next, prev
clsDHTMLTable.prototype.getNext = getNext;
clsDHTMLTable.prototype.getPrev = getPrev;
clsDHTMLTable.prototype.getCurr = getCurr;

// col resizing
clsDHTMLTable.prototype.TDselMove = TDselMove;
clsDHTMLTable.prototype.TDselUp = TDselUp;
clsDHTMLTable.prototype.TDselDown = TDselDown;

// table resize
clsDHTMLTable.prototype.flagResize = flagResize;
clsDHTMLTable.prototype.resize = resize;



<!--@-body-->
<!--@-node:1::<< dhtmltable object >>-->


<!--@<< general >>-->
<!--@+node:2::<< general >>-->
<!--@+body-->
<!--@@code-->
<![CDATA[
/* changeFontSize : Change the font size of an HTML element by changing the doc stylesheet.
 *                  This function will work with any page.
 * 
 * @op : + or -
 * @styleName : e.g. TD or .custom
 */
function changeFontSize(op, styleName) {

  var myRules = document.styleSheets[0].rules;
  var size;
  var lineHeight = "";
  for (i = 0; i < myRules.length; i++) {
	if (myRules[i].selectorText == styleName) {

	  var lineHeight = myRules[i].style.lineHeight;

	  size = myRules[i].style.fontSize;
	  size = size.replace(/\D/g, "");     // get the numeral (the style will be e.g. "8pt")
	  size = size / 1;                    // i.e. (int) size
	  eval ("size = size " + op + " 1");
	  size = size + "pt";
	  myRules[i].style.fontSize = size; 
	}
  }	
}

// add commas to a numeral 
function commify (myItem) {

  myItem = myItem.toString();

  // add commas
  myItem = myItem.replace(/^(-?\d+)(\d{3})/g, "$1,$2");
  // kludge - the latter command only gets the first comma
  // this gets the second... couldn't get a more Perlish regex to work here.
  myItem = myItem.replace(/^(-?\d+)(\d{3})/g, "$1,$2");
  // this gets the third.. yo, if this was Perl, I wouldn't have to do this... 
  myItem = myItem.replace(/^(-?\d+)(\d{3})/g, "$1,$2");
  // and the fourth...
  myItem = myItem.replace(/^(-?\d+)(\d{3})/g, "$1,$2");
  // did I mention that the above regexes would have been better in Perl?
  //myItem = "$" + myItem;
  
  return myItem;
}
]]>

<!--@-body-->
<!--@-node:2::<< general >>-->
 

</script>

<!--@-body-->
<!--@-node:2::<< script >>-->


</head>

<!--@-body-->
<!--@-node:1::<< head >>-->


<!--@<< body >>-->
<!--@+node:2::<< body >>-->
<!--@+body-->
<!--@@language html-->
<!--@@code-->

<body onload="init();">  

<span id="topx">


<!--@<< report title >>-->
<!--@+node:1::<< report title >>-->
<!--@+body-->
<!--@@code-->

<xsl:if test="$reportTitle">
  <table style="margin-left:0; margin-bottom:1;" width="{$tableWidth - 1}" cellpadding="0" 
	bgcolor="#C9E5E7" border="0" id="tableHeader">
  <tr>
  <td title="{$reportTitle}" class="{$titleFormat}">
  <nobr style="width:340; overflow:hidden">
<xsl:value-of select="$reportTitle"/>
  </nobr>
  </td>
  </tr>
  </table>
</xsl:if>

<!--@-body-->
<!--@-node:1::<< report title >>-->


<!--@<< options >>-->
<!--@+node:2::<< options >>-->
<!--@+body-->
<!--@@code-->
<xsl:if test="$customization != 'false'">
<div class="dialogCustom1">
  
  <!--@<< menubar >>-->
  <!--@+node:1::<< menubar  >>-->
  <!--@+body-->
  <!--@@code-->

   &#160; &#160; &#160; &#160; &#160; &#160; &#160; 
   &#160; &#160; &#160; &#160; &#160; &#160; &#160; 
  <nobr style="overflow:hidden; position:absolute; top:0;">
  <table><nobr><tr><td><nobr>
  <!--
  <a href="javascript:showCustomDialog()">Customize</a> 
   &#160; 
  <a href="javascript:dataTable.makeReport()">Fast Print Version</a>
   &#160; 
  -->
  <a href="javascript:changeFontSize('+', 'TD')">Zoom in</a>
   &#160; 
  <a href="javascript:changeFontSize('-', 'TD')">Zoom out</a>
   &#160; 
  </nobr>
  </td>
  <td>
  <nobr>
  <span id="mlMenu" style="display:none">
    <a href="javascript:dataTable.openAll()">Open All</a>
   &#160; 
    <a href="javascript:dataTable.closeAll()">Close All</a>
   &#160; 
  </span>
  </nobr>
  
  </td></tr></nobr></table>
  </nobr>
  
  <!--@-body-->
  <!--@-node:1::<< menubar  >>-->

  <div id="customDialog" style="display:none">
    <br/><br/><br/><br/><br/>
    <table class="dialogTable" cellpadding="2" cellspacing="2" width="350" >
      <tr style="background-color:navy">
        <td style="cursor:hand;border:0" align="right" onclick="showCustomDialog()">  
	      <img src="/inquiry/images/x2.png" border="0"/>
        </td>
	  </tr>
      
	  <!--@<< option items >>-->
	  <!--@+node:2::<< option items >>-->
	  <!--@+body-->
	  <!--@@code-->

	  
	  <!--@<< capitalize >>-->
	  <!--@+node:1::<< capitalize >>-->
	  <!--@+body-->
	  <!--@@code-->
	  	
	  <tr class="dialogRow">
	    <td align="center">
	      <strong>Capitalize: </strong>
	      <input type="checkbox" value=""
	         onclick="dataTable.mixedCase = ! this.checked;dataTable.drawEmptyTable();dataTable.fillTable()"/> 
	    </td>
	  </tr>
	  
	  <!--@-body-->
	  <!--@-node:1::<< capitalize >>-->

	  
	  <!--@<< show column picklist >>-->
	  <!--@+node:2::<< show column picklist >>-->
	  <!--@+body-->
	  <!--@@code-->

	  <tr>    
	    <td class="dialogRow" align="center">
	  	<strong>Show column pick list: </strong>
	  	<input type="checkbox" value="" id="pickListCheckbox" 	 
	    onclick="customDialog.style.display = 'none';dataTable.pickList = this.checked;dataTable.drawEmptyTable();dataTable.fillTable()"/> 
	    </td>
	  </tr>
	  
	  <!--@-body-->
	  <!--@-node:2::<< show column picklist >>-->

	  
	  <!--@<< orientation >>-->
	  <!--@+node:3::<< orientation >>-->
	  <!--@+body-->
	  <!--@@code-->

	  <tr>
	    <td class="dialogRow" align="center">
	    <strong>Orientation: </strong>
	    <input type="radio" checked="true" name="orientation"
	  		 onclick="dataTable.setOrientation('landscape')">View as Row</input>&#160;
	    <input type="radio" name="orientation" 
	  		 onclick="dataTable.setOrientation('portrait')">View as Col</input>
	    </td>
	  </tr>
	  
	  <!--@-body-->
	  <!--@-node:3::<< orientation >>-->

	  
	  <!--@<< number of records to show >>-->
	  <!--@+node:4::<< number of records to show >>-->
	  <!--@+body-->
	  <!--@@code-->

	  <tr>
	    <td class="dialogRow" align="center">
	         <strong>Number of records to show: </strong>
	      <input style="font-size:10; color:#000000; width:20;" 
	  		 type="text" value="" id="inputNumRows"
	  		 onchange="dataTable.setTableRows(this.value);"/> 
	    </td>
	  </tr>
	  
	  <!--@-body-->
	  <!--@-node:4::<< number of records to show >>-->

	  
	  <!--@<< reset columns to defaults >>-->
	  <!--@+node:5::<< reset columns to defaults >>-->
	  <!--@+body-->
	  <!--@@code-->

	  <tr>
	    <td class="dialogRow" style="height:30" align="center">
	  	<button onclick="dataTable.reset()" 
	  			style="font-size:11; font-weight:normal; width:180; background-color:#E9F2F2">Reset Columns to Defaults</button>
	    </td>
	  </tr>
	  
	  <!--@-body-->
	  <!--@-node:5::<< reset columns to defaults >>-->

	  
	  <!--@<< pick non scrolling rows >>-->
	  <!--@+node:6::<< pick non scrolling rows >>-->
	  <!--@+body-->
	  <!--@@code-->

	  <!--
	  <tr>
	    <td class="dialogRow" align='center' style="height:30">
	         <table cellspacing="8"><tr><td>
	  	<strong>Non Scrolling</strong><br/>
	  	<select size="{count(//rows/coldef/column)}" onchange="setNonScrollingColumns(this)">
	  	  <xsl:for-each select="/rows/coldef/column">
	  		<option value="{position()}"><xsl:value-of select="normalize-space(heading)"/></option>
	  	  </xsl:for-each>
	  	</select>
	  	</td><td>
	  	<strong>Scrolling</strong><br/>
	  	<select onchange="setScrollingColumns(this)" size="{count(//rows/coldef/column)}">
	  	  <xsl:for-each select="/rows/coldef/column">
	  		<option value="{position()}"><xsl:value-of select="normalize-space(heading)"/></option>
	  	  </xsl:for-each>
	  	</select>		
	         </td></tr></table>
	    </td>
	  </tr>
	  -->
	  
	  <!--@-body-->
	  <!--@-node:6::<< pick non scrolling rows >>-->

	  
	  
	  <!--@-body-->
	  <!--@-node:2::<< option items >>-->

    </table>
    
	<!--@<< customization scripts >>-->
	<!--@+node:3::<< customization scripts >>-->
	<!--@+body-->
	<!--@@code-->

	<script>
	
	<![CDATA[
	
	function openSplash(splashType){
	
	window.open("/inquiry/html/start" + splashType + "splash.html?delay=5000",
	"",
	"height=97,width=285,left=350,top=320,status=no,toolbar=no,menubar=no,location=no,resizable=no,titlebar=no");            
	
	}
	
	
	]]>
	
	function showCustomDialog() {
	
	  pickListCheckbox.checked = false;
	    	
	  if (customDialog.style.display == 'none') {
	
	    // have to get rid of col pick lists when displaying custom dialog bc
	    // otherwise the dropdown menus show thru the dialog
	    if (dataTable.pickList) {
	 	  dataTable.pickList = false;
		  dataTable.drawEmptyTable();
		  dataTable.fillTable()	  
	    }
		customDialog.style.display = 'block'
	
	  } else {
	    customDialog.style.display = 'none'	
	  }  
	}
	
	// add or remove a selected column to the left pane
	function setNonScrollingColumn(colIndex) {
	  if (dataTable.nonScrollingColumns[colIndex - 1] == true) {
	    dataTable.nonScrollingColumns[colIndex - 1] = false;
	  } else {
	    dataTable.nonScrollingColumns[colIndex - 1] = true;
	  }
	  dataTable.drawEmptyTable();
	  dataTable.fillTable();
	}
	</script>
	
	<!--@-body-->
	<!--@-node:3::<< customization scripts >>-->

  </div>
</div>
</xsl:if>


<!--@-body-->
<!--@-node:2::<< options >>-->


<!--@<< the container for the DHTML table object >>-->
<!--@+node:3::<< the container for the DHTML table object >>-->
<!--@+body-->
<!--@@code-->

<div id="tableFrame" onmousemove="selection.empty()">

</div>

<!--@-body-->
<!--@-node:3::<< the container for the DHTML table object >>-->


<!--@<< script to draw table >>-->
<!--@+node:4::<< script to draw table >>-->
<!--@+body-->
<!--@@code-->



<!--@<< metadata >>-->
<!--@+node:1::<< metadata >>-->
<!--@+body-->
<!--@+doc-->
<!--


Fills the following associative arrays:
  oColTotals
  oDetailJSP

Fills the following arrays:
  fieldNames
  fieldTitles  (col headings)
  fieldFormats (used by format function)
  fieldTypes   (for choosing css style)



-->

<!--@-doc-->
<!--@@code-->

<script>

var paged = <xsl:value-of select="$paged"/>

// associative array to hold precalculated col totals
function clsColTotals() {
<xsl:for-each select="//rows/total/value">
  <xsl:if test=". != ''">
  this.<xsl:value-of select="@name"/>='<xsl:value-of select="."/>';</xsl:if>
</xsl:for-each>
}
oColTotals = new clsColTotals();

// associative array to hold the JSP detail page info
function clsDetailJSP() {
  this.pageURL='<xsl:value-of select="normalize-space(//detail-jsp/jsp-name)"/>';
  this.params=[<xsl:for-each select="//detail-jsp/pk">'<xsl:value-of select="normalize-space(.)"/>'<xsl:if test="position() != last()">,</xsl:if></xsl:for-each>];
}
oDetailJSP = new clsDetailJSP();

<!-- field names -->
var fieldNames = new Array(<xsl:text/>
<xsl:for-each select="//coldef/column">
  <xsl:text>"</xsl:text>
  <xsl:value-of select="@name"/>"<xsl:if test="position() != last()">,</xsl:if>
</xsl:for-each>
<xsl:text>);</xsl:text>

<!-- field titles -->
var fieldTitles = new Array(<xsl:text/>
<xsl:for-each select="//coldef/column">
  <xsl:text>"</xsl:text>
  <xsl:value-of select="normalize-space(heading)"/>"<xsl:if test="position() != last()">,</xsl:if>
</xsl:for-each>
<xsl:text>);</xsl:text>

// fix the titles so that they will wrap for a max of two lines
<![CDATA[
for (i = 0; i < fieldTitles.length; i++) {
  // replace all the spaces with nbsp;
  fieldTitles[i] = fieldTitles[i].replace(/ /g, "&nbsp;");
  // now replace the first nbsp with a reg space
  fieldTitles[i] = fieldTitles[i].replace(/&nbsp;/, " ");
}
]]>

<!-- field Types (data types) -->
var fieldTypes = new Array(<xsl:text/>
<xsl:for-each select="//coldef/column">
  <xsl:text>"</xsl:text>
  <xsl:value-of select="normalize-space(type)"/>"<xsl:if test="position() != last()">,</xsl:if>
</xsl:for-each>
<xsl:text>);</xsl:text>

<!-- field Formats (i.e., styles) -->
var fieldFormats = new Array(<xsl:text/>
<xsl:for-each select="//coldef/column">
  <xsl:text>"</xsl:text>
  <xsl:value-of select="normalize-space(format)"/>"<xsl:if test="position() !=  last()">,</xsl:if>
</xsl:for-each>
<xsl:text>);</xsl:text>

</script>

<!--@-body-->
<!--@-node:1::<< metadata >>-->


<!--@<< first page of data >>-->
<!--@+node:2::<< first page of data >>-->
<!--@+body-->
<!--@+doc-->
<!--


Just get as many rows as we need to fill the first page.


-->

<!--@-doc-->
<!--@@code-->

<script>

var rows = new Array();
<xsl:for-each select="//row[position() &lt; $newRowCount + 1]">
rows [<xsl:value-of select="position() - 1"/><xsl:text>] = [</xsl:text>
  <xsl:for-each select="./*">
	<xsl:text>"</xsl:text>
	<!-- get the value, but get rid of embedded quote marks and extra space -->
	<xsl:value-of select="translate(normalize-space(.),'&#x22;', '')"/>
	<xsl:text>"</xsl:text>
	<xsl:if test="position() != last()">,</xsl:if>
  </xsl:for-each>
  <xsl:text>];</xsl:text>  
</xsl:for-each>

</script>

<!--@-body-->
<!--@-node:2::<< first page of data >>-->


<!--@<< create the table with one page of data >>-->
<!--@+node:3::<< create the table with one page of data >>-->
<!--@+body-->
<!--@@code-->

<script>

  var paged = <xsl:value-of select="$paged"/>
  
  // create a new data table
  var tableStyle = "paged";
  if (! paged) tableStyle = "scrolling";

  var dataTable = new clsDHTMLTable(<xsl:value-of select="$newRowCount"/>,0, "DHTMLTable", "dataTable", "tableFrame", rows, fieldNames, fieldTitles, fieldTypes, fieldFormats, null, tableStyle, oColTotals, oDetailJSP);

  dataTable.orientation="<xsl:value-of select="$orientation"/>";
  dataTable.totalFlags[2] = true;

  // move as many cols into the left (non scrolling page) as are indicated by the 
  // nonScrollingCols parameter
  if (<xsl:value-of select="$numNonScrollingCols"/> &lt; rows[0].length ) {
    for (i = 0; i &lt;=<xsl:value-of select="$numNonScrollingCols"/>; i++) {
      dataTable.nonScrollingColumns[i - 1] = true;
    }
  }
  
  dataTable.drawEmptyTable();
  dataTable.totalRows = <xsl:value-of select="count(//rows/row)"/>;
  dataTable.fillTable(false);

</script>
<!--@-body-->
<!--@-node:3::<< create the table with one page of data >>-->


<!--@<< the rest of the data >>-->
<!--@+node:4::<< the rest of the data >>-->
<!--@+body-->
<!--@+doc-->
<!--


 html lines of data
<tr ondblclick='dataTable.goSubreport(this);' class='evenrow'
   onclick='dataTable.highlightRow(this);' rowIndex="0">

<td id="plusButton" class="dataRow" style="display:none" onclick="dataTable.toggleRowOpen(this);">
   <nobr class="plusButton">minus;</nobr>
</td>
<td id="plusButton" class="dataRow" style="display:none"
onclick="dataTable.toggleRowOpen(this);">
<nobr class="plusButton">minus;</nobr>
</td>
<td class="Text" style="display:none;" ><nobr>0000491</nobr></td>
<td class="Text" ><nobr>columbia mall</nobr></td>
<td class="default" ><nobr>168,657,853.56</nobr></td>
<td class="Number" ><nobr>7.377</nobr></td>
<td class="Text" ><nobr>MD</nobr></td>
<td class="Text" ><nobr>regional mall</nobr></td>
<td class="Text" ><nobr>PEN</nobr></td>
<td class="Text" ><nobr>NT</nobr></td>
</tr>
<tr STYLE="display:none">
<td id="detailFrame" pk="0000491" colspan="13">
<span id="level1_0" + pk = "0000491"></span>
<span id="level1_1" + pk = "0000491"></span>
<span id="level1_2" + pk = "0000491"></span>
<span id="level1_3" + pk = "0000491"></span>
<span id="level1_4" + pk = "0000491"></span>
</td>
</tr>



-->

<!--@-doc-->
<!--@@code-->
<script>

<xsl:for-each select="//row[position() &gt; $newRowCount]">
rows [<xsl:value-of select="position() + $newRowCount - 1"/><xsl:text>] = [</xsl:text>
  <xsl:for-each select="./*">
	<xsl:text>"</xsl:text>
	<!-- get the value, but get rid of embedded quote marks and extra space -->
	<xsl:value-of select="translate(normalize-space(.),'&#x22;', '')"/>
	<xsl:text>"</xsl:text>
	<xsl:if test="position() != last()">,</xsl:if>
  </xsl:for-each>
  <xsl:text>];</xsl:text>  
</xsl:for-each>

</script>

<!--@-body-->
<!--@-node:4::<< the rest of the data >>-->


<!--@<< create the table again >>-->
<!--@+node:5::<< create the table again >>-->
<!--@+body-->
<!--@@code-->
<script>

  dataTable = new clsDHTMLTable(<xsl:value-of select="count(//rows/row)"/>,0, "DHTMLTable", "dataTable", "tableFrame", rows, fieldNames, fieldTitles, fieldTypes, fieldFormats, null, tableStyle, oColTotals, oDetailJSP);   

 
  dataTable.totalFlags[2] = true;

  if (paged == false) {
    // move as many cols into the left (non scrolling page) as are indicated by the 
    // nonScrollingCols parameter
    if (<xsl:value-of select="$numNonScrollingCols"/> &lt; rows[0].length ) {
      for (i = 0; i &lt;=<xsl:value-of select="$numNonScrollingCols"/>; i++) {
        dataTable.nonScrollingColumns[i - 1] = true;
      }
    }
    dataTable.drawFilledTable();
    dataTable.totalRows = <xsl:value-of select="count(//rows/row)"/>;
  }

</script>


<!--@-body-->
<!--@-node:5::<< create the table again >>-->



<!--@-body-->
<!--@-node:4::<< script to draw table >>-->


<!--@<< xsl for rowset data >>-->
<!--@+node:5::<< xsl for rowset data >>-->
<!--@+body-->
<!--@@code-->

<xml id="rowsetXSL" src="../xml/xmlrowset-WD.xsl"></xml>
<xml id="rowsetXML"></xml>

<!--@-body-->
<!--@-node:5::<< xsl for rowset data >>-->


</span>

<div id="TDsel" onmouseover="dragTD=true" onmouseout="dragTD=false" 
onmousemove="dataTable.TDselMove()" onmouseup="dataTable.TDselUp()"
 style="position:absolute;filter:alpha(opacity=30);border:2 solid black;top:0;left:-1000;height:100%;z-index:2;background-color:thistle" >
</div>

</body>

<!--@-body-->
<!--@-node:2::<< body >>-->


</html>

</xsl:template>

<!--@-body-->
<!--@-node:3::<< main template >>-->


</xsl:stylesheet>


<!--@-body-->
<!--@-node:0::@file multilevel.xsl-->
<!--@-leo-->

