/******************************************************************************
* backdrop.js
*
* Creates the backdrop for the different pages. The backdrop contains the
* logo and tabs.
*
* Requires: dhtml.js and globals.js
******************************************************************************/

function backdropInit(layerMain, tabTitle) {
// Returns layer

  var printAnchor;
  var layer;
  var height;
  var heightBody;
  var html;

  // Preload images.
  gPreloadImages(gUrlBaseName + 'graphics/borders/borderlogo.jpg',
    gUrlBaseName + 'graphics/borders/borderlefttop.jpg',
    gUrlBaseName + 'graphics/borders/bordermiddletop.jpg',
    gUrlBaseName + 'graphics/borders/borderrighttop.jpg',
    gUrlBaseName + 'graphics/borders/borderleft.jpg',
    gUrlBaseName + 'graphics/borders/borderright.jpg',
    gUrlBaseName + 'graphics/borders/borderleftbottom.jpg',
    gUrlBaseName + 'graphics/borders/bordermiddlebottom.jpg',
    gUrlBaseName + 'graphics/borders/borderrightbottom.jpg'
  );

  // Add the top border.
  html  = '\n<!-- WYAL -->\n';
  html += '<table border=0 cellspacing=0 cellpadding=0>\n';
  html += '  <tr>\n';
  html += '    <td width=' + gBorderHorizontal
               + ' height=' + gBorderOffset
               + ' bgcolor="' + gColorWhite + '"></td>\n';
  html += '    <td width=' + gWYALJpgWidth
               + ' height=' + gWYALJpgHeight
               + ' rowspan=3>'
               + '<a href="' + gUrlBaseName + 'index.htm">'
               +   '<img src="' + gUrlBaseName + 'graphics/borders/borderlogo.jpg" alt="home"'
               +   '  width=' + gWYALJpgWidth
               +   '  height=' + gWYALJpgHeight + ' border=0></a></td>\n';
  html += '    <td align="center" valign="bottom" width = ' + gBorderMiddleTopWidth
               + ' height=' + gBorderOffset
               + ' bgcolor="' + gColorWhite + '"><div class=headingTitle>'
               + '&nbsp;Woodbury Youth Athletic League (WYAL)</div></td>\n';
  html += '    <td width = ' + gBorderHorizontal
               + ' height=' + gBorderOffset
               + ' bgcolor="' + gColorWhite + '"></td>\n';
  html += '  </tr>\n'
  height = gWYALJpgHeight;

  html += '  <tr>\n'
  html += '    <td width=' + gBorderHorizontal
               + ' height=' + gBorderVertical
               + ' background="' + gUrlBaseName + 'graphics/borders/borderlefttop.jpg"></td>\n';
  html += '    <td width=' + gBorderMiddleTopWidth
               + ' height=' + gBorderVertical
               + ' background="' + gUrlBaseName + 'graphics/borders/bordermiddletop.jpg">'
               + '<div class=tabTitle>';
  if (gIncludeTitleInBorder) html += tabTitle;
  html += '</div></td>\n';
  html += '    <td width=' + gBorderHorizontal
               + ' height=' + gBorderVertical
               + ' background="' + gUrlBaseName + 'graphics/borders/borderrighttop.jpg"></td>\n';
  html += '  </tr>\n'
  height += gBorderHorizontal;

  html += '  <tr>\n'
  html += '    <td width=' + gBorderHorizontal
               + ' height=' + gBorderMiddleTopHeight
               + ' background="' + gUrlBaseName + 'graphics/borders/borderleft.jpg"></td>\n';
  html += '    <td valign="bottom" width=' + gBorderMiddleTopWidth
               + ' height=' + gBorderVertical
               + ' bgcolor="' + gColorWhite + '"><div class=tabTitle>';
  if (!gIncludeTitleInBorder) html += tabTitle;
  html += '</div></td>\n';
  html += '    <td width=' + gBorderHorizontal
               + ' height=' + gBorderMiddleTopHeight
               + ' background="' + gUrlBaseName + 'graphics/borders/borderright.jpg"></td>\n';
  html += '  </tr>\n'
  height += gBorderMiddleTopHeight;
  html += '</table>\n'

  // Add the left and right borders.
  heightBody = getHeight(layerMain) + 8;  // + getTop(layerMain) - gWYALJpgHeight;
  if (heightBody < gPageHeightMin) {
    heightBody = gPageHeightMin;
  }
  heightBody += gMainTopOffset;

  html += '<table bgcolor="' + gColorWhite + '" width=' + gPageWidth + ' border=0 cellspacing=0 cellpadding=0>\n';
  html += '  <tr>\n';
  html += '    <td><img src="' + gUrlBaseName + 'graphics/borders/borderleft.jpg"'
               + ' width=' + gBorderHorizontal + ' height=' + heightBody + '></td>\n';
  html += '    <td width=' + gBorderMiddleBottomWidth + '></td>\n';
  html += '    <td><img src="' + gUrlBaseName + 'graphics/borders/borderright.jpg"'
               + ' width=' + gBorderHorizontal + ' height=' + heightBody + '></td>\n';
  html += '  </tr>\n';
  html += '</table>\n';
  height += heightBody;

  // Add the bottom border.
  html += '<table border=0 cellspacing=0 cellpadding=0>\n';
  html += '  <tr>\n'
  html += '    <td width=' + gBorderHorizontal
               + ' height=' + gBorderVertical
               + ' background="' + gUrlBaseName + 'graphics/borders/borderleftbottom.jpg"></td>\n';
  html += '    <td width=' + gBorderMiddleBottomWidth
               + ' height=' + gBorderVertical
               + ' background="' + gUrlBaseName + 'graphics/borders/bordermiddlebottom.jpg"></td>\n';
  html += '    <td width=' + gBorderHorizontal
               + ' height=' + gBorderVertical
               + ' background="' + gUrlBaseName + 'graphics/borders/borderrightbottom.jpg"></td>\n';
  html += '  </tr>\n'
  html += '</table>\n';
  height += gBorderVertical;

// alert('html = ' + html + '\n');
  layer = createLayer(html, "backdrop", 0, 0, height, gPageWidth, 1);
  return layer;
}  // backdropInit

function footerInit(layerMain, layerBackdrop) {
// Returns layer

  var height;
  var html;
  var layer;
  var left;
  var top;

  height = 0
  html  = '\n<!-- Footer -->\n';
  html += '<table border=0 cellspacing=0 cellpadding=0>\n';
  html += '  <tr>\n';
  html += '    <td align=left><a href="#" onClick="prepForPrint()"><img src="' + gUrlBaseName
                 + 'graphics/printer.jpg" border=0 width=' + gPrinterJpgWidth
                 + ' height=' + gPrinterJpgHeight
                 + ' alt="Printer">Click here for a printer-friendly page, then select Print'
                 + ' from the File menu</a></td>\n';
  html += '  </tr>\n';
  html += '</table>\n';

  top = getBottom(layerBackdrop);
  left = gFooterLeft;  // getLeft(layerMain);
// alert("creating footer, top = " + top + ", left = " + left + ", height = " + height + ", width = " + gPageWidth);
  layer = createLayer(html, "footer", top, left, height, gPageWidth, 41);
  return layer;
}  // footerInit

function prepForPrint() {

  // Create a new window for the printable content
  URL = URLUnencode(document.URL);
  window.open(URL, null, "left=100, top=100, height=500, width=608, scrollbars=yes, toolbar=yes, menubar=yes, location=no");
  return;
}  // PrepForPrint

function URLUnencode(strURL) {
  var blank = "%20";
  var pos;
  var URL;

  URL = strURL;
  while ((pos = URL.search(blank)) != -1) {
    URL = URL.substring(0, pos) + " " + URL.substring(pos + blank.length, URL.length);
  }
  return URL;
}  // URLUnencode