<?xml version="1.0"?>

<?xml-stylesheet type="text/xsl" 
  href="../ApplyEmbeddedStylesheet.xsl?board5bALL.xml"?>
<?xml-stylesheet type="text/xsl" href="#drawBoard"?>

<!DOCTYPE catalog [
<!ATTLIST xsl:stylesheet id ID #REQUIRED>
]>

<board>
  <notation>1. b3 e5 2. d3 e4 3. Kd2 exd3 4. Kc3 dxe2 5. Kb2 exd1N#</notation>
  <row>
    <f>br</f><f>bn</f><f>bb</f><f>bq</f><f>bk</f><f>bb</f><f>bn</f><f>br</f>
  </row> 
  <row>
    <f>bp</f><f>bp</f><f>bp</f><f>bp</f><f>  </f><f>bp</f><f>bp</f><f>bp</f>
  </row> 
  <row>
    <f>  </f><f>  </f><f>  </f><f>  </f><f>  </f><f>  </f><f>  </f><f>  </f>
  </row>
  <row>
    <f>  </f><f>  </f><f>  </f><f>  </f><f>  </f><f>  </f><f>  </f><f>  </f>
  </row>
  <row>
    <f>  </f><f>  </f><f>  </f><f>  </f><f>  </f><f>  </f><f>  </f><f>  </f>
  </row>
  <row>
    <f>  </f><f>wp</f><f>  </f><f>  </f><f>  </f><f>  </f><f>  </f><f>  </f>
  </row>
  <row>
    <f>wp</f><f>wk</f><f>wp</f><f>  </f><f>  </f><f>wp</f><f>wp</f><f>wp</f>
  </row>
  <row>
    <f>wr</f><f>wn</f><f>wb</f><f>bn</f><f>  </f><f>wb</f><f>wn</f><f>wr</f>
  </row>

<xsl:stylesheet version="1.0" id="drawBoard"
    xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
>

  <xsl:output method="html"/>

  <!-- draw outer border -->
  <xsl:template match="/">
    <html>
    <body><table border="1"><tr><td>
    <xsl:apply-templates select="board"/>
    </td></tr></table>
    <p/><xsl:value-of select="board/notation"/>
    </body></html>
  </xsl:template>

  <!-- draw board of fields without spacing -->
  <xsl:template match="board">
    <table cellpadding="0" cellspacing="0">
    <xsl:apply-templates select="row"/>
    </table>
  </xsl:template>

  <!-- row -->
  <xsl:template match="row">
    <tr>
    <xsl:apply-templates select="f">
      <xsl:with-param name="row" select="position()"/>
    </xsl:apply-templates>
    </tr>
  </xsl:template>

  <!-- field -->
  <xsl:template match="f">
    <xsl:param name="row"/>
    <td>
    <xsl:call-template name="img">
      <xsl:with-param name="col" 
        select="substring('wb',1+((position()+$row) mod 2),1)"/>
    </xsl:call-template>
    </td>
  </xsl:template>

  <!-- image based on figure name "." and field color $col -->
  <xsl:template name="img">
    <xsl:param name="col"/>

    <xsl:element name="img">
      <xsl:attribute name="style">display:block</xsl:attribute>
      <xsl:attribute name="src">
        gif/<xsl:value-of select="normalize-space(.)"/><xsl:value-of 
        select="$col"/>.gif</xsl:attribute> 
        <!-- no space after .gif for Safari/Chrome -->
    </xsl:element>
  </xsl:template>

</xsl:stylesheet>

</board>
