Example 17-43: Stylesheet to render a set of HTML tabs for a frameset

<?xml version="1.0"?>
<!-- tab.xsl: Format a data-driven tab display -->
<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0">
  <xsl:output method="html" indent="no"/>
  <xsl:param name="tab"/>                  <!-- Allow setting tab externally -->
  <xsl:param name="lasttab"/>
  <xsl:param name="thispage"/>
  <xsl:variable name="i" select="'images/'"/> <!-- Prefix for Image URL's    -->
  <xsl:variable name="cur">                   <!-- Determine the current tab -->
    <xsl:choose>
      <!-- If $tab param is set, use it as the current value -->
      <xsl:when test="$tab"><xsl:value-of select="$tab"/></xsl:when>
      <!-- Else If $lasttab param is set, use it as the current value -->
      <xsl:when test="$lasttab"><xsl:value-of select="$lasttab"/></xsl:when>
      <!-- Else use the id of the first tab in the /site/tabs set -->
      <xsl:otherwise>
        <xsl:value-of select="/site/tabs/tab[1]/@id"/>
      </xsl:otherwise>
    </xsl:choose>
  </xsl:variable>
  <xsl:template match="/">  <!-- ROOT Template -->
    <html>
      <head>
         <link rel="stylesheet" type="text/css" href="site.css"/>
      </head>
      <body bdgcolor="#FFFFFF" leftmargin="0" topmargin="0">
      <xsl:apply-templates/>
      </body>
    </html>
  </xsl:template>
  <!-- Template matching the <site> structure in the XSQL page -->
  <xsl:template match="site">
    <table width="100%" cellpadding="0" cellspacing="0" border="0">
      <tr>
        <td align="LEFT" rowspan="2">
          <a href="../index.html" target="_parent">
            <img src="{$i}banner.gif" width="342" height="69" border="0"/>
          </a>
        </td>
      </tr>
      <tr>
        <td width="98%">&#160;</td>
        <td valign="bottom" align="right">
          <table border="0" cellpadding="0" cellspacing="0">
            <tr>
              <td align="right">
                <xsl:apply-templates select="tabs/tab"/>
              </td>
           </tr>
          </table>
        </td>
      </tr>
    </table>
    <table width="100%" cellpadding="0" cellspacing="0" border="0">
      <tr>
        <td align="right" valign="top" bgcolor="white" height="21" width="100%">
          <img src="{$i}bottom_middle.gif" height="6" width="100%" />
        </td>
      </tr>
    </table>
  </xsl:template>
  <!-- Match a regular tab -->
  <xsl:template match="tab">
    <td bgcolor="#B6B687" width="1%" align="LEFT" valign="TOP"><img
    src="{$i}tab_open.gif" height="21" width="13" border="0" /></td>
    <td width="1%" bgcolor="#B6B687">
      <a target="contents" href="{@id}.xsql"
         onclick="location.href='site.xsql?tab={@id}'">
        <font size="-1" face="Arial" color="#000000">
          <xsl:value-of select="@name"/>
        </font>
      </a>
    </td>
    <td bgcolor="#B6B687" width="1%" align="RIGHT" valign="TOP">
      <img src="{$i}tab_close.gif" height="21" width="10" border="0"/>
    </td>
  </xsl:template>
  <!-- Match the currently selected tab -->
  <xsl:template match="tab[@id=$cur]">
    <td bgcolor="#336699" width="1%" align="LEFT" valign="TOP">
      <img src="{$i}ctab_open.gif" height="21" width="18" border="0"/>
    </td>
    <td width="1%" bgcolor="#336699">
      <b>
        <font size="-1" face="Arial" color="#FFFFFF">
          <xsl:value-of select="@name"/>
        </font>
      </b>
    </td>
    <td bgcolor="#336699" width="1%" align="RIGHT" valign="TOP">
      <img src="{$i}ctab_close.gif" height="21" width="12" border="0"/>
    </td>
  </xsl:template>
</xsl:stylesheet>